/* ===== SEA = cartoon theme (thick outline + hard shadow + candy colours) ===== */
:root:not([data-theme]) body{background:radial-gradient(circle at 12% 18%,#ffffff2e 0 3px,transparent 4px),radial-gradient(circle at 82% 8%,#ffffff26 0 5px,transparent 6px),radial-gradient(circle at 70% 60%,#ffffff1f 0 4px,transparent 5px),radial-gradient(circle at 25% 75%,#ffffff1c 0 6px,transparent 7px),linear-gradient(180deg,#3fb6ff 0%,#1e88f0 40%,#1060d6 75%,#0b4bb4 100%);background-attachment:fixed;color:#fff}
:root:not([data-theme]) body::before{opacity:.5;background:repeating-radial-gradient(ellipse at 50% 100%,transparent 0 18px,#ffffff30 19px 22px,transparent 23px 38px)}
:root:not([data-theme]) .boat-page h1{color:#fff;text-shadow:0 3px 0 #08306b,0 0 1px #08306b}
:root:not([data-theme]) .site-brand p{color:#ffe14d!important;text-shadow:0 2px 0 #08306b}
:root:not([data-theme]) .boat-page>header button,:root:not([data-theme]) .back{border:2.5px solid #08306b;border-radius:14px;background:#ffffff;color:#08306b;box-shadow:0 4px 0 #08306b}
:root:not([data-theme]) .boat-page>header button:active{transform:translateY(3px);box-shadow:0 1px 0 #08306b}
:root:not([data-theme]) .panel{border:3px solid #08306b;background:#1673e0;box-shadow:0 6px 0 #08306b,inset 0 2px 0 #ffffff33;backdrop-filter:none}
:root:not([data-theme]) .eyebrow{color:#ffe14d}
:root:not([data-theme]) .ship-hero{border-bottom:3px solid #08306b}
:root:not([data-theme]) .ship-hero::after{background:linear-gradient(180deg,transparent 30%,#1673e0 96%)}
:root:not([data-theme]) .ship-hero h2{text-shadow:0 3px 0 #08306b}
:root:not([data-theme]) .ship-hero p,:root:not([data-theme]) .setup>p,:root:not([data-theme]) .setup>small,:root:not([data-theme]) .panel-head small,:root:not([data-theme]) .letter-head small,:root:not([data-theme]) .hearts-picker>div:first-child small,:root:not([data-theme]) .room-setup #roomCount,:root:not([data-theme]) .room-bar span{color:#d6ecff}
:root:not([data-theme]) .mode,:root:not([data-theme]) .hearts-picker,:root:not([data-theme]) .letter-picker{border:2.5px solid #08306b;background:#2a8cf0;box-shadow:0 4px 0 #08306b}
:root:not([data-theme]) .mode small{color:#e3f2ff}
:root:not([data-theme]) .mode:active{transform:translateY(3px);box-shadow:0 1px 0 #08306b}
:root:not([data-theme]) .heart-stepper button{border:2px solid #08306b;background:#fff;color:#ff4d6d;box-shadow:0 3px 0 #08306b}
:root:not([data-theme]) .heart-stepper strong{border:2px solid #08306b;background:#ff4d6d;color:#fff;box-shadow:0 3px 0 #08306b}
:root:not([data-theme]) .letter-head strong,:root:not([data-theme]) .letter-grid button.picked{border:2px solid #08306b;background:#ffe14d;color:#08306b;box-shadow:0 3px 0 #08306b}
:root:not([data-theme]) .letter-grid button{border:2px solid #08306b;background:#fff;color:#08306b;box-shadow:0 3px 0 #08306b}
:root:not([data-theme]) .primary{border:2.5px solid #08306b;background:#ffe14d;color:#08306b;box-shadow:0 5px 0 #08306b}
:root:not([data-theme]) .primary:active{transform:translateY(3px);box-shadow:0 2px 0 #08306b}
:root:not([data-theme]) .setup input,:root:not([data-theme]) .words-panel input,:root:not([data-theme]) .add-player input,:root:not([data-theme]) .player-sheet input,:root:not([data-theme]) #roomCode{border:2.5px solid #08306b;background:#fff;color:#08306b;font-weight:800}
:root:not([data-theme]) .setup input::placeholder,:root:not([data-theme]) .words-panel input::placeholder,:root:not([data-theme]) .add-player input::placeholder{color:#6d8fbf}
:root:not([data-theme]) .setup input:focus,:root:not([data-theme]) .words-panel input:focus,:root:not([data-theme]) .add-player input:focus{border-color:#08306b;box-shadow:0 0 0 3px #ffe14d}
:root:not([data-theme]) .setup form button,:root:not([data-theme]) .words-panel form button,:root:not([data-theme]) .add-player button,:root:not([data-theme]) .player-sheet form button{border:2.5px solid #08306b;background:#38d97a;color:#08306b;box-shadow:0 3px 0 #08306b}
:root:not([data-theme]) .setup-players span,:root:not([data-theme]) .room-players>div{border:2px solid #08306b;background:#fff;color:#08306b}
:root:not([data-theme]) .share-actions button{border:2px solid #08306b;background:#fff;color:#08306b;box-shadow:0 3px 0 #08306b}
:root:not([data-theme]) .room-bar{border:2px solid #08306b;background:#0d58bd}
:root:not([data-theme]) .close-section{border:2px solid #08306b;background:#fff;color:#08306b}
:root:not([data-theme]) .panel-head>span{text-shadow:0 2px 0 #08306b}
:root:not([data-theme]) .panel-head strong{border:2px solid #08306b;background:#ffe14d;color:#08306b}
:root:not([data-theme]) .words-panel form>label{color:#ffe14d;text-shadow:0 1px 0 #08306b}
:root:not([data-theme]) .player{border:2.5px solid #08306b;background:#2a8cf0;box-shadow:0 3px 0 #08306b}
:root:not([data-theme]) .player>span{border:2px solid #08306b;background:#fff;color:#08306b}
:root:not([data-theme]) .player small{color:#ff4d6d;text-shadow:0 1px 0 #fff}
:root:not([data-theme]) .player.active{border-color:#08306b;background:#ffe14d;color:#08306b;box-shadow:0 3px 0 #08306b}
:root:not([data-theme]) .player.active b{color:#08306b}
:root:not([data-theme]) .player.active>span{background:#ff7b3d;color:#fff}
:root:not([data-theme]) .edit-player{border:2px solid #08306b;background:#fff;color:#08306b}
:root:not([data-theme]) .words>p{color:#d6ecff}
:root:not([data-theme]) .word{border:2.5px solid #08306b;background:#ffe14d;color:#08306b;box-shadow:0 3px 0 #08306b}
:root:not([data-theme]) .word:nth-child(6n+2){background:#ff8fb1}
:root:not([data-theme]) .word:nth-child(6n+3){background:#5ee89a}
:root:not([data-theme]) .word:nth-child(6n+4){background:#ffae4f}
:root:not([data-theme]) .word:nth-child(6n+5){background:#7fe4ff}
:root:not([data-theme]) .word:nth-child(6n){background:#c4a8ff}
:root:not([data-theme]) .word i{border:2px solid #08306b;background:#fff;color:#08306b;font-weight:900}
:root:not([data-theme]) .word b{color:#08306b}
:root:not([data-theme]) .word small{color:#08306bcc;font-weight:800}
:root:not([data-theme]) .voyage-banner{border:3px solid #08306b;background:radial-gradient(circle at 50% 60%,#fff6b0 0 10px,#ffe14d 11px 17px,#ffe14d55 18px 22px,transparent 23px),linear-gradient(180deg,#7fd3ff 0%,#b5e8ff 55%,#1e88f0 56%,#1060d6 100%);box-shadow:0 6px 0 #08306b}
:root:not([data-theme]) .voyage-banner::before{opacity:.8;background:repeating-radial-gradient(ellipse at 50% 100%,transparent 0 17px,#ffffff66 18px 21px,transparent 22px 35px)}
:root:not([data-theme]) .voyage-banner::after{background:none}
:root:not([data-theme]) .voyage-copy{text-shadow:none}
:root:not([data-theme]) .voyage-copy input{border:2.5px solid #08306b;background:#fff;color:#08306b;box-shadow:0 3px 0 #08306b}
:root:not([data-theme]) .voyage-copy p{color:#08306b;font-weight:900;text-shadow:0 1px 0 #fff}
:root:not([data-theme]) .sailing-ship{filter:drop-shadow(0 3px 0 #08306b88)}
:root:not([data-theme]) .voyage-banner .letter-badge{border:2.5px solid #08306b;background:#ffe14d;box-shadow:0 3px 0 #08306b}
:root:not([data-theme]) .letter-badge small,:root:not([data-theme]) .letter-badge b{color:#08306b}
:root:not([data-theme]) .letter-badge em{background:#08306b;color:#ffe14d}
:root:not([data-theme]) .host-card form{border:2.5px solid #08306b;background:#fff;box-shadow:0 3px 0 #08306b}
:root:not([data-theme]) .host-card form small{color:#08306b}
:root:not([data-theme]) .host-card form input{border-color:#08306b55;background:#eef7ff;color:#08306b}
:root:not([data-theme]) .host-card form input::placeholder{color:#6d8fbf}
:root:not([data-theme]) .host-card form button{border:1.5px solid #08306b;background:#ffe14d;color:#08306b}
:root:not([data-theme]) .host-show{box-shadow:0 3px 0 #08306b,0 0 0 2.5px #08306b;background:conic-gradient(from var(--host-a,0deg),#ffe14d,#ff8fb1,#5ee89a,#7fe4ff,#ffe14d)}
:root:not([data-theme]) .host-show::before{background:#ffffff}
:root:not([data-theme]) .host-show small{color:#ff7b3d}
:root:not([data-theme]) .host-track b{color:#08306b;text-shadow:none}
:root:not([data-theme]) .notice{border:2.5px solid #08306b;background:#fff;color:#08306b;box-shadow:0 5px 0 #08306b}
:root:not([data-theme]) .notice small{color:#2d5a96}
:root:not([data-theme]) .notice.duplicate{border-color:#08306b;background:#ffd0da}
:root:not([data-theme]) .letter-sheet{background:#08306b99}
:root:not([data-theme]) .letter-sheet>div{border:3px solid #08306b;background:#1673e0;box-shadow:0 -6px 0 #08306b}
:root:not([data-theme]) .letter-sheet p{color:#d6ecff}
:root:not([data-theme]) .letter-sheet .sheet-close{border:2px solid #08306b;background:#fff;color:#08306b}
:root:not([data-theme]) .remove-player{border:2px solid #08306b;background:#ff4d6d;color:#fff}
:root:not([data-theme]) .finish{background:#0b4bb4ee}
:root:not([data-theme]) .finish>div{border:3px solid #08306b;background:#ffe14d;color:#08306b;box-shadow:0 8px 0 #08306b}
:root:not([data-theme]) .finish small{color:#08306b}
:root:not([data-theme]) #hornBtn.honk{animation:none}

/* ===== SUNSET = stronger neon glow ===== */
:root[data-theme=sunset] body{background:radial-gradient(circle at 15% 10%,#ff3d7f55,transparent 32%),radial-gradient(circle at 90% 35%,#ffb34740,transparent 30%),radial-gradient(circle at 50% 100%,#9b4dff55,transparent 48%),linear-gradient(160deg,#1b0636,#2c0d5a 52%,#46104a)}
:root[data-theme=sunset] .panel{border-color:#ff7fb0aa;box-shadow:0 0 0 1px #ff7fb033,0 0 22px #ff4f9a55,0 0 60px #9b4dff33,inset 0 0 22px #ff6b8b1f}
:root[data-theme=sunset] .boat-page h1{text-shadow:0 0 8px #ffcf6b,0 0 22px #ff6b8b}
:root[data-theme=sunset] .boat-page>header button{border-color:#ff8fb099;box-shadow:0 0 12px #ff6b8b66,inset 0 0 8px #ff6b8b33}
:root[data-theme=sunset] .primary{box-shadow:0 0 16px #ff6b8baa,0 0 40px #ffcf6b55}
:root[data-theme=sunset] .voyage-banner{border-color:#ffc35ccc;box-shadow:0 0 18px #ff6b8b88,0 0 50px #9b4dff55;animation:neon-pulse 3s ease-in-out infinite}
:root[data-theme=sunset] .voyage-copy input{border-color:#ff8fb0aa;box-shadow:0 0 14px #ff6b8b77;text-shadow:0 0 10px #ffcf6b}
:root[data-theme=sunset] .voyage-banner .letter-badge{box-shadow:0 0 16px #ffc35caa,inset 0 0 10px #ffc35c33}
:root[data-theme=sunset] .letter-badge b{text-shadow:0 0 10px #ffcf6b,0 0 20px #ff6b8b}
:root[data-theme=sunset] .host-show{box-shadow:0 0 18px #ff6b8bbb,0 0 36px #a77bff66}
:root[data-theme=sunset] .player{border-color:#ff8fb044;box-shadow:0 0 8px #ff6b8b22}
:root[data-theme=sunset] .player.active{border-color:#ffcf6b;box-shadow:0 0 16px #ffc35caa,0 0 34px #ff6b8b55;animation:neon-pulse 2.4s ease-in-out infinite}
:root[data-theme=sunset] .player small{text-shadow:0 0 8px #ff3d6b}
:root[data-theme=sunset] .word{border-color:#ff8fb0aa;box-shadow:0 0 12px #ff6b8b66,inset 0 0 10px #ff6b8b26}
:root[data-theme=sunset] .word:nth-child(3n+2){border-color:#ffc35caa;box-shadow:0 0 12px #ffc35c66,inset 0 0 10px #ffc35c22}
:root[data-theme=sunset] .word:nth-child(3n){border-color:#b48cffaa;box-shadow:0 0 12px #a77bff77,inset 0 0 10px #a77bff26}
:root[data-theme=sunset] .word b{text-shadow:0 0 8px #ffffffaa}
:root[data-theme=sunset] .setup input:focus,:root[data-theme=sunset] .words-panel input:focus,:root[data-theme=sunset] .add-player input:focus{box-shadow:0 0 0 2px #ff6b8b55,0 0 18px #ff6b8b66}
:root[data-theme=sunset] .setup form button,:root[data-theme=sunset] .words-panel form button,:root[data-theme=sunset] .add-player button{box-shadow:0 0 14px #ff6b8b88}
:root[data-theme=sunset] .panel-head strong{box-shadow:0 0 12px #ff6b8b77}
:root[data-theme=sunset] .notice{box-shadow:0 0 24px #ff6b8b66}
:root[data-theme=sunset] .finish>div{box-shadow:0 0 40px #ffc35c77,0 0 90px #ff6b8b55}
:root[data-theme=sunset] .theme-dot{box-shadow:0 0 0 2px #ffffff40,0 0 16px #ff6b8b}
@keyframes neon-pulse{50%{filter:brightness(1.12) saturate(1.15)}}
@media(prefers-reduced-motion:reduce){:root[data-theme=sunset] .voyage-banner,:root[data-theme=sunset] .player.active{animation:none}}