/* Source: src/styles/games/cardume.css */
*{box-sizing:border-box}body{margin:0;background:#031723 url('../assets/ocean-depth.svg') center/cover fixed;color:#eefcff;font:15px 'DM Sans',sans-serif}body:before{content:"";position:fixed;inset:0;background:#021625c5;pointer-events:none}.wrap{position:relative;max-width:850px;margin:0 auto;padding:0 18px}header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #326a7e;padding:24px 0;gap:16px}.logo{text-decoration:none;color:#ecffff;font:800 29px 'Outfit';letter-spacing:5px}.logo small{display:block;color:#91d7df;font:600 9px 'DM Sans';letter-spacing:2px}.back{font-size:13px;color:#baecf0;text-decoration:none}.heading{text-align:center;padding:38px 0 24px}.heading .overline{font-size:11px;color:#73e8d7;font-weight:800;letter-spacing:2px}.heading h1{font:800 clamp(32px,7vw,56px) 'Outfit';margin:15px 0}.heading h1 em{color:#63e8cb;font-style:normal}.heading p{color:#b7d7df;line-height:1.7;max-width:580px;margin:auto}.game{background:linear-gradient(155deg,#092d40ed,#041c2df5);border:1px solid #3289a2;box-shadow:0 28px 90px #0008;border-radius:22px;padding:clamp(15px,3vw,30px)}.statusline{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid #376c7e;padding-bottom:17px;margin-bottom:18px;color:#b4e3e7;font-size:12px;letter-spacing:.7px}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.tile{min-height:76px;overflow-wrap:anywhere;padding:8px 4px;display:grid;place-items:center;font:800 clamp(11px,1.8vw,16px) 'DM Sans';color:#e9f7fa;background:linear-gradient(160deg,#25465a,#113247);border:1px solid #4c768b;border-radius:11px;cursor:pointer;text-transform:uppercase;transition:background .14s,transform .14s}.tile[aria-pressed=true]{background:#168a89;border-color:#8bfff1;box-shadow:inset 0 0 0 2px #66efe5}.tile:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid #ffdb7d;outline-offset:3px}.tile:hover{transform:translateY(-1px);border-color:#70bac8}.solved{display:grid;gap:8px;margin-bottom:12px}.solution{text-align:center;padding:14px 10px;color:#071e29;border-radius:10px}.solution strong{display:block;font-size:14px}.solution span{display:block;font-size:12px;margin-top:5px}.solution[data-group="0"]{background:#f0cf7c}.solution[data-group="1"]{background:#8ddbaf}.solution[data-group="2"]{background:#91c9e9}.solution[data-group="3"]{background:#c6a3e8}.notice{text-align:center;min-height:25px;color:#bdece7;font-size:13px;margin:18px auto}.actions,.lower{display:flex;flex-wrap:wrap;justify-content:center;gap:9px}.lower{margin-top:20px;border-top:1px solid #376b79;padding-top:18px}button{cursor:pointer;background:#174257;border:1px solid #407c91;padding:12px 16px;border-radius:10px;color:#e8faff;font-weight:800;font-family:inherit}button:hover:not(:disabled){background:#23677a}button:disabled{opacity:.42;cursor:not-allowed}.primary{background:linear-gradient(115deg,#43e5c2,#32b8d4);color:#052838;border-color:transparent}.actions button{flex:1}footer{display:flex;justify-content:space-between;gap:14px;padding:25px 0;color:#9ac3d0;font-size:11px}dialog{background:#092b3e;color:#ecffff;max-width:440px;width:92vw;border:1px solid #55abba;border-radius:18px;padding:26px;line-height:1.65}dialog::backdrop{background:#00111bce}dialog p{color:#b7dbe0}.close{float:right;padding:5px 12px}@media(max-width:520px){.wrap{padding:0 10px}header{padding:17px 0}.logo{font-size:24px}.back{font-size:11px}.heading{padding:23px 0}.tile{min-height:62px;font-size:clamp(9px,2.7vw,13px);border-radius:7px}.grid{gap:5px}.actions button{flex-basis:40%;font-size:12px}.statusline{font-size:10px}.solution{padding:10px 5px}footer{flex-direction:column}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* Source: src/styles/shared/mare-system.css */

:root{color-scheme:dark;--ocean:#031724;--surface:#062638;--line:#32869c;--text:#edfcff;--muted:#bad3df;--cyan:#51dce7;--teal:#4fe7ce;--gold:#f3cf74}
*{box-sizing:border-box}html{scroll-behavior:smooth}
.mare-hub{font:15px 'DM Sans',sans-serif;background:#041926 url('../assets/ocean-depth.svg') center/cover fixed;color:var(--text);margin:0;min-height:100vh}
.mare-hub:before{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(90deg,#031624c4,#0322358c 50%,#031624b8)}
.mare-hub a{text-decoration:none;color:inherit}.mar-top,.mar-container,.mar-footer{width:min(1400px,calc(100% - 40px));margin:auto}.mar-top{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:19px 0;border-bottom:1px solid #83d4e43e}
.mar-logo{font:500 35px 'Outfit',sans-serif;letter-spacing:9px;white-space:nowrap}.mar-logo small{display:block;letter-spacing:2px;font:600 10px 'DM Sans',sans-serif;color:#75dce1}
.mar-top nav{display:flex;gap:24px;font-size:13px;color:#d2e8ef}.mar-top nav a:hover{color:#76f8e1}
.mar-hero{padding:66px 12px 35px}.mar-eyebrow{font-size:11px;letter-spacing:2px;color:#73ecdf;font-weight:800}.mar-hero h1{font:800 clamp(38px,5vw,72px)/1.08 'Outfit',sans-serif;letter-spacing:-1.6px;margin:15px 0}.mar-hero h1 em{font-style:normal;color:#8ce9f0}.mar-hero p{color:#b9e0e7;font-size:clamp(16px,2vw,23px)}
.mar-catalog{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.mar-game{min-height:410px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;border:1px solid #49bbd5a6;background:linear-gradient(180deg,#031b2a23 0%,#03172299 40%,#031321fa 84%),url('../assets/ocean-depth.svg') center/cover;border-radius:18px;padding:20px;box-shadow:0 15px 58px #00101c70;transition:transform .2s ease,border-color .2s ease}.mar-game:hover{transform:translateY(-4px);border-color:#7ff6e7}.mar-abyss{background-position:25% center}.mar-school{background-position:75% center}.mar-current{background-position:100% center}.mar-letters{background-position:12% center}
.mar-tag{align-self:flex-start;border:1px solid #5bd6e3aa;background:#03283bd6;border-radius:999px;padding:8px 11px;font-size:11px;color:#dff9ff}.mar-game-info h2{font:800 32px 'Outfit';margin:0 0 10px}.mar-game-info p{line-height:1.6;color:#d5eaf0;font-size:13px;min-height:64px;margin:0 0 12px}.mar-game-info .mar-detail{color:#79dfe4;font-size:12px;min-height:32px}.mar-mode-links{display:flex;gap:4px;margin:8px 0 15px}.mar-mode-links a{flex:1;text-align:center;padding:8px 2px;border-radius:8px;background:#07364be8;border:1px solid #369ab1;font-size:10px}
.mar-cta{display:flex;align-items:center;justify-content:space-between;gap:10px;background:linear-gradient(145deg,#0d7488,#073f59);border:1px solid #5cdeeb;border-radius:10px;padding:13px 14px;color:#f7ffff!important;font-weight:800;font-size:13px;box-shadow:inset 0 1px #e5ffff35}.mar-cta:hover{background:#147b91}.mar-cta span{font-size:20px}
.mar-continue{margin:22px 0 36px;padding:24px;display:flex;align-items:center;justify-content:space-between;gap:22px;border-radius:18px;border:1px solid #4194a7;background:linear-gradient(100deg,#052536ee,#071e31f5);box-shadow:0 15px 55px #00101c70}.mar-continue h2{font:700 24px 'Outfit';margin:9px 0}.mar-continue p{color:#c2d8e2;margin:0}.mar-continue .mar-cta{min-width:180px;justify-content:center}.mar-about{padding:16px 0 45px;color:#b7d8df}.mar-about span{color:#7ee5e0;font-size:11px;letter-spacing:2px}.mar-footer{border-top:1px solid #5acfe144;padding:22px 0 35px;display:flex;justify-content:space-between;color:#9dc8d2;font-size:12px}
.return-link{max-width:1450px;margin:20px auto 0;padding:0 22px;color:#e7ffff}.return-link a{color:#93e8e4;text-decoration:none;font-size:13px}.return-link h2{font:800 clamp(30px,4vw,48px) 'Outfit';margin:7px 0}.return-link p{color:#cae2ec;margin:0}.mar-cta:focus-visible,.mare-hub a:focus-visible,.return-link a:focus-visible{outline:3px solid #ffde87;outline-offset:3px}
@media(max-width:1120px){.mar-catalog{grid-template-columns:repeat(2,minmax(0,1fr))}.mar-game{min-height:355px}}
@media(max-width:650px){.mar-top,.mar-container,.mar-footer{width:calc(100% - 24px)}.mar-top{padding:12px 0}.mar-logo{font-size:25px;letter-spacing:5px}.mar-logo small{font-size:8px;letter-spacing:1px}.mar-top nav{gap:12px;font-size:12px}.mar-hero{padding:40px 2px 22px}.mar-hero h1{letter-spacing:-.7px}.mar-catalog{grid-template-columns:1fr;gap:12px}.mar-game{min-height:285px;padding:16px}.mar-game-info p{min-height:0}.mar-continue{flex-direction:column;align-items:stretch;padding:18px}.mar-footer{flex-direction:column;gap:8px}.return-link{padding:0 12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.mar-game{transition:none}.mar-game:hover{transform:none}}
/* Shared application shell: all MARÉ experiences */
.mar-app{font-family:'DM Sans',sans-serif;color:var(--text);background-color:var(--ocean)}
.mar-app header{min-height:76px;border-bottom:1px solid #73d2e144}
.mar-app header .brand,.mar-app header .logo{font:600 28px 'Outfit',sans-serif;letter-spacing:7px}
.mar-app header .brand small,.mar-app header .logo small{font:600 9px 'DM Sans',sans-serif;letter-spacing:2px;color:#8bdae0;margin-top:4px}
.mar-app header .back{font-weight:700;color:#9fe7e9}
.mar-app .hero h1,.mar-app .heading h1,.mar-app .intro h1{font-family:'Outfit',sans-serif;letter-spacing:-1px}
.mar-app .panel,.mar-app .game{border-color:#4096aaa8;box-shadow:0 20px 65px #00101c80,inset 0 1px #baf7ff17}
.mar-app button{min-height:43px;transition:background .16s ease,border-color .16s ease}
.mar-app input{min-height:48px}
.mar-app button:focus-visible,.mar-app a:focus-visible,.mar-app input:focus-visible{outline:3px solid #f9d781;outline-offset:3px}
.mar-app footer{border-top:1px solid #60c8de3d;margin-top:24px}
.mar-app .empty{color:#b4d6e0}
@media(max-width:600px){.mar-app header{min-height:64px}.mar-app header .brand,.mar-app header .logo{font-size:22px;letter-spacing:4px}.mar-app button{min-height:44px}.mar-app .panel,.mar-app .game{border-radius:15px}.mar-app .grid .tile{font-size:clamp(12px,2.8vw,15px);line-height:1.15;min-height:67px;padding:6px 2px;hyphens:auto;overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){.mar-app button{transition:none}}


/* MARÉ • Galeria de fundos exclusivos (imagem WebP + fallback vetorial) */
:root{--mare-fundo-reserva:url('../assets/ocean-depth.svg')}
body.mare-hub,body.mare-recife,body.mare-abismo,body.mare-cardume,body.mare-corrente,body.mare-concha{
 background-color:#021523;
 background-repeat:no-repeat,no-repeat,no-repeat;
 background-position:center,center,center;
 background-size:cover,cover,cover;
 background-attachment:fixed,fixed,fixed;
}
body.mare-hub,body.mare-recife{
 background-image:linear-gradient(90deg,#021521b0,#03162683 55%,#02152196),url('../assets/backgrounds/recife.webp'),var(--mare-fundo-reserva)!important
}
body.mare-abismo{
 background-image:linear-gradient(90deg,#021421b7,#0415238c 55%,#02162398),url('../assets/backgrounds/abismo.webp'),var(--mare-fundo-reserva)!important
}
body.mare-cardume{
 background-image:linear-gradient(90deg,#021421b0,#03172383 55%,#0216239e),url('../assets/backgrounds/cardume.webp'),var(--mare-fundo-reserva)!important
}
body.mare-corrente{
 background-image:linear-gradient(90deg,#021421b8,#03172388 55%,#0216239e),url('../assets/backgrounds/corrente.webp'),var(--mare-fundo-reserva)!important
}
body.mare-concha{
 background-image:linear-gradient(90deg,#021421b0,#03172383 55%,#0216239e),url('../assets/backgrounds/concha.webp'),var(--mare-fundo-reserva)!important
}
/* Fundo do Recife tem outras camadas visuais legadas: mantenha o jogo à frente da arte. */
body.mare-recife:before,body.mare-recife:after{pointer-events:none}
@media(max-width:720px){
 body.mare-hub,body.mare-recife,body.mare-abismo,body.mare-cardume,body.mare-corrente,body.mare-concha{
  background-attachment:scroll,scroll,scroll;
  background-position:center,64% center,center;
 }
}

/* Catálogo MARÉ: ambientações exclusivas por jogo, com arte SVG sempre disponível. */
.mare-hub .mar-game{background-repeat:no-repeat;background-size:cover;background-position:center;isolation:isolate}
.mare-hub .mar-game::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#0017260d 5%,#01152168 36%,#01131deb 73%,#01131bf5 100%)}
.mare-hub .mar-letters{background-image:linear-gradient(180deg,#041c2915,#02121c55),url('../assets/backgrounds/recife.webp'),url('../assets/backgrounds/recife.svg')}
.mare-hub .mar-abyss{background-image:linear-gradient(180deg,#041c2915,#02121c55),url('../assets/backgrounds/abismo.webp'),url('../assets/backgrounds/abismo.svg')}
.mare-hub .mar-school{background-image:linear-gradient(180deg,#041c2915,#02121c55),url('../assets/backgrounds/cardume.webp'),url('../assets/backgrounds/cardume.svg')}
.mare-hub .mar-current{background-image:linear-gradient(180deg,#041c2915,#02121c55),url('../assets/backgrounds/corrente.webp'),url('../assets/backgrounds/corrente.svg')}
.mare-hub .mar-shell{background-image:linear-gradient(180deg,#041c2915,#02121c55),url('../assets/backgrounds/concha.webp'),url('../assets/backgrounds/concha.svg')}
.mare-hub .mar-catalog{grid-template-columns:repeat(3,minmax(0,1fr))}
.mare-hub .mar-game{min-height:390px;background-color:#05263a}
.mare-hub .mar-game-info{position:relative;z-index:1}
@media(max-width:1050px){.mare-hub .mar-catalog{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.mare-hub .mar-catalog{grid-template-columns:minmax(0,1fr)}.mare-hub .mar-game{min-height:300px}}

/* Trilha: novo cenário e card do catálogo */
body.mare-trilha{background-image:linear-gradient(90deg,#021421c2,#03172383 55%,#021623a2),url('../assets/backgrounds/trilha.svg'),url('../assets/ocean-depth.svg')!important;background-position:center;background-size:cover}
.mare-hub .mar-trail{background-image:linear-gradient(180deg,#041c2915,#02121c55),url('../assets/backgrounds/trilha.svg')}

body.mare-enigma{background-image:linear-gradient(90deg,#021421cf,#03172395),url('../assets/backgrounds/enigma.svg'),url('../assets/ocean-depth.svg')!important;background-position:center;background-size:cover}
.mare-hub .mar-enigma{background-image:linear-gradient(180deg,#041c2915,#02121c55),url('../assets/backgrounds/enigma.svg')}

body.mare-marujo{background-image:linear-gradient(90deg,#021421cb,#03172390),url('../assets/backgrounds/marujo.svg'),url('../assets/ocean-depth.svg')!important;background-position:center;background-size:cover}
.mare-hub .mar-marujo{background-image:linear-gradient(180deg,#041c2915,#02121c55),url('../assets/backgrounds/marujo.svg')}

/* Source: src/styles/shared/mare-v2.css */
/* MARÉ 2.0 · Oceanic design system, shared across eight games */
:root{--ocean:#06131d;--surface:#102a37;--line:#4e7883;--text:#effaf8;--muted:#bad5d9;--cyan:#88ebe0;--teal:#55d8c6;--gold:#ffcd7c;--mare-radius:22px;--mare-shadow:0 24px 60px rgba(0,8,17,.36)}
body.mar-app,body.mare-recife,body.mare-abismo,body.mare-cardume,body.mare-corrente,body.mare-concha,body.mare-trilha,body.mare-enigma,body.mare-marujo{color:var(--text);background-color:#06131d;font-family:'DM Sans',sans-serif;-webkit-font-smoothing:antialiased}
.mar-app :is(h1,h2,h3),.mare-recife :is(h1,h2),.mare-abismo :is(h1,h2),.mare-cardume :is(h1,h2),.mare-corrente :is(h1,h2),.mare-concha :is(h1,h2){font-family:'Outfit',sans-serif;letter-spacing:-.035em;text-wrap:balance}
.mar-app :is(.hero,.heading,.intro,.trilha-hero,.enigma-hero,.marujo-hero){position:relative}
.mar-app :is(.panel,.game,.enigma-card,.enigma-sidebar,.trilha-panel,.trilha-side>div,.marujo-panel,.card),.mare-recife :is(.panel,.game),.mare-cardume :is(.panel,.game){border:1px solid rgba(169,226,224,.2);border-radius:var(--mare-radius);background:linear-gradient(145deg,rgba(24,61,72,.9),rgba(7,28,41,.96));box-shadow:var(--mare-shadow)}
.mar-app :is(button,input,select),.mare-recife :is(button,input),.mare-abismo :is(button,input),.mare-cardume button,.mare-corrente button,.mare-concha :is(button,input){font-family:inherit}
.mar-app button,.mare-recife button,.mare-abismo button,.mare-cardume button,.mare-corrente button,.mare-concha button{border-radius:12px;min-height:44px;transition:background .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease}
.mar-app button:not(:disabled):active,.mare-recife button:not(:disabled):active,.mare-cardume button:not(:disabled):active{transform:scale(.975)}
.mar-app :is(button,a,input):focus-visible,.mare-recife :is(button,a,input):focus-visible,.mare-abismo :is(button,a,input):focus-visible,.mare-cardume :is(button,a,input):focus-visible,.mare-corrente :is(button,a,input):focus-visible,.mare-concha :is(button,a,input):focus-visible{outline:3px solid #ffdc92;outline-offset:4px}
.mar-app :is(.brand,.logo),.mare-recife :is(.brand,.logo){letter-spacing:.14em}
.mar-app :is(.back,.brand),.mare-recife :is(.back,.brand){text-decoration:none}
.mar-app :is(.enigma-board,.trilha-grid),.mare-cardume .grid{gap:clamp(4px,1vw,10px)}
.mar-app :is(.enigma-cell,.trilha-grid button){border-radius:clamp(6px,1vw,12px);font-weight:800;box-shadow:inset 0 1px 0 rgba(255,255,255,.09)}
.mar-app :is(.enigma-cell.selected,.trilha-grid button.chosen){box-shadow:0 0 0 2px #b5f8eb,0 7px 24px rgba(30,204,183,.24)}
.mar-app :is(.enigma-actions,.trilha-actions,.enigma-modes,.trilha-mode){gap:10px;flex-wrap:wrap}
.mar-app :is(.enigma-hero,.trilha-hero){padding-block:clamp(28px,5vw,58px)}
.mar-app :is(.enigma-hero,.trilha-hero) h1{font-size:clamp(48px,7vw,88px);line-height:1;letter-spacing:-.065em}
.mar-app :is(.enigma-card,.trilha-panel){padding:clamp(14px,2.5vw,32px)}
.mar-app :is(.enigma-layout,.trilha-layout){gap:clamp(16px,2.6vw,32px)}
.mar-app :is(.notice,[role="status"]){line-height:1.5}
@media(max-width:650px){.mar-app :is(.enigma-card,.trilha-panel){border-radius:16px;padding:14px}.mar-app :is(.enigma-hero,.trilha-hero){padding-block:22px}.mar-app :is(.enigma-hero,.trilha-hero) h1{font-size:49px}.mar-app :is(.enigma-actions,.trilha-actions) button{flex:1 1 auto}.mar-app :is(.enigma-layout,.trilha-layout){gap:16px}}
@media(prefers-reduced-motion:reduce){.mar-app *, .mare-recife *, .mare-abismo *, .mare-cardume *, .mare-corrente *, .mare-concha *{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}

/* Home: typographic gallery, visible atmosphere, confident tactile interactions */
.mare-hub{--mar-aqua:#a5f0df;--mar-ink:#06131d;--mar-white:#f1faf7;--mar-mist:#bcd5d7;background:#06131d!important}
.mare-hub .mar-top{backdrop-filter:blur(18px);background:linear-gradient(180deg,rgba(4,22,34,.8),rgba(4,22,34,.05));border-bottom-color:rgba(210,246,237,.2)}
.mare-hub .mar-hero{min-height:600px;height:min(790px,95svh);background:radial-gradient(ellipse at 80% 40%,#184d59 0%,transparent 52%),#041521}
.mare-hub .mar-hero-shade{background:linear-gradient(90deg,#04141ff2 0%,#041724b5 48%,#05253024 95%),linear-gradient(0deg,#04131de8,transparent 35%)}
.mare-hub .mar-hero h1{font-weight:700;letter-spacing:-.075em;max-width:760px}
.mare-hub .mar-hero p{max-width:460px;line-height:1.6}
.mare-hub .mar-explore{border-radius:999px;padding:17px 25px;background:#b9f4de;color:#092931;box-shadow:0 12px 45px #04101955;transition:transform .2s ease,background .2s}
.mare-hub .mar-explore:hover{transform:translateY(-3px);background:#e3fff1}
.mare-hub .mar-section-head{padding-top:100px}
.mare-hub .mar-section-head h2{font-weight:700;letter-spacing:-.06em}
.mare-hub .mar-catalog{gap:20px;grid-template-columns:repeat(4,minmax(0,1fr))}
.mare-hub .mar-game{min-height:390px;border-radius:23px;border:1px solid rgba(175,225,224,.2);padding:22px;box-shadow:0 18px 55px rgba(0,7,18,.35);filter:none;transition:transform .25s cubic-bezier(.22,1,.36,1),border-color .25s,box-shadow .25s;isolation:isolate}
.mare-hub .mar-game:nth-child(1),.mare-hub .mar-game:nth-child(6){grid-column:span 2}
.mare-hub .mar-game:hover{transform:translateY(-7px);box-shadow:0 26px 65px rgba(0,7,18,.55);border-color:#a5e9db}
.mare-hub .mar-game::before{background:linear-gradient(180deg,rgba(3,20,31,.14),rgba(3,20,31,.36) 32%,#031521f2 93%)}
.mare-hub .mar-tag{border-radius:999px;padding:9px 13px;background:#062b39ae;backdrop-filter:blur(8px)}
.mare-hub .mar-game-info h2{font-size:clamp(32px,3.5vw,46px);font-weight:700;letter-spacing:-.055em}
.mare-hub .mar-game-info p{font-size:14px;line-height:1.5}
.mare-hub .mar-mode-links{gap:8px}
.mare-hub .mar-mode-links a{border:1px solid rgba(189,248,236,.25);border-radius:10px;padding:10px 7px;background:#052331bd;font-size:11px}
.mare-hub .mar-cta{border-radius:12px;padding:15px 18px;background:#b8f0dc;color:#09222c!important;font-weight:800;border:0}
.mare-hub .mar-cta:hover{background:#e6fff1}
.mare-hub .mar-continue{border-radius:22px;background:linear-gradient(110deg,#123849,#0a2634);border:1px solid #82cbc74a;box-shadow:0 20px 55px #010d1899;padding:36px}
.mare-hub .mar-continue h2{font-size:clamp(25px,3vw,38px);letter-spacing:-.04em;font-weight:700}
.mare-hub .mar-continue .mar-cta{min-width:230px}
@media(max-width:1050px){.mare-hub .mar-catalog{grid-template-columns:repeat(2,minmax(0,1fr))}.mare-hub .mar-game:nth-child(1),.mare-hub .mar-game:nth-child(6){grid-column:span 1}}
@media(max-width:650px){.mare-hub .mar-hero{height:83svh;min-height:540px}.mare-hub .mar-hero h1{font-size:clamp(54px,14vw,85px)}.mare-hub .mar-section-head{padding-top:65px}.mare-hub .mar-catalog{grid-template-columns:1fr;gap:15px}.mare-hub .mar-game{min-height:310px;padding:19px;border-radius:18px}.mare-hub .mar-game-info h2{font-size:38px}.mare-hub .mar-continue{padding:22px}.mare-hub .mar-continue .mar-cta{min-width:0}}
@media(prefers-reduced-motion:reduce){.mare-hub .mar-explore,.mare-hub .mar-game{transition:none}.mare-hub .mar-explore:hover,.mare-hub .mar-game:hover{transform:none}}

/* MARÉ 2.1 — playable surfaces, not decorative overlays */
:root{--mar-2-panel:linear-gradient(145deg,rgba(16,46,61,.97),rgba(7,27,40,.98));--mar-2-edge:rgba(156,229,223,.2);--mar-2-highlight:#b5f8e3;--mar-2-shadow:0 25px 75px rgba(0,9,17,.32)}
:is(.mare-trilha,.mare-enigma,.mare-marujo,.mare-cardume,.concha-page,.mare-corrente,.mare-abismo){background-color:#06131d!important;background-image:radial-gradient(ellipse at 80% 12%,rgba(45,126,132,.22),transparent 48%),radial-gradient(ellipse at 10% 70%,rgba(21,84,105,.25),transparent 55%)!important;background-attachment:fixed!important}
:is(.mare-trilha,.mare-enigma,.mare-marujo) :is(.trilha-shell,.enigma-shell,.marujo-shell){max-width:1280px}
:is(.mare-trilha,.mare-enigma,.mare-marujo) header{padding:22px 4px;border-bottom:1px solid rgba(178,233,225,.14);gap:16px}
:is(.mare-trilha,.mare-enigma,.mare-marujo) header .brand{font-family:Outfit,sans-serif;font-size:clamp(25px,3vw,32px);font-weight:700;letter-spacing:.15em}
:is(.mare-trilha,.mare-enigma,.mare-marujo) header .brand small{font:700 9px 'DM Sans',sans-serif;letter-spacing:.16em;color:#a1e3da}
:is(.mare-trilha,.mare-enigma,.mare-marujo) header .back{color:#bcd9dc;font-size:13px;text-decoration:none;padding:10px 0}
:is(.mare-trilha,.mare-enigma,.mare-marujo) header .back:hover{color:#effff4}
:is(.trilha-hero,.enigma-hero,.marujo-hero){text-align:left!important;max-width:900px;padding-block:clamp(30px,5vw,62px)!important}
:is(.trilha-hero,.enigma-hero,.marujo-hero)>span{font-size:11px;letter-spacing:.21em;font-weight:800;color:#88ebd9}
:is(.trilha-hero,.enigma-hero,.marujo-hero) h1{font:700 clamp(55px,8vw,100px)/.98 'Outfit',sans-serif!important;letter-spacing:-.075em!important;margin:10px 0 14px!important;color:#effbf7!important}
:is(.trilha-hero,.enigma-hero,.marujo-hero) p{max-width:610px;color:#b9d4d8;line-height:1.65;font-size:clamp(15px,1.8vw,18px)}
:is(.enigma-layout,.trilha-layout,.marujo-layout){grid-template-columns:minmax(0,1.25fr) minmax(270px,.75fr);gap:clamp(16px,2.3vw,28px)}
:is(.enigma-card,.trilha-panel,.marujo-panel,.enigma-clues,.enigma-stats,.trilha-info,.trilha-mode,.marujo-card,.concha-play,.concha-discover){background:var(--mar-2-panel)!important;border:1px solid var(--mar-2-edge)!important;border-radius:24px!important;box-shadow:var(--mar-2-shadow)!important;padding:clamp(18px,2.6vw,30px)!important}
:is(.enigma-meta,.trilha-meta,.marujo-meta,.concha-top,.concha-stat){padding-bottom:15px;border-bottom:1px solid rgba(156,229,223,.15);color:#c1dce0;align-items:center;font-weight:700}
:is(.enigma-meta,.trilha-meta,.marujo-meta) #clock{font:700 20px 'Outfit',sans-serif;font-variant-numeric:tabular-nums;color:#e9f9f7}
.trilha-clue{padding:25px 15px 20px;text-align:center}
.trilha-clue small,.enigma-current>span,.marujo-selection span{font-size:10px;font-weight:800;letter-spacing:.16em;color:#91dfd4}
.trilha-clue h2{font:700 clamp(22px,3vw,30px)/1.25 'Outfit',sans-serif;letter-spacing:-.03em;margin:12px auto;max-width:480px}
.trilha-grid{width:min(100%,430px);gap:clamp(7px,1.3vw,12px);margin:10px auto 14px}
.trilha-grid button{aspect-ratio:1;border:1px solid rgba(147,207,212,.45);border-radius:18px!important;background:linear-gradient(145deg,#1c4a58,#103040);box-shadow:inset 0 2px 0 rgba(255,255,255,.08),0 10px 20px rgba(0,10,22,.25);font:700 clamp(24px,4vw,38px) 'Outfit',sans-serif;transition:transform .14s ease,background .14s ease,box-shadow .14s ease}
.trilha-grid button.chosen{color:#052b30;background:#a4ecdd!important;border-color:#e4fffa!important;box-shadow:0 0 0 3px rgba(172,247,229,.24),0 15px 32px rgba(51,192,170,.18)}
.trilha-grid button.available:not(.chosen){border-color:#87decf}
.trilha-result,.enigma-current,.marujo-selection{background:rgba(4,22,33,.48);border:1px solid rgba(152,219,216,.15);border-radius:15px;padding:16px 20px;margin:18px 0 14px;text-align:center;min-height:79px}
.trilha-result strong,.enigma-current strong,.marujo-selection strong{font-family:Outfit,sans-serif;font-weight:700;letter-spacing:.02em}
:is(.trilha-actions,.enigma-actions,.marujo-actions){gap:10px}
:is(.trilha-actions,.enigma-actions,.marujo-actions) button{border-radius:12px;min-height:46px;padding:12px 16px;border:1px solid rgba(134,209,210,.3);background:#184251;color:#e8faf7;font-weight:700}
:is(.trilha-actions,.enigma-actions,.marujo-actions) button:hover:not(:disabled){background:#215d68;border-color:#9edbd7}
.trilha-actions .primary{background:#a4edda;color:#062d35;border:0}
:is(.trilha-info,.marujo-card) h2,.enigma-clues h2{font:700 22px 'Outfit',sans-serif;color:#e5faf5;letter-spacing:-.035em;margin:0 0 12px}
:is(.trilha-info,.marujo-card) p{color:#b9d3d9;line-height:1.7}
.trilha-mode{display:flex;gap:8px}
.trilha-mode button,.enigma-modes button,.marujo-modes button,.concha-tabs button{border-radius:999px;min-height:43px;padding:12px 17px;border:1px solid rgba(147,221,215,.28);background:#173c4b;color:#e1f7f3}
.trilha-mode button[aria-pressed=true],.enigma-modes button[aria-pressed=true],.marujo-modes button[aria-pressed=true],.concha-tabs button.active{background:#a9efdc;color:#052b34;border-color:#b9fff0}
.enigma-modes,.marujo-modes{justify-content:flex-start;margin-top:24px}
.enigma-board{width:min(100%,520px);background:#071d2b;border:6px solid #163845;border-radius:18px;padding:5px;gap:4px;margin:24px auto 17px;box-shadow:0 18px 50px #010e1959}
.enigma-cell{border-radius:7px!important;border:1px solid #416775;background:#204657;color:#eafaf7;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.enigma-cell.blank{background:#061823;border-color:#061823}
.enigma-cell.active{background:#287b83;border-color:#77dcd6}
.enigma-cell.selected{background:#b0f1df;border-color:#e7fffb;color:#062e34}
.enigma-clues button{background:#153746;color:#ecfaf7;border-radius:12px;padding:14px 15px;margin:0 0 8px;border:1px solid rgba(147,215,211,.2);text-align:left;min-height:48px}
.enigma-clues button.current{background:#a4ecda;color:#082d34;border-color:#d3fff3}
.enigma-clues button.completed{border-color:#53bf9c}
.enigma-stats{display:flex;align-items:center;justify-content:space-between}
.marujo-grid{width:min(100%,530px);gap:4px;margin:24px auto;touch-action:none}
.marujo-cell{border-radius:8px!important;background:#1c4352!important;border:1px solid #386978!important;color:#effcf9!important;font:700 clamp(11px,1.9vw,20px) 'Outfit',sans-serif!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.marujo-cell.selected{background:#a0eada!important;border-color:#dbfff7!important;color:#062e32!important}
.marujo-cell.found{background:#1c846d!important;border-color:#70ecc2!important}
.marujo-words span{background:#173d4a;border-color:#3b6976;border-radius:999px;padding:9px 13px}
.marujo-words span.found{background:#165d4c;border-color:#7be6ba;color:#d0fce0}
.mare-cardume .wrap,.mare-corrente .wrap,.mare-abismo .layout{max-width:980px}
.mare-cardume .heading h1,.mare-corrente .intro h1,.mare-abismo .hero h1,.concha-hero h1{font-size:clamp(55px,8vw,94px);font-weight:700;letter-spacing:-.075em;line-height:1;color:#effbf7}
.mare-cardume .game,.mare-corrente .panel,.mare-abismo .panel,.concha-play,.concha-discover{background:var(--mar-2-panel)!important;border:1px solid var(--mar-2-edge)!important;box-shadow:var(--mar-2-shadow)!important;border-radius:24px}
.mare-cardume .tile{min-height:clamp(64px,8vw,96px);background:linear-gradient(150deg,#244c5b,#153748);border:1px solid rgba(174,228,226,.24);border-radius:14px;font-weight:800;letter-spacing:.02em;transition:transform .14s ease,background .14s ease}
.mare-cardume .tile[aria-pressed=true]{background:#a5f0de;color:#082e35;border-color:#e2fff7}
.mare-cardume .solution{border-radius:15px;padding:17px 12px}
.mare-corrente .guess,.mare-abismo .item{border-radius:14px;border-color:rgba(156,216,217,.22);background:#123747}
.mare-corrente .letter{border-radius:9px;min-width:clamp(28px,5vw,40px);height:clamp(38px,5vw,48px)}
.concha-page .concha-shell{max-width:1200px}
.concha-page .concha-hero{text-align:left;padding-block:clamp(34px,5vw,62px)}
.concha-page .concha-hero p{margin-left:0}
.concha-page .concha-tabs{justify-content:flex-start}
.concha-board{gap:clamp(16px,2vw,26px)}
.concha-wheel{gap:10px;margin:33px auto}
.concha-letter{background:linear-gradient(145deg,#276272,#133d51);border-color:#65bfbf;border-radius:19px;box-shadow:0 10px 22px rgba(0,12,24,.22)}
.concha-letter.center{background:#aaf0df;color:#052e35;border-color:#d9fff4}
.concha-results span{border-radius:999px;padding:9px 15px;border-color:rgba(164,221,214,.3)}
:is(.mare-cardume,.mare-corrente,.mare-abismo,.concha-page,.mare-trilha,.mare-enigma,.mare-marujo) button:disabled{opacity:.46;cursor:not-allowed}
:is(.mare-cardume,.mare-corrente,.mare-abismo,.concha-page,.mare-trilha,.mare-enigma,.mare-marujo) :is(button,a,input):focus-visible{outline:3px solid #ffdc92;outline-offset:3px}
@media(max-width:840px){.enigma-layout,.trilha-layout,.marujo-layout{grid-template-columns:minmax(0,1fr)}.concha-board{grid-template-columns:1fr}.marujo-hero,.trilha-hero,.enigma-hero{padding-block:28px!important}}
@media(max-width:450px){.enigma-shell,.trilha-shell,.marujo-shell{padding-inline:10px}.enigma-card,.trilha-panel,.marujo-panel,.enigma-clues,.enigma-stats,.trilha-info,.trilha-mode,.marujo-card,.concha-play,.concha-discover{padding:15px!important;border-radius:17px!important}.enigma-board{border-width:3px;gap:2px;padding:3px}.enigma-cell{border-radius:4px!important}.trilha-grid{gap:7px}.trilha-grid button{border-radius:12px!important}.marujo-grid{gap:2px}.marujo-cell{border-radius:4px!important}.mare-cardume .tile{min-height:64px;border-radius:9px}.enigma-modes,.marujo-modes,.concha-tabs{gap:7px}.enigma-modes button,.marujo-modes button,.concha-tabs button{padding:10px 12px}}
@media(prefers-reduced-motion:reduce){.trilha-grid button,.mare-cardume .tile{transition:none!important}}


/* MARÉ 2.2 | Art direction: luminous bathymetry, not clip-art.
   Intentional CSS light fields replace legacy vector and broken image fallbacks. */
:root{--mar-depth-0:#030e19;--mar-depth-1:#071c2a;--mar-depth-2:#0c3341;--mar-glass:rgba(10,36,50,.93)}
body.mare-hub,body.mare-recife,body.mare-abismo,body.mare-cardume,body.mare-corrente,body.mare-concha,body.concha-page,body.mare-trilha,body.mare-enigma,body.mare-marujo{
  background-color:var(--mar-depth-0)!important;
  background-image:
    radial-gradient(ellipse 54% 35% at 82% 7%,rgba(82,188,177,.2),transparent 78%),
    radial-gradient(ellipse 50% 50% at 0% 65%,rgba(34,120,151,.19),transparent 78%),
    radial-gradient(ellipse 70% 65% at 83% 115%,rgba(24,86,128,.22),transparent 80%),
    linear-gradient(155deg,#071e2e 0%,#041420 45%,#020e19 100%)!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
  background-position:center!important;
  background-attachment:fixed!important
}
/* Older fixed body overlays hid the actual backgrounds, especially in Corrente. */
body.mare-corrente::before,body.mare-cardume::before,body.mare-recife::before,
body.mare-trilha::before,body.mare-enigma::before,body.mare-marujo::before,
body.concha-page::before,body.mare-concha::before,body.mare-abismo::before{
  background:none!important;box-shadow:none!important
}
/* Corrente gets an independent visual signature with subtle streaming light. */
body.mare-corrente{
  background-image:
    radial-gradient(ellipse 46% 35% at 86% 14%,rgba(98,224,212,.3),transparent 78%),
    radial-gradient(ellipse 42% 60% at 3% 65%,rgba(30,122,177,.25),transparent 75%),
    repeating-linear-gradient(116deg,transparent 0 135px,rgba(126,226,223,.018) 136px 137px,transparent 138px 270px),
    linear-gradient(158deg,#0b2b3a 0%,#061a2b 46%,#020f1c 100%)!important
}
.mare-corrente .wrap{width:min(100% - 36px,980px);isolation:isolate}
.mare-corrente .intro{text-align:left;position:relative;padding:clamp(44px,7vw,90px) 0 40px}
.mare-corrente .intro h1{font:700 clamp(66px,10vw,118px)/.95 'Outfit',sans-serif;color:#f1fcf8;letter-spacing:-.075em;margin:15px 0}
.mare-corrente .intro p{margin-left:0;max-width:590px;font-size:clamp(15px,1.8vw,19px)}
.mare-corrente .intro .switch{justify-content:flex-start;margin-top:30px}
.mare-corrente .intro::after{content:"";position:absolute;z-index:-1;pointer-events:none;right:-6%;top:2%;width:clamp(160px,39vw,400px);aspect-ratio:1;border-radius:50%;border:1px solid rgba(138,235,226,.14);background:radial-gradient(circle at 45% 43%,rgba(115,229,224,.09),rgba(4,42,62,.06) 42%,transparent 70%);box-shadow:0 0 0 30px rgba(125,218,219,.025),0 0 0 70px rgba(109,203,208,.014)}
.mare-corrente .panel{background:linear-gradient(145deg,rgba(16,51,67,.96),rgba(5,25,39,.98))!important;border:1px solid rgba(153,236,225,.27)!important;box-shadow:0 36px 80px rgba(0,8,20,.44),inset 0 1px 0 rgba(219,255,249,.07)!important}
.mare-corrente .meta,.mare-corrente .heading{border-color:rgba(155,229,219,.17)}
.mare-corrente .entry input{background:#071c2b;border-color:#487d8a;border-radius:13px}
.mare-corrente #go{background:#b1f3df;color:#052b32;border-color:#b1f3df}
.mare-corrente .guess{background:rgba(15,50,65,.9)!important;border-color:rgba(151,218,218,.22)!important;border-radius:15px}
.mare-corrente .letter{border-radius:9px;background:#284d5b;border-color:#557d88}
.mare-corrente .letter.found{background:#146e72;border-color:#78e4d3}
.mare-corrente .letter.linked{background:#1a879e;border-color:#9cecf3}
.mare-corrente .empty{border:1px dashed rgba(146,221,215,.21);border-radius:14px;background:rgba(7,29,44,.38)}
/* Remove duplicated vector covers from the catalogue and vary each game with color. */
.mare-hub .mar-hero-art{background:radial-gradient(ellipse at 72% 25%,rgba(95,207,196,.21),transparent 50%),linear-gradient(135deg,#0b3444 0%,#072331 48%,#03131f 100%)!important}
.mare-hub .mar-hero-video{opacity:.26;filter:saturate(.62) contrast(1.08)}
.mare-hub .mar-hero-shade{background:linear-gradient(90deg,rgba(2,16,27,.95) 0%,rgba(3,22,32,.79) 46%,rgba(2,20,29,.35) 100%),linear-gradient(0deg,#031320 0%,transparent 39%)}
.mare-hub .mar-water-motion{opacity:.46}
.mare-hub .mar-game{--card-glow:rgba(89,216,194,.22);background-image:radial-gradient(ellipse at 80% 18%,var(--card-glow),transparent 58%),linear-gradient(155deg,#153847 0%,#092637 50%,#041725 100%)!important;background-color:#071b28!important}
.mare-hub .mar-game.mar-letters{--card-glow:rgba(100,212,205,.3)}
.mare-hub .mar-game.mar-abyss{--card-glow:rgba(70,113,198,.33)}
.mare-hub .mar-game.mar-school{--card-glow:rgba(128,179,154,.31)}
.mare-hub .mar-game.mar-current{--card-glow:rgba(55,182,203,.32)}
.mare-hub .mar-game.mar-shell{--card-glow:rgba(194,156,117,.25)}
.mare-hub .mar-game.mar-trail{--card-glow:rgba(97,165,206,.3)}
.mare-hub .mar-game.mar-enigma{--card-glow:rgba(124,126,202,.3)}
.mare-hub .mar-game.mar-marujo{--card-glow:rgba(52,156,139,.32)}
.mare-hub .mar-game::before{background:linear-gradient(180deg,rgba(5,23,32,.02),rgba(4,19,31,.19) 43%,rgba(2,13,23,.94) 92%)!important}
.mare-hub .mar-game::after{content:"";position:absolute;right:21px;top:26px;bottom:auto;left:auto;width:clamp(70px,7vw,110px);height:clamp(70px,7vw,110px);border:1px solid rgba(191,242,233,.11);border-radius:50%;box-shadow:0 0 0 17px rgba(181,236,224,.025),0 0 0 37px rgba(170,231,222,.012);background:none;pointer-events:none}
.mare-hub .mar-game-info,.mare-hub .mar-tag{position:relative;z-index:1}
.mare-hub .mar-game:hover{filter:none}
@media(max-width:650px){
  body.mare-corrente{background-attachment:scroll!important}
  .mare-corrente .wrap{width:min(100% - 24px,980px)}
  .mare-corrente .intro{padding:34px 0 27px}
  .mare-corrente .intro h1{font-size:clamp(53px,14vw,78px)}
  .mare-corrente .intro::after{opacity:.45;right:-16%}
  .mare-corrente .depth{flex-wrap:wrap}
  .mare-hub .mar-game::after{width:75px;height:75px}
}
@media(prefers-reduced-motion:reduce){.mare-hub .mar-hero-video,.mare-hub .mar-water-motion{display:none!important}}

/* MARÉ 2.3 / Gameplay-first: reduce dead space and keep core input above fold */
.mare-hub .mar-hero{height:auto!important;min-height:clamp(290px,46vh,480px)!important;padding-top:clamp(100px,11vw,145px)!important;padding-bottom:clamp(42px,5vw,70px)!important}
.mare-hub .mar-hero h1{font-size:clamp(52px,8vw,112px);margin:10px 0 25px}
.mare-hub .mar-hero-copy{max-width:720px}
.mare-hub .mar-section-head{padding:36px 0 20px;margin-top:0}
.mare-hub .mar-section-head h2{margin:0;font-size:clamp(30px,5vw,48px)}
.mare-hub .mar-game{min-height:280px;padding:20px}
.mare-hub .mar-game-info h2{font-size:clamp(29px,3vw,37px);margin-bottom:5px}
.mare-hub .mar-game-info p{min-height:0;margin-bottom:12px}
.mare-hub .mar-continue{margin-top:25px;padding:24px 28px}
.mare-hub .mar-footer{padding-top:30px}
:is(.mare-abismo .hero,.mare-cardume .heading,.mare-corrente .intro,.mare-concha .concha-hero,.mare-trilha .trilha-hero,.mare-enigma .enigma-hero,.mare-marujo .marujo-hero){padding-block:clamp(14px,2.4vw,28px)!important;margin:0}
:is(.mare-abismo .hero,.mare-cardume .heading,.mare-corrente .intro,.mare-concha .concha-hero,.mare-trilha .trilha-hero,.mare-enigma .enigma-hero,.mare-marujo .marujo-hero) h1{font-size:clamp(39px,6vw,65px)!important;line-height:1.04!important;margin:5px 0 7px!important;letter-spacing:-.055em!important}
:is(.mare-abismo .hero,.mare-cardume .heading,.mare-corrente .intro,.mare-concha .concha-hero,.mare-trilha .trilha-hero,.mare-enigma .enigma-hero,.mare-marujo .marujo-hero) p{font-size:14px;line-height:1.5;margin:0;max-width:560px}
:is(.mare-abismo .controls,.mare-corrente .switch,.mare-concha .concha-tabs,.mare-enigma .enigma-modes,.mare-marujo .marujo-modes){margin-top:13px;gap:8px}
:is(.mare-abismo .panel,.mare-cardume .game,.mare-corrente .panel,.mare-concha .concha-play,.mare-concha .concha-discover,.mare-trilha .trilha-panel,.mare-enigma .enigma-card,.mare-marujo .marujo-panel){padding:clamp(14px,2vw,23px)!important}
.mare-corrente .depth{margin:11px 0}
.mare-corrente form{margin:13px 0 8px}
.mare-corrente .legend{margin:12px 0}
.mare-corrente .history{gap:7px;margin-top:9px}
.mare-abismo form{margin:13px 0 8px}
.mare-abismo .legend{margin:12px 0}
.mare-abismo .hero .controls button{min-height:40px}
.mare-cardume .heading{padding-bottom:15px!important}
.mare-cardume .game .statusline{margin-bottom:12px;padding-bottom:11px}
.mare-cardume .tile{min-height:clamp(54px,7vw,76px)}
.mare-cardume .notice{margin:12px auto}
.mare-cardume .lower{margin-top:12px;padding-top:12px}
.mare-concha .concha-progress{margin:14px 0}
.mare-concha .concha-wheel{margin:17px auto 14px}
.mare-concha .concha-board{gap:14px}
.mare-trilha .trilha-clue{padding:12px 5px}
.mare-trilha .trilha-clue h2{font-size:clamp(20px,2vw,26px)}
.mare-trilha .trilha-result,.mare-enigma .enigma-current,.mare-marujo .marujo-selection{margin:10px 0;padding:11px 14px;min-height:60px}
.mare-enigma .enigma-board,.mare-marujo .marujo-grid{margin:12px auto}
.mare-enigma .enigma-actions,.mare-marujo .marujo-actions{gap:7px}
.mare-enigma .enigma-clues button{min-height:40px;padding:10px}
:is(.mare-trilha,.mare-enigma,.mare-marujo) :is(.trilha-info,.marujo-card,.enigma-clues,.enigma-stats){padding:16px!important}
:is(.mare-trilha,.mare-enigma,.mare-marujo) footer{padding:15px 0}
@media(max-width:650px){
 .mare-hub .mar-hero{min-height:290px!important;height:auto!important;padding:96px 20px 35px!important}
 .mare-hub .mar-hero h1{font-size:clamp(48px,12vw,72px)}
 .mare-hub .mar-section-head{padding:28px 0 15px}
 .mare-hub .mar-game{min-height:235px}
 .mare-hub .mar-catalog{gap:12px}
 .mare-hub .mar-continue{padding:18px}
 :is(.mare-abismo .hero,.mare-cardume .heading,.mare-corrente .intro,.mare-concha .concha-hero,.mare-trilha .trilha-hero,.mare-enigma .enigma-hero,.mare-marujo .marujo-hero){padding-block:13px!important}
 :is(.mare-abismo .hero,.mare-cardume .heading,.mare-corrente .intro,.mare-concha .concha-hero,.mare-trilha .trilha-hero,.mare-enigma .enigma-hero,.mare-marujo .marujo-hero) h1{font-size:clamp(37px,10vw,53px)!important}
 .mare-cardume .tile{min-height:51px}
}

/* Recife: retain hints and keyboard while making the grid the primary object. */
@media(min-width:651px){
 .mare-recife .shell{max-width:1050px}
 .mare-recife main{gap:clamp(22px,4vw,52px);padding:18px 0!important}
 .mare-recife .leftPanel{width:215px}
 .mare-recife .leftPanel h2{font-size:31px;margin:12px 0!important}
 .mare-recife .leftPanel .desc{font-size:12px;line-height:1.5;margin-bottom:15px}
 .mare-recife .leftPanel .rule{margin:8px 0}
 .mare-recife .leftfoot{margin-top:14px}
 .mare-recife .gameheading{margin-bottom:10px}
}
.mare-recife .topbar{height:68px!important}
.mare-recife .gameheading h2{margin:4px 0!important}
.mare-recife .bottomnote{margin-top:8px}
.mare-recife .foot{height:42px}
@media(max-width:650px){.mare-recife main{padding:10px 0!important}.mare-recife .gameheading{margin-bottom:9px}.mare-recife .keyboard{margin-top:4px}.mare-recife .bottomnote{margin-top:7px}}

/* Home opens directly onto game selection, without a hero banner. */
.mare-hub .mar-top{position:relative;left:auto;transform:none;margin:0 auto;width:min(1280px,calc(100% - 48px));padding:17px 0;background:transparent;backdrop-filter:none}
.mare-hub .mar-section-head{padding:30px 0 19px}
.mare-hub .mar-section-head h1{font:700 clamp(30px,4.5vw,48px)/1.1 "Outfit",sans-serif;letter-spacing:-.055em;margin:0;color:#f1faf7}
.mare-hub .mar-catalog{scroll-margin-top:24px}
@media(max-width:650px){.mare-hub .mar-top{width:calc(100% - 32px);padding:14px 0}.mare-hub .mar-section-head{padding:22px 0 14px}.mare-hub .mar-section-head h1{font-size:31px}}

/* Source: src/styles/shared/mare-3.css */
/* MARÉ 3.0 / Oceanic Play Studio
   Single component layer. No external UI framework or images.
   Older styles remain temporarily for safe rollout of eight games. */
:root{
  color-scheme:dark;
  --m3-bg:#071923;--m3-base:#0c2733;--m3-surface:#123443;
  --m3-raised:#194451;--m3-stroke:rgba(178,233,226,.2);
  --m3-ink:#f3faf7;--m3-muted:#aec8cc;--m3-accent:#87dfcf;
  --m3-warm:#efca82;--m3-radius:18px;--m3-shadow:0 12px 35px rgba(0,12,24,.18);
}
html{scroll-padding-top:20px}
body.mare-hub,body.mar-app,body.mare-recife{
  background:#071923!important;color:var(--m3-ink);
}
body.mare-hub,body.mar-app,body.mare-recife{font-family:'DM Sans',system-ui,sans-serif}
/* Clear obsolete illustrated wallpaper without taking focus away from the board */
body:is(.mare-hub,.mar-app,.mare-recife)::before{
  background:none!important;box-shadow:none!important;
}
body:is(.mare-hub,.mar-app,.mare-recife){
 background-image:radial-gradient(ellipse 65% 36% at 75% 0%,rgba(29,111,129,.13),transparent 80%),linear-gradient(180deg,#091f2b,#071923 55%)!important;
}
body:is(.mare-hub,.mar-app,.mare-recife) :is(button,a,input):focus-visible{
  outline:3px solid var(--m3-warm);outline-offset:3px
}
body:is(.mare-hub,.mar-app,.mare-recife) button:not(:disabled){cursor:pointer}
body:is(.mare-hub,.mar-app,.mare-recife) :is(button,input){font-family:'DM Sans',system-ui,sans-serif}
body:is(.mare-hub,.mar-app) :is(h1,h2,h3){font-family:'Outfit',system-ui,sans-serif;letter-spacing:-.045em}
/* Home: design as a play launcher, not a marketing landing page */
.mare-hub .mar-container{max-width:1360px;margin:0 auto}
.mare-hub .mar-top{
  position:relative;transform:none;left:auto;z-index:2;
  width:min(1200px,calc(100% - 40px));margin:0 auto;
  padding:17px 0;border-bottom:1px solid var(--m3-stroke);
  background:transparent;backdrop-filter:none
}
.mare-hub .mar-logo{font-weight:700;font-size:26px;letter-spacing:.16em;line-height:1.1}
.mare-hub .mar-logo small{font-size:8px;letter-spacing:.15em;margin-top:5px}
.mare-hub .mar-top nav{gap:20px;text-transform:none;letter-spacing:0;font-size:13px}
.mare-hub .mar-top nav a{color:#b9d9d8}
.mare-hub .mar-top nav a:hover{color:var(--m3-accent)}
.mare-hub .mar-section-head{
 width:min(1200px,calc(100% - 40px));margin:0 auto;
 padding:29px 0 17px
}
.mare-hub .mar-section-head h1{
 font:700 clamp(27px,3.8vw,42px)/1.1 'Outfit',sans-serif!important;
 letter-spacing:-.045em;color:var(--m3-ink);margin:0
}
.mare-hub .mar-catalog{
 width:min(1200px,calc(100% - 40px));
 margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
 gap:14px;align-items:stretch
}
.mare-hub .mar-game,.mare-hub .mar-game:nth-child(1),.mare-hub .mar-game:nth-child(6){
 grid-column:auto;min-height:245px;padding:20px;
 border-radius:20px;display:flex;flex-direction:column;justify-content:space-between;
 border:1px solid var(--m3-stroke);
 background:linear-gradient(160deg,rgba(24,65,76,.96),rgba(10,35,47,.98))!important;
 box-shadow:none;overflow:hidden;filter:none;
 transition:transform .2s ease,border-color .2s ease,background .2s ease;
}
.mare-hub .mar-game::before,.mare-hub .mar-game::after{content:none!important}
.mare-hub .mar-game:hover{transform:translateY(-3px);border-color:rgba(135,223,207,.65);box-shadow:none}
.mare-hub .mar-game:focus-within{border-color:var(--m3-accent)}
.mare-hub .mar-game.mar-abyss{background:linear-gradient(155deg,#202c52,#102239)!important}
.mare-hub .mar-game.mar-school{background:linear-gradient(155deg,#1b4644,#102e35)!important}
.mare-hub .mar-game.mar-current{background:linear-gradient(155deg,#12485b,#102b3a)!important}
.mare-hub .mar-game.mar-shell{background:linear-gradient(155deg,#4a3d40,#242936)!important}
.mare-hub .mar-game.mar-trail{background:linear-gradient(155deg,#20445c,#132a40)!important}
.mare-hub .mar-game.mar-enigma{background:linear-gradient(155deg,#333b60,#172a43)!important}
.mare-hub .mar-game.mar-marujo{background:linear-gradient(155deg,#174a44,#102e32)!important}
.mare-hub .mar-tag{
  align-self:flex-start;border:0;border-radius:7px;
  background:rgba(5,23,32,.31);color:#c8e6e2;
  padding:7px 9px;font-size:10px;letter-spacing:.065em;font-weight:800;
}
.mare-hub .mar-game-info h2{
 font:700 clamp(26px,2.7vw,34px)/1.1 'Outfit',sans-serif;
 margin:0 0 5px;color:#f4fbf9;letter-spacing:-.04em
}
.mare-hub .mar-game-info p{
 font-size:12px;line-height:1.4;color:#c5d9dc;min-height:0;margin:0 0 17px
}
.mare-hub .mar-cta{
 display:flex;align-items:center;justify-content:space-between;
 padding:11px 13px;border-radius:11px;background:#b3f0e2;
 color:#0a2a32!important;font:800 12px 'DM Sans',sans-serif;box-shadow:none
}
.mare-hub .mar-cta:hover{background:#e0fff5}
.mare-hub .mar-mode-links{display:flex;gap:5px;margin:0 0 9px}
.mare-hub .mar-mode-links a{
 min-width:0;border:1px solid rgba(202,241,234,.25);border-radius:8px;
 padding:7px 4px;background:rgba(4,25,35,.35);
 color:#e6f8f4;font-size:10px;white-space:nowrap
}
.mare-hub .mar-mode-links a:hover{background:#1d5361}
.mare-hub .mar-continue{
 width:min(1200px,calc(100% - 40px));margin:24px auto 0;
 background:#102e3b;border:1px solid var(--m3-stroke);
 box-shadow:none;border-radius:17px;padding:20px 24px;gap:15px
}
.mare-hub .mar-continue h2{font:700 22px 'Outfit',sans-serif;margin:5px 0}
.mare-hub .mar-continue p{color:#b8d5d6;font-size:13px}
.mare-hub .mar-continue .mar-cta{min-width:0}
.mare-hub .mar-continue[hidden]{display:none!important}
.mare-hub .mar-footer{
 width:min(1200px,calc(100% - 40px));padding:20px 0 26px;color:#92b2b9;font-size:11px
}
/* Game screens: compact identity, dominant playable component */
body:is(.mare-abismo,.mare-cardume,.mare-corrente,.mare-concha,.mare-trilha,.mare-enigma,.mare-marujo) :is(.hero,.heading,.intro,.concha-hero,.trilha-hero,.enigma-hero,.marujo-hero){
  padding:16px 0 17px!important;text-align:left!important
}
body:is(.mare-abismo,.mare-cardume,.mare-corrente,.mare-concha,.mare-trilha,.mare-enigma,.mare-marujo) :is(.hero,.heading,.intro,.concha-hero,.trilha-hero,.enigma-hero,.marujo-hero) h1{
 font:700 clamp(35px,5vw,55px)/1.04 'Outfit',sans-serif!important;
 letter-spacing:-.055em!important;margin:4px 0 6px!important;color:#f3faf7!important
}
body:is(.mare-abismo,.mare-cardume,.mare-corrente,.mare-concha,.mare-trilha,.mare-enigma,.mare-marujo) :is(.hero,.heading,.intro,.concha-hero,.trilha-hero,.enigma-hero,.marujo-hero) p{
 font-size:13px;line-height:1.45;color:var(--m3-muted);margin:0;max-width:620px
}
body:is(.mare-abismo,.mare-cardume,.mare-corrente,.mare-concha,.mare-trilha,.mare-enigma,.mare-marujo) :is(.panel,.game,.concha-play,.concha-discover,.trilha-panel,.trilha-info,.trilha-mode,.enigma-card,.enigma-clues,.enigma-stats,.marujo-panel,.marujo-card){
 background:var(--m3-base)!important;border:1px solid var(--m3-stroke)!important;
 box-shadow:none!important;border-radius:var(--m3-radius)!important
}
body:is(.mare-abismo,.mare-cardume,.mare-corrente,.mare-concha,.mare-trilha,.mare-enigma,.mare-marujo) :is(.controls,.switch,.concha-tabs,.enigma-modes,.marujo-modes){
 margin-top:11px;gap:7px
}
body:is(.mare-abismo,.mare-cardume,.mare-corrente,.mare-concha,.mare-trilha,.mare-enigma,.mare-marujo) :is(button):not(.tile,.letter,.key,.enigma-cell,.marujo-cell,.concha-letter){
 border-radius:10px;box-shadow:none;min-height:40px
}
body:is(.mare-abismo,.mare-cardume,.mare-corrente,.mare-concha,.mare-trilha,.mare-enigma,.mare-marujo) :is(button.primary,button.main-action,button#go,.trilha-actions .primary,.switch [aria-pressed=true],.marujo-modes [aria-pressed=true],.enigma-modes [aria-pressed=true]){
 background:#9be8da;color:#082c34;border-color:#9be8da
}
.mare-cardume .tile,.mare-trilha .trilha-grid button,.mare-enigma .enigma-cell,.mare-marujo .marujo-cell{
 box-shadow:none!important;transition:background .15s ease,border-color .15s ease!important
}
.mare-cardume .tile{border-radius:11px;min-height:clamp(55px,7vw,76px)}
.mare-trilha .trilha-grid{width:min(100%,415px)}
.mare-enigma .enigma-board{width:min(100%,475px)}
.mare-marujo .marujo-grid{width:min(100%,495px)}
:is(.mare-trilha,.mare-enigma,.mare-marujo) :is(.trilha-layout,.enigma-layout,.marujo-layout){gap:16px}
:is(.mare-trilha,.mare-enigma,.mare-marujo) :is(.trilha-side,.enigma-sidebar,.marujo-side){gap:10px}
.mare-corrente .intro::after{content:none!important}
.mare-corrente .panel{border:1px solid var(--m3-stroke)!important}
.mare-concha .concha-wheel{margin:12px auto}
:is(.mare-trilha,.mare-enigma,.mare-marujo) :is(.trilha-result,.enigma-current,.marujo-selection){
 box-shadow:none;border-radius:12px
}
/* Access and density */
@media(max-width:1080px){
 .mare-hub .mar-catalog{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:750px){
 .mare-hub .mar-catalog{grid-template-columns:repeat(2,minmax(0,1fr))}
 .mare-hub .mar-top{width:calc(100% - 28px)}
 .mare-hub .mar-section-head,.mare-hub .mar-catalog,.mare-hub .mar-continue,.mare-hub .mar-footer{width:calc(100% - 28px)}
 .mare-hub .mar-game{min-height:225px}
 :is(.mare-trilha,.mare-enigma,.mare-marujo) :is(.trilha-layout,.enigma-layout,.marujo-layout){grid-template-columns:1fr}
}
@media(max-width:480px){
 .mare-hub .mar-top{padding:14px 0}
 .mare-hub .mar-section-head{padding:21px 0 13px}
 .mare-hub .mar-section-head h1{font-size:30px!important}
 .mare-hub .mar-catalog{gap:10px}
 .mare-hub .mar-game{min-height:210px;padding:14px;border-radius:14px}
 .mare-hub .mar-game-info h2{font-size:24px}
 .mare-hub .mar-game-info p{font-size:11px;margin-bottom:10px}
 .mare-hub .mar-tag{font-size:9px;padding:5px}
 .mare-hub .mar-cta{padding:10px;font-size:11px}
 .mare-hub .mar-mode-links{flex-wrap:wrap}
 .mare-hub .mar-mode-links a{font-size:9px}
 .mare-hub .mar-continue{padding:17px}
 .mare-hub .mar-logo{font-size:22px}
 .mare-hub .mar-logo small{font-size:7px}
 .mare-hub .mar-top nav{font-size:12px;gap:12px}
}
@media(max-width:355px){
 .mare-hub .mar-catalog{grid-template-columns:1fr}
 .mare-hub .mar-game{min-height:170px}
}
@media(prefers-reduced-motion:reduce){
 .mare-hub .mar-game,.mare-hub .mar-cta,.mare-cardume .tile{transition:none!important}
 .mare-hub .mar-game:hover{transform:none}
}

/* MARÉ 3.1 / Recife game surface: focus the board, no promotional sidebar. */
.mare-recife .shell{max-width:880px}
.mare-recife .topbar{height:64px!important}
.mare-recife .return-link{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0 4px}
.mare-recife .return-link h2{font:700 22px/1.1 'Outfit',sans-serif;letter-spacing:-.04em;margin:0}
.mare-recife .return-link a{font-size:13px;text-decoration:none;color:#b4d9d9}
.mare-recife .return-link a:hover{color:#a5f0df}
.mare-recife .return-link p{display:none}
.mare-recife main{flex:1;display:flex;align-items:flex-start;justify-content:center;padding:10px 0 16px!important;gap:0!important}
.mare-recife .game{width:min(100%,450px);margin:0 auto}
.mare-recife .gameheading{margin:0 0 10px}
.mare-recife .gameheading h2{font:700 23px 'Outfit',sans-serif;margin:4px 0!important}
.mare-recife .gameheading p{margin:0;color:#b0cdd1}
.mare-recife .board{width:min(100%,325px)}
.mare-recife .keyboard{width:min(100%,430px)}
.mare-recife .scene{opacity:.22}
.mare-recife .seaweed{display:none!important}
.mare-recife .foot{border-top:1px solid rgba(165,225,217,.13)}
@media(max-width:650px){
 .mare-recife .shell{padding:0 12px}
 .mare-recife main{display:flex!important;padding:7px 0 12px!important}
 .mare-recife .return-link{padding:9px 0 5px}
 .mare-recife .gameheading{margin-bottom:8px}
 .mare-recife .board{width:min(86vw,325px)}
 .mare-recife .keyboard{width:100%}
}

/* MARÉ 3.2: shared functional HUD / actions for deduction games */
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.layout,.wrap){width:min(100% - 32px,920px);margin-inline:auto}
:is(.mare-abismo,.mare-cardume,.mare-corrente) header{padding:15px 0;border-bottom:1px solid var(--m3-stroke);display:flex;align-items:center;justify-content:space-between;gap:15px}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.brand,.logo){font:700 25px 'Outfit',sans-serif;letter-spacing:.15em;color:var(--m3-ink);text-decoration:none}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.brand,.logo) small{display:block;font:700 8px 'DM Sans',sans-serif;letter-spacing:.14em;color:var(--m3-muted)}
:is(.mare-abismo,.mare-cardume,.mare-corrente) .back{font-size:12px;color:var(--m3-muted);text-decoration:none}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.eyebrow,.overline){letter-spacing:.1em;font-size:10px;font-weight:800;color:var(--m3-accent)}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.hero,.heading,.intro){padding:18px 0 16px!important}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.hero,.heading,.intro) h1{font-size:clamp(37px,5vw,54px)!important;margin:4px 0!important}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.hero,.heading,.intro) p{font-size:13px;max-width:570px;line-height:1.45}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.panel,.game){padding:clamp(14px,2vw,24px)!important;background:#0b2633!important;border:1px solid var(--m3-stroke)!important;box-shadow:none!important;border-radius:17px!important}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.progress,.statusline,.meta){display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;color:#b9d7d8;padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid var(--m3-stroke);letter-spacing:.03em}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.entry input){min-height:46px;padding:12px 15px;border-radius:10px;background:#071c29;color:#f3faf7;border:1px solid #456e7b;font-size:16px}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.entry input):focus-visible{border-color:var(--m3-accent)}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.entry button,#go){background:var(--m3-accent);border-color:var(--m3-accent);color:#0a2b35;font-weight:800;min-height:46px;padding-inline:19px}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.legend){gap:13px;margin:12px 0 16px;color:#c1d9da;font-size:11px}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.listtitle,.heading):not(.mar-section-head){font-size:12px}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.guesses,.history,.solved){gap:8px}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.empty){background:rgba(8,32,43,.45);border:1px dashed rgba(159,216,214,.19);border-radius:11px;padding:18px}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.actions,.lower,.controls,.switch){gap:8px}
:is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.actions,.lower,.controls,.switch) button{min-height:42px;font-weight:700;padding:10px 13px}
.mare-cardume .heading{text-align:left}
.mare-cardume .tile{min-height:clamp(54px,7vw,78px);font-size:clamp(11px,1.65vw,15px);border-radius:10px;background:#193f4d;border:1px solid #507582;box-shadow:none}
.mare-cardume .tile[aria-pressed=true]{background:#a9eddb;color:#0c2c35;border-color:#d9fff3}
.mare-cardume .solution{padding:12px;border-radius:10px}
.mare-cardume .lower{margin-top:12px}
.mare-corrente .intro{padding:18px 0 16px!important}
.mare-corrente .depth{margin:8px 0 15px;font-size:11px}
.mare-corrente form{margin:12px 0}
.mare-corrente .guess{padding:11px;border-radius:12px;background:#113544!important}
.mare-corrente .letter{box-shadow:none;min-width:clamp(27px,4vw,36px);height:clamp(36px,4.5vw,43px)}
.mare-abismo form{margin:13px 0}
.mare-abismo .item{padding:11px 14px;box-shadow:none}
:is(.mare-abismo,.mare-cardume,.mare-corrente) footer{padding:15px 0;font-size:10px;color:#85a8af}
@media(max-width:560px){
 :is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.layout,.wrap){width:min(100% - 22px,920px)}
 :is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.hero,.heading,.intro){padding:12px 0!important}
 :is(.mare-abismo,.mare-cardume,.mare-corrente) :is(.hero,.heading,.intro) h1{font-size:39px!important}
 .mare-cardume .grid{gap:5px}
 .mare-cardume .tile{min-height:53px;font-size:clamp(9px,2.5vw,12px)}
 :is(.mare-corrente,.mare-abismo) .entry{display:flex;flex-direction:column}
 :is(.mare-corrente,.mare-abismo) .entry button{width:100%}
}

/* MARÉ 3.3: shared icon navigation. Respects each game's native footer container. */
body:is(.mare-recife,.mare-abismo,.mare-cardume,.mare-corrente,.mare-concha,.mare-trilha,.mare-enigma,.mare-marujo) footer:has(.mare-game-nav){
 display:block!important;width:100%;height:auto!important;min-height:0!important;
 margin:clamp(24px,4vw,40px) auto 0;padding:18px 0 30px!important;
 border-top:1px solid rgba(162,218,216,.17);background:none;color:var(--m3-muted)
}
.mare-game-nav{display:block;width:100%;max-width:1100px;margin:0 auto}
.mare-game-nav__title{
 display:block;margin:0 0 12px;color:#9abfc4;font:800 10px 'DM Sans',sans-serif;
 letter-spacing:.16em;text-align:left
}
.mare-game-nav__grid{
 display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px
}
.mare-game-nav__link{
 display:flex;min-width:0;min-height:74px;flex-direction:column;align-items:center;
 justify-content:center;gap:6px;padding:9px 3px;
 border:1px solid rgba(161,213,212,.19);border-radius:13px;
 background:#0c2b38;color:#c4dce0!important;text-decoration:none!important;
 transition:background .18s ease,border-color .18s ease,transform .18s ease
}
.mare-game-nav__icon{font:700 22px/1 'Outfit','DM Sans',sans-serif;color:#93d8d1}
.mare-game-nav__name{font:700 11px/1.2 'DM Sans',sans-serif;white-space:nowrap}
.mare-game-nav__link:hover{background:#164251;border-color:#84d9ce;transform:translateY(-2px)}
.mare-game-nav__link.is-active{
 background:#194c50;border-color:#9be8d8;color:#f5fffc!important;pointer-events:none
}
.mare-game-nav__link.is-active .mare-game-nav__icon{color:#c2ffec}
.mare-game-nav__link:focus-visible{outline:3px solid #efca82!important;outline-offset:3px}
@media(max-width:860px){.mare-game-nav__grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:420px){
 .mare-game-nav__grid{gap:6px}
 .mare-game-nav__link{min-height:65px;padding:7px 2px;border-radius:10px}
 .mare-game-nav__icon{font-size:19px}
 .mare-game-nav__name{font-size:10px}
}
@media(prefers-reduced-motion:reduce){.mare-game-nav__link{transition:none!important}.mare-game-nav__link:hover{transform:none!important}}

/* MARÉ 3.4 · Cenários reais do repositório.
   Todos os arquivos abaixo existem em assets/backgrounds/*.svg.
   Atmosfera no background; superfície de jogo sempre opaca e legível. */
body:is(.mare-hub,.mare-recife,.mare-abismo,.mare-cardume,.mare-corrente,.mare-concha,.mare-trilha,.mare-enigma,.mare-marujo){
 background-color:#03131e!important;
 background-repeat:no-repeat!important;
 background-size:cover!important;
 background-position:center center!important;
 background-attachment:fixed!important
}
body.mare-hub{background-image:linear-gradient(180deg,rgba(2,16,26,.63),rgba(2,17,27,.77) 54%,rgba(2,14,24,.89)),url("../assets/backgrounds/recife.svg")!important}
body.mare-recife{background-image:linear-gradient(180deg,rgba(2,16,26,.63),rgba(2,17,27,.77) 54%,rgba(2,14,24,.89)),url("../assets/backgrounds/recife.svg")!important}
body.mare-abismo{background-image:linear-gradient(180deg,rgba(2,16,26,.63),rgba(2,17,27,.77) 54%,rgba(2,14,24,.89)),url("../assets/backgrounds/abismo.svg")!important}
body.mare-cardume{background-image:linear-gradient(180deg,rgba(2,16,26,.63),rgba(2,17,27,.77) 54%,rgba(2,14,24,.89)),url("../assets/backgrounds/cardume.svg")!important}
body.mare-corrente{background-image:linear-gradient(180deg,rgba(2,16,26,.63),rgba(2,17,27,.77) 54%,rgba(2,14,24,.89)),url("../assets/backgrounds/corrente.svg")!important}
body.mare-concha{background-image:linear-gradient(180deg,rgba(2,16,26,.63),rgba(2,17,27,.77) 54%,rgba(2,14,24,.89)),url("../assets/backgrounds/concha.svg")!important}
body.mare-trilha{background-image:linear-gradient(180deg,rgba(2,16,26,.63),rgba(2,17,27,.77) 54%,rgba(2,14,24,.89)),url("../assets/backgrounds/trilha.svg")!important}
body.mare-enigma{background-image:linear-gradient(180deg,rgba(2,16,26,.63),rgba(2,17,27,.77) 54%,rgba(2,14,24,.89)),url("../assets/backgrounds/enigma.svg")!important}
body.mare-marujo{background-image:linear-gradient(180deg,rgba(2,16,26,.63),rgba(2,17,27,.77) 54%,rgba(2,14,24,.89)),url("../assets/backgrounds/marujo.svg")!important}

/* Restore native ocean artwork on the eight launcher cards without obscuring labels. */
.mare-hub .mar-game{
 background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;
 border-color:rgba(184,231,224,.25)!important;
}
.mare-hub .mar-game.mar-letters{background-image:linear-gradient(180deg,rgba(2,18,28,.37),rgba(2,14,24,.6) 52%,rgba(2,12,22,.87)),url("../assets/backgrounds/recife.svg")!important}
.mare-hub .mar-game.mar-abyss{background-image:linear-gradient(180deg,rgba(2,18,28,.37),rgba(2,14,24,.6) 52%,rgba(2,12,22,.87)),url("../assets/backgrounds/abismo.svg")!important}
.mare-hub .mar-game.mar-school{background-image:linear-gradient(180deg,rgba(2,18,28,.37),rgba(2,14,24,.6) 52%,rgba(2,12,22,.87)),url("../assets/backgrounds/cardume.svg")!important}
.mare-hub .mar-game.mar-current{background-image:linear-gradient(180deg,rgba(2,18,28,.37),rgba(2,14,24,.6) 52%,rgba(2,12,22,.87)),url("../assets/backgrounds/corrente.svg")!important}
.mare-hub .mar-game.mar-shell{background-image:linear-gradient(180deg,rgba(2,18,28,.37),rgba(2,14,24,.6) 52%,rgba(2,12,22,.87)),url("../assets/backgrounds/concha.svg")!important}
.mare-hub .mar-game.mar-trail{background-image:linear-gradient(180deg,rgba(2,18,28,.37),rgba(2,14,24,.6) 52%,rgba(2,12,22,.87)),url("../assets/backgrounds/trilha.svg")!important}
.mare-hub .mar-game.mar-enigma{background-image:linear-gradient(180deg,rgba(2,18,28,.37),rgba(2,14,24,.6) 52%,rgba(2,12,22,.87)),url("../assets/backgrounds/enigma.svg")!important}
.mare-hub .mar-game.mar-marujo{background-image:linear-gradient(180deg,rgba(2,18,28,.37),rgba(2,14,24,.6) 52%,rgba(2,12,22,.87)),url("../assets/backgrounds/marujo.svg")!important}

.mare-hub .mar-game-info,.mare-hub .mar-tag{position:relative;z-index:1}
.mare-hub .mar-game-info h2,.mare-hub .mar-game-info p{text-shadow:0 1px 12px rgba(0,7,17,.56)}
/* Board and controls should not transmit illustrative noise. */
body.mar-app :is(.panel,.game,.concha-play,.concha-discover,.trilha-panel,.enigma-card,.marujo-panel),
.mare-recife .game{
 backdrop-filter:none;
}
body.mar-app :is(.panel,.game,.concha-play,.concha-discover,.trilha-panel,.enigma-card,.marujo-panel){
 background:rgba(7,29,42,.97)!important;
}
@media(max-width:760px){
 body:is(.mare-hub,.mare-recife,.mare-abismo,.mare-cardume,.mare-corrente,.mare-concha,.mare-trilha,.mare-enigma,.mare-marujo){
  background-attachment:scroll!important;background-position:60% top!important;
 }
 .mare-hub .mar-game{background-position:center center!important}
}

/* Náufrago e Sinais usam exclusivamente os cenários próprios abaixo. */
body:is(.mare-recife,.mare-abismo,.mare-cardume,.mare-corrente,.mare-concha,.mare-trilha,.mare-enigma,.mare-marujo) .mare-game-nav__grid{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:760px){body:is(.mare-recife,.mare-abismo,.mare-cardume,.mare-corrente,.mare-concha,.mare-trilha,.mare-enigma,.mare-marujo) .mare-game-nav__grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:450px){body:is(.mare-recife,.mare-abismo,.mare-cardume,.mare-corrente,.mare-concha,.mare-trilha,.mare-enigma,.mare-marujo) .mare-game-nav__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Artes oficiais MARÉ: Náufrago e Sinais */
.mare-hub .mar-game.mar-forca{background-image:linear-gradient(180deg,#02121c91,#02121cdd),url('../assets/backgrounds/naufrago.svg')!important}
.mare-hub .mar-game.mar-criptograma{background-image:linear-gradient(180deg,#02121c91,#02121cdd),url('../assets/backgrounds/sinais.svg')!important}

/* Source: src/styles/shared/mare-brand.css */
/* Marca oficial recebida em mare-assets-svg.zip. Não altera as identidades dos jogos. */
:root{--mare-brand-mint:#9BF2D6;--mare-brand-teal:#38A3A5;--mare-brand-abyss:#07151C}
.mare-hub .mar-logo,body.mar-app :is(a.brand,a.logo,a.newgame-brand),body.mare-recife .mare-brand-lockup{display:inline-flex!important;align-items:center!important;justify-content:flex-start!important;min-width:0!important;line-height:1!important;text-decoration:none!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
.mare-hub .mar-logo img,body.mar-app :is(a.brand,a.logo,a.newgame-brand) img,body.mare-recife .mare-brand-lockup img{display:block!important;width:clamp(170px,19vw,240px)!important;max-width:100%!important;height:auto!important;max-height:65px!important;object-fit:contain!important;object-position:left center}
body.mare-recife .topbar .mare-brand-lockup{flex:0 1 auto}
body.mare-recife .topbar .mare-brand-lockup img{width:clamp(150px,20vw,225px)!important}
body.mar-app .newgame-header .newgame-brand img{width:clamp(160px,20vw,230px)!important}
@media(max-width:650px){.mare-hub .mar-logo img,body.mar-app :is(a.brand,a.logo,a.newgame-brand) img,body.mare-recife .mare-brand-lockup img{width:clamp(145px,39vw,188px)!important;max-height:49px!important}}
@media(max-width:360px){.mare-hub .mar-logo img,body.mar-app :is(a.brand,a.logo,a.newgame-brand) img,body.mare-recife .mare-brand-lockup img{width:135px!important}}

/* Acessibilidade: atalho visível ao receber foco para o conteúdo principal. */
.mare-skip-link{position:fixed;z-index:99999;top:12px;left:12px;transform:translateY(-160%);padding:12px 18px;background:#9bf2d6;color:#061c27;border:2px solid #061c27;border-radius:9px;font:700 15px system-ui,sans-serif;text-decoration:none;box-shadow:0 5px 18px #001b27aa}
.mare-skip-link:focus,.mare-skip-link:focus-visible{transform:translateY(0);outline:3px solid #ffffff;outline-offset:2px}
#conteudo-principal:focus{outline:none}

/* Tipografia do título no interior do jogo Recife. */
body.mare-recife .recife-title-lockup{
 margin:0;text-align:center;font-weight:900;
 font-size:clamp(1.5rem,4vw,2.1rem);line-height:1.1;letter-spacing:-.055em;
 color:#b3f4e5;text-shadow:0 3px 0 #125966;
}

/* Catálogo: título único no centro da ilustração, descrição fixa abaixo. */
body.mare-hub .mar-catalog > article.mar-game{
 display:flex!important;flex-direction:column!important;
}
body.mare-hub .mar-catalog > article.mar-game > h2.recife-card-heading{
 display:flex!important;align-items:center!important;justify-content:center!important;
 align-self:stretch!important;flex:1 0 135px!important;min-height:135px!important;
 max-width:100%!important;width:100%!important;margin:8px 0 12px!important;padding:0!important;
 font-family:'Outfit',system-ui,sans-serif!important;
 font-size:clamp(2rem,3.5vw,3.55rem)!important;font-weight:900!important;
 line-height:1!important;letter-spacing:-.075em!important;text-align:center!important;
 white-space:nowrap!important;overflow-wrap:normal!important;word-break:normal!important;
 color:#a8f1e1!important;text-shadow:0 5px 0 #0d5965,0 12px 25px rgba(0,0,0,.5)!important;
}
body.mare-hub .mar-catalog > article.mar-game > .mar-game-info{
 flex:0 0 auto!important;margin-top:auto!important;width:100%!important;
}
/* Nomes longos precisam de espaço sem quebrar em duas linhas. */
body.mare-hub .mar-catalog > article.mar-game:is(.mar-school,.mar-current) > h2.recife-card-heading{
 font-size:clamp(1.8rem,3.05vw,3.08rem)!important;
}
body.mare-hub .mar-catalog > article.mar-game:is(.mar-forca,.mar-criptograma) > h2.recife-card-heading{
 font-size:clamp(2rem,3.3vw,3.3rem)!important;
}
@media(max-width:650px){
 body.mare-hub .mar-catalog > article.mar-game > h2.recife-card-heading{
  flex-basis:115px!important;min-height:115px!important;margin:4px 0 10px!important;
  font-size:clamp(2rem,8.1vw,3rem)!important;
 }
 body.mare-hub .mar-catalog > article.mar-game:is(.mar-school,.mar-current) > h2.recife-card-heading{
  font-size:clamp(1.65rem,6.9vw,2.6rem)!important;
 }
}
@media(max-width:350px){
 body.mare-hub .mar-catalog > article.mar-game > h2.recife-card-heading{
  font-size:clamp(2.15rem,10vw,3.3rem)!important;
 }
}

/* Cartões dos dois novos jogos na mesma linguagem visual do Recife. */
.mare-hub .mar-catalog .mar-perola{background-image:linear-gradient(180deg,#02121c8a,#02121ce3),url('../assets/backgrounds/concha.svg')!important;background-size:cover!important;background-position:center!important}
.mare-hub .mar-catalog .mar-farol{background-image:linear-gradient(180deg,#02121c8a,#02121ce3),url('../assets/backgrounds/corrente.svg')!important;background-size:cover!important;background-position:center!important}

/* Marcas exclusivas das novas experiências, acima do título do card. */
body.mare-hub .mar-catalog > article.mar-game:is(.mar-perola,.mar-farol) > .mar-game-symbol{
 display:block;align-self:center;width:clamp(70px,7vw,106px);height:auto;max-height:100px;
 object-fit:contain;filter:drop-shadow(0 9px 18px rgba(0,10,19,.4));margin:2px auto 0;
}
body.mare-hub .mar-catalog > article.mar-game:is(.mar-perola,.mar-farol) > h2.recife-card-heading{
 flex:0 0 auto!important;min-height:54px!important;margin:3px 0 12px!important;
 font-size:clamp(2rem,3vw,3.1rem)!important;
}
body.mare-hub .mar-catalog > article.mar-game:is(.mar-perola,.mar-farol){min-height:285px}
@media(max-width:650px){
 body.mare-hub .mar-catalog > article.mar-game:is(.mar-perola,.mar-farol) > .mar-game-symbol{width:76px}
 body.mare-hub .mar-catalog > article.mar-game:is(.mar-perola,.mar-farol) > h2.recife-card-heading{font-size:2.4rem!important}
}

/* Identidade de cada jogo: símbolo acima do título em todos os cards. */
body.mare-hub .mar-catalog > article.mar-game > .mar-game-symbol{display:block;align-self:center;width:clamp(70px,7vw,106px);height:100px;object-fit:contain;flex:0 0 auto;margin:2px auto 0;filter:drop-shadow(0 9px 18px rgba(0,10,19,.4))}
body.mare-hub .mar-catalog > article.mar-game > h2.recife-card-heading{flex:0 0 auto!important;min-height:54px!important;margin:3px 0 12px!important;font-size:clamp(2rem,3vw,3.1rem)!important}
body.mare-hub .mar-catalog > article.mar-game:is(.mar-school,.mar-current,.mar-forca,.mar-criptograma) > h2.recife-card-heading{font-size:clamp(1.8rem,2.7vw,2.9rem)!important}
body.mare-hub .mar-catalog > article.mar-game{min-height:285px}
.mare-game-symbol-lockup{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.mare-game-symbol-lockup img{width:clamp(62px,8vw,86px);height:auto;flex:0 0 auto;filter:drop-shadow(0 7px 14px rgba(0,10,19,.3))}
@media(max-width:650px){body.mare-hub .mar-catalog > article.mar-game > .mar-game-symbol{height:80px;width:80px}body.mare-hub .mar-catalog > article.mar-game > h2.recife-card-heading{font-size:clamp(1.85rem,8vw,2.6rem)!important}body.mare-hub .mar-catalog > article.mar-game:is(.mar-school,.mar-current) > h2.recife-card-heading{font-size:clamp(1.65rem,6.8vw,2.4rem)!important}}

/* Catálogo uniforme: 12 cards do mesmo tamanho e sem imagens de cenário.
   A marca de cada jogo é o único elemento ilustrativo de destaque. */
body.mare-hub .mar-catalog{align-items:stretch!important}
body.mare-hub .mar-catalog > article.mar-game{
 box-sizing:border-box!important;display:flex!important;flex-direction:column!important;
 height:410px!important;min-height:410px!important;max-height:410px!important;
 background:#061e2c!important;background-image:none!important;
 border:1px solid rgba(162,224,215,.26)!important;overflow:hidden!important;
}
body.mare-hub .mar-catalog > article.mar-game::before,
body.mare-hub .mar-catalog > article.mar-game::after{background-image:none!important}
body.mare-hub .mar-catalog > article.mar-game > .mar-tag{
 flex:0 0 auto!important;margin-bottom:12px!important
}
body.mare-hub .mar-catalog > article.mar-game > .mar-game-symbol{
 display:block!important;flex:0 0 104px!important;align-self:center!important;
 width:104px!important;height:104px!important;max-height:104px!important;
 object-fit:contain!important;margin:0 auto 8px!important
}
body.mare-hub .mar-catalog > article.mar-game > h2.recife-card-heading{
 display:flex!important;flex:0 0 65px!important;align-items:center!important;
 min-height:65px!important;max-height:65px!important;
 font-size:clamp(2rem,2.8vw,3.05rem)!important;line-height:1!important;
 margin:0 0 10px!important;white-space:nowrap!important
}
body.mare-hub .mar-catalog > article.mar-game:is(.mar-school,.mar-current,.mar-forca,.mar-criptograma) > h2.recife-card-heading{
 font-size:clamp(1.75rem,2.5vw,2.8rem)!important
}
body.mare-hub .mar-catalog > article.mar-game > .mar-game-info{
 display:flex!important;flex:1 1 auto!important;flex-direction:column!important;
 justify-content:flex-end!important;width:100%!important;margin-top:auto!important;
}
body.mare-hub .mar-catalog > article.mar-game .mar-game-info p{
 margin-bottom:auto!important;min-height:44px!important
}
body.mare-hub .mar-catalog > article.mar-game .mar-cta{margin-top:auto!important;flex-shrink:0!important}
@media(max-width:650px){
 body.mare-hub .mar-catalog > article.mar-game{height:390px!important;min-height:390px!important;max-height:390px!important}
 body.mare-hub .mar-catalog > article.mar-game > .mar-game-symbol{width:86px!important;height:86px!important;flex-basis:86px!important}
 body.mare-hub .mar-catalog > article.mar-game > h2.recife-card-heading{font-size:clamp(1.8rem,7.6vw,2.55rem)!important}
 body.mare-hub .mar-catalog > article.mar-game:is(.mar-school,.mar-current,.mar-forca,.mar-criptograma) > h2.recife-card-heading{font-size:clamp(1.55rem,6.4vw,2.25rem)!important}
}

/* MARÉ Ocean Motion: two compositor-friendly decorative layers, no JS or videos. */
body.mare-hub,body.mar-app,body.mare-recife{isolation:isolate}
body:is(.mare-hub,.mar-app,.mare-recife)::before,
body:is(.mare-hub,.mar-app,.mare-recife)::after{
 content:"";position:fixed;inset:-8vh -8vw;pointer-events:none;
 z-index:0;contain:paint;will-change:transform;transform:translate3d(0,0,0);
}
body:is(.mare-hub,.mar-app,.mare-recife)::before{
 background:
 radial-gradient(ellipse 80vw 16vh at 16% 91%,rgba(48,177,192,.17) 0,rgba(13,78,110,.09) 64%,transparent 72%),
 radial-gradient(ellipse 85vw 18vh at 88% 100%,rgba(44,177,178,.15) 0,rgba(15,80,106,.08) 63%,transparent 73%),
 radial-gradient(ellipse 70vw 18vh at 49% 108%,rgba(120,236,220,.09),transparent 72%);
 opacity:.85;animation:mare-ocean-swell 15s ease-in-out infinite alternate;
}
body:is(.mare-hub,.mar-app,.mare-recife)::after{
 background-image:
 radial-gradient(circle,rgba(158,246,230,.38) 0 2px,transparent 3px),
 radial-gradient(circle,rgba(171,244,230,.24) 0 4px,transparent 5px),
 radial-gradient(circle,rgba(128,222,224,.22) 0 3px,transparent 4px),
 radial-gradient(circle,rgba(203,255,239,.16) 0 1px,transparent 2px);
 background-size:193px 239px,307px 349px,263px 301px,127px 191px;
 background-position:18px 46px,102px 123px,36px 171px,66px 27px;
 opacity:.56;animation:mare-bubbles-rise 24s linear infinite;
}
body.mare-hub > :is(header,main,footer),
body.mar-app > :is(header,main,footer,.newgame-shell,.depth-shell,.shell,.app,.container,.wrap),
body.mare-recife > :is(header,main,footer,.shell){position:relative;z-index:1}
@keyframes mare-ocean-swell{
 from{transform:translate3d(-3%,1%,0) scale(1)}
 to{transform:translate3d(3%,-2%,0) scale(1.035)}
}
@keyframes mare-bubbles-rise{
 from{transform:translate3d(0,7vh,0)}
 to{transform:translate3d(12px,-21vh,0)}
}
@media(max-width:650px){
 body:is(.mare-hub,.mar-app,.mare-recife)::after{opacity:.34}
 body:is(.mare-hub,.mar-app,.mare-recife)::before{opacity:.6}
}
@media(prefers-reduced-motion:reduce){
 body:is(.mare-hub,.mar-app,.mare-recife)::before,
 body:is(.mare-hub,.mar-app,.mare-recife)::after{
  animation:none!important;transform:none!important;will-change:auto!important;
 }
}

/* Source: src/styles/shared/mare-finale.css */
.mare-finale{position:fixed;z-index:9999;right:20px;bottom:20px;width:min(380px,calc(100vw - 40px));padding:18px 20px;border:1px solid #d0b6a6;border-radius:18px;background:#132e3c;color:#fff1dd;box-shadow:0 16px 50px #00121cb8;display:flex;flex-direction:column;gap:5px;font:500 14px/1.45 'DM Sans',system-ui,sans-serif}.mare-finale strong{font:800 22px/1.2 'Outfit',system-ui,sans-serif}.mare-finale-win{border-color:#a5f0d2;background:#125047;color:#ecfff4}.mare-finale[hidden]{display:none!important}@media(prefers-reduced-motion:no-preference){.mare-finale:not([hidden]){animation:mare-appear .35s ease-out}@keyframes mare-appear{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}}
/* Source: src/styles/shared/mare-play.css */
/* Shared game surfaces: preserve layouts, control geometry and game-specific colors. */
:root{
 --mare-evo-panel:rgba(7,38,55,.88);
 --mare-evo-border:rgba(109,197,204,.34);
 --mare-evo-focus:#f1ca83;
 --mare-evo-radius:20px;
 --mare-evo-shadow:0 20px 54px rgba(0,12,25,.36);
}
body:is(.mar-app,.mare-recife){color-scheme:dark}
body:is(.mar-app,.mare-recife) :is(button,a,input,[role="button"]):focus-visible{
 outline:3px solid var(--mare-evo-focus)!important;
 outline-offset:3px!important;
}
body:is(.mar-app,.mare-recife) :is(button,a,input){
 -webkit-tap-highlight-color:rgba(83,220,203,.16);
}
body:is(.mar-app,.mare-recife) :is(button,[role="button"]):not(:disabled){
 transition:transform .2s var(--mare-evo-ease),border-color .2s ease,box-shadow .2s ease,background-color .2s ease;
}
@media(hover:hover) and (pointer:fine){
 body:is(.mar-app,.mare-recife) :is(button,[role="button"]):not(:disabled):hover{transform:translateY(-2px)}
 body:is(.mar-app,.mare-recife) :is(button,[role="button"]):not(:disabled):active{transform:translateY(0) scale(.98)}
}
body:is(.mar-app,.mare-recife) :is(.newgame-panel,.game,.panel){
 box-shadow:var(--mare-evo-shadow);
}
body.mar-app :is(.mare-game-symbol-lockup img,.newgame-intro img){
 filter:drop-shadow(0 10px 20px rgba(0,14,24,.3));
}
body:is(.mar-app,.mare-recife) :is(.mare-game-nav__link,.newgame-back,.back){
 transition:color .2s ease,background-color .2s ease,border-color .2s ease;
}
body:is(.mar-app,.mare-recife) :is(.mare-game-nav__link,.newgame-back,.back):focus-visible{
 border-radius:8px;
}
body:is(.mar-app,.mare-recife) :is(.notice,.status,[role="status"],[aria-live="polite"]){
 overflow-wrap:anywhere;
}
@media(max-width:420px){
 body:is(.mar-app,.mare-recife) :is(.newgame-panel,.panel,.game){max-width:100%;min-width:0}
 body:is(.mar-app,.mare-recife) :is(button,input){max-width:100%}
}
@media(prefers-reduced-motion:reduce){
 body:is(.mar-app,.mare-recife) :is(button,a,input,[role="button"]){transition:none!important;animation:none!important;transform:none!important}
}


/* MARÉ Play System · Phase 2
   Shared UI contracts for all twelve games. Loaded instead of hub-only
   mare-evolution.css; preserve every game mechanics stylesheet and URL.
   Source of truth for shared game buttons, inputs, panels, headers and focus.
*/
:root{
  --play-abyss:#06141f;
  --play-layer:#0d2632;
  --play-panel:#102d3b;
  --play-panel-high:#153a48;
  --play-ink:#f1f8f5;
  --play-muted:#bed5d7;
  --play-mint:#a1f3d9;
  --play-sand:#e9c88b;
  --play-stroke:rgba(142,217,210,.31);
  --play-ease:cubic-bezier(.22,1,.36,1);
  --mare-evo-ease:cubic-bezier(.22,1,.36,1);
  --play-radius:20px;
}
body:is(.mar-app,.mare-recife){
  color-scheme:dark;
  min-width:0;
  color:var(--play-ink);
  background-color:var(--play-abyss)!important;
  background-image:radial-gradient(ellipse 75% 45% at 80% -12%,rgba(35,121,135,.22),transparent 75%),linear-gradient(180deg,#0a2532 0%,#06141f 75%)!important;
  background-attachment:scroll!important;
  font-family:'DM Sans',system-ui,sans-serif;
}
body:is(.mar-app,.mare-recife)::before,
body:is(.mar-app,.mare-recife)::after{
  content:none!important;
  animation:none!important;
}
body:is(.mar-app,.mare-recife) :is(button,a,input,textarea,[role="button"]):focus-visible{
  outline:3px solid var(--play-sand)!important;
  outline-offset:3px!important;
}
body:is(.mar-app,.mare-recife) :is(button,a,input){
  -webkit-tap-highlight-color:rgba(161,243,217,.17);
}
body:is(.mar-app,.mare-recife) :is(button,[role="button"]):not(:disabled){
  touch-action:manipulation;
  transition:background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .24s ease,transform .24s var(--play-ease);
}
body:is(.mar-app,.mare-recife) button:disabled{
  cursor:not-allowed!important;
  opacity:.5;
}
body:is(.mar-app,.mare-recife) :is(.notice,.status,.newgame-notice,.depth-status,[role="status"],[aria-live="polite"]){
  overflow-wrap:anywhere;
}
body:is(.mar-app,.mare-recife) :is(.notice,.status,.newgame-notice,.depth-status):not(:empty){
  line-height:1.5;
}
body:is(.mar-app,.mare-recife) [hidden]{display:none!important;}
/* Calm consistent branding, while preserving the various shell containers. */
body.mar-app header:not(.mare-game-nav),
body.mare-recife .topbar{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:clamp(10px,2.4vw,24px);
  padding-block:15px!important;
  min-height:72px;
  border-bottom:1px solid var(--play-stroke);
  background:transparent;
  box-shadow:none;
}
body.mare-recife .topbar{height:auto!important;min-height:72px}
body.mar-app header a[href="./"],
body.mare-recife .return-link > a{
  text-decoration:none;
}
body.mar-app header a[href="./"]:not(:has(img)),
body.mare-recife .return-link > a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:9px 12px;
  border-radius:999px;
  border:1px solid var(--play-stroke);
  color:#cfe9e4!important;
  background:rgba(7,40,52,.5);
  font-size:clamp(.74rem,1.5vw,.88rem)!important;
  font-weight:700;
  white-space:nowrap;
}
body.mar-app header a[href="./"]:not(:has(img)):hover,
body.mare-recife .return-link > a:hover{
  border-color:var(--play-mint);
  color:var(--play-mint)!important;
}
body.mar-app header img,
body.mare-recife .topbar img{
  max-width:100%;
  object-fit:contain;
}
body.mare-recife .return-link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding-block:14px 8px;
}
body.mare-recife .return-link .mare-game-symbol-lockup{
  display:flex;
  flex-direction:row;
  gap:9px;
  min-width:0;
}
body.mare-recife .recife-title-lockup{
  text-shadow:none!important;
  color:var(--play-mint);
  font:700 clamp(1.3rem,3vw,1.9rem)/1.1 'Outfit',system-ui,sans-serif;
  margin:0;
}
body.mar-app :is(.mare-game-symbol-lockup,.depth-title-lockup){
  display:flex;
  align-items:center;
  gap:clamp(11px,2vw,18px);
  flex-wrap:nowrap;
  min-width:0;
}
body.mar-app :is(.mare-game-symbol-lockup,.depth-title-lockup) img{
  display:block;
  width:clamp(54px,6vw,72px);
  height:clamp(54px,6vw,72px);
  flex-shrink:0;
  filter:drop-shadow(0 9px 20px rgba(0,15,25,.28));
}
body.mar-app :is(.mare-game-symbol-lockup,.depth-title-lockup) h1{
  min-width:0;
  margin:0!important;
  color:#eafff5!important;
  text-shadow:none!important;
  font:700 clamp(2.45rem,5vw,4.1rem)/1.02 'Outfit',system-ui,sans-serif!important;
  letter-spacing:-.062em!important;
  overflow-wrap:anywhere;
}
body.mar-app :is(.wrap,.layout,.concha-shell,.trilha-shell,.enigma-shell,.marujo-shell,.newgame-shell,.depth-shell){
  max-width:1100px;
}
body.mar-app :is(.wrap,.layout,.concha-shell,.trilha-shell,.enigma-shell,.marujo-shell,.newgame-shell,.depth-shell),
body.mare-recife .shell{
  min-width:0;
}
/* Editorial identification, compact so the board remains the focal point. */
body.mar-app :is(.hero,.intro,.heading,.concha-hero,.trilha-hero,.enigma-hero,.marujo-hero,.newgame-intro,.depth-intro){
  border-bottom-color:rgba(142,217,210,.18);
}
body.mar-app :is(.concha-hero,.trilha-hero,.enigma-hero,.marujo-hero,.depth-intro){
  padding-block:clamp(16px,2.5vw,28px) clamp(13px,2vw,22px)!important;
}
body.mar-app :is(.hero,.intro,.heading,.concha-hero,.trilha-hero,.enigma-hero,.marujo-hero,.newgame-intro,.depth-intro) > p,
body.mar-app :is(.hero,.intro,.heading,.concha-hero,.trilha-hero,.enigma-hero,.marujo-hero,.newgame-intro,.depth-intro) > div > p{
  max-width:64ch;
  color:var(--play-muted);
  line-height:1.55;
  font-size:clamp(.86rem,1.25vw,1rem);
}
body.mar-app :is(.eyebrow,.overline,.newgame-eyebrow,.depth-eyebrow,.tiny),
body.mar-app :is(.trilha-hero,.enigma-hero,.marujo-hero) > span:first-child{
  color:var(--play-mint);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.13em;
}
/* Shared panel material. No extra blur layers or animated backgrounds. */
body.mar-app :is(.panel,.game,.concha-play,.concha-discover,.trilha-panel,.trilha-info,.trilha-mode,.enigma-card,.enigma-clues,.enigma-stats,.marujo-panel,.marujo-card,.newgame-panel,.depth-panel),
body.mare-recife .game{
  min-width:0;
  max-width:100%;
  border-radius:var(--play-radius)!important;
  border:1px solid var(--play-stroke)!important;
  background:linear-gradient(155deg,rgba(17,48,62,.97),rgba(8,31,43,.98))!important;
  box-shadow:0 18px 56px rgba(0,10,23,.22),inset 0 1px rgba(244,255,251,.035)!important;
  scroll-margin-top:14px;
}
body.mar-app :is(.concha-play,.concha-discover,.trilha-panel,.enigma-card,.marujo-panel,.newgame-panel,.depth-panel){
  padding:clamp(16px,2.8vw,30px)!important;
}
body.mar-app :is(.panel,.game){padding:clamp(16px,2.8vw,28px)!important}
body.mar-app :is(.trilha-info,.trilha-mode,.enigma-clues,.enigma-stats,.marujo-card){padding:clamp(14px,2.3vw,24px)!important}
body.mar-app :is(.newgame-hud,.depth-hud,.statusline,.trilha-meta,.enigma-meta,.marujo-meta,.progress,.meta,.concha-top){
  font-variant-numeric:tabular-nums;
  color:#c5dedc;
}
/* Explicit selectors for action controls: never restyle puzzle tiles or keyboard keys. */
body.mar-app :is(.controls,.actions,.lower,.switch,.concha-tabs,.concha-controls,.trilha-actions,.trilha-mode,.enigma-actions,.enigma-modes,.marujo-actions,.marujo-modes,.newgame-actions,.newgame-modes,.depth-buttons,.depth-modes) > button,
body.mar-app :is(.panel,.game,.depth-panel,.newgame-panel) form button[type="submit"]{
  min-height:44px;
  padding:10px 15px;
  border:1px solid rgba(139,208,202,.45);
  border-radius:12px;
  background:#123c4a;
  color:#e9f9f4;
  font:700 clamp(.79rem,1.25vw,.9rem)/1.25 'DM Sans',system-ui,sans-serif;
  text-wrap:balance;
}
body.mar-app :is(.controls,.actions,.lower,.switch,.concha-tabs,.concha-controls,.trilha-actions,.trilha-mode,.enigma-actions,.enigma-modes,.marujo-actions,.marujo-modes,.newgame-actions,.newgame-modes,.depth-buttons,.depth-modes) > button:not(:disabled):hover,
body.mar-app form button[type="submit"]:not(:disabled):hover{
  background:#215665;
  border-color:var(--play-mint);
  color:#f4fff8;
}
body.mar-app :is(.switch,.concha-tabs,.trilha-mode,.enigma-modes,.marujo-modes,.newgame-modes,.depth-modes) button[aria-pressed="true"],
body.mar-app :is(.switch,.concha-tabs,.trilha-mode,.enigma-modes,.marujo-modes,.newgame-modes,.depth-modes) button.active{
  color:#063238!important;
  background:var(--play-mint)!important;
  border-color:var(--play-mint)!important;
}
body.mar-app :is(.actions,.concha-controls,.trilha-actions,.newgame-actions,.depth-buttons) > :is(.primary,.main-action,#check,#submit),
body.mar-app form button[type="submit"]{
  color:#062e34!important;
  background:var(--play-mint)!important;
  border-color:var(--play-mint)!important;
  font-weight:800!important;
}
body.mar-app :is(.actions,.concha-controls,.trilha-actions,.newgame-actions,.depth-buttons) > :is(.primary,.main-action,#check,#submit):not(:disabled):hover,
body.mar-app form button[type="submit"]:not(:disabled):hover{
  background:#cbffeb!important;
}
body.mar-app input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]){
  min-height:46px;
  border:1px solid rgba(150,222,212,.56)!important;
  border-radius:12px;
  background:#061f2c!important;
  color:var(--play-ink)!important;
  caret-color:var(--play-mint);
  font-size:16px;
}
body.mar-app input::placeholder{color:#9bbec1;opacity:1}
body.mar-app :is(label,.concha-stat,.depth-hud,.newgame-hud){
  color:#c6e3de;
}
body.mar-app :is(.entry,.crypto-entry,.depth-entry,.concha-controls,.newgame-actions,.depth-buttons,.trilha-actions,.enigma-actions,.marujo-actions){
  min-width:0;
}
/* Critical gameplay: legible 16-card grouping at 320px. */
body.mare-cardume #grid.grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(4px,1.1vw,9px);
}
body.mare-cardume #grid .tile{
  min-width:0;
  min-height:clamp(65px,7.2vw,81px)!important;
  padding:8px 4px;
  font-size:clamp(12px,1.15vw,15px)!important;
  line-height:1.18;
  font-weight:800;
  overflow-wrap:anywhere;
  word-break:normal;
  hyphens:auto;
  border:1px solid #628e9c;
  border-radius:10px;
  background:#153f4e;
  color:#f0fcfb;
}
body.mare-cardume #grid .tile[aria-pressed="true"]{
  background:var(--play-mint)!important;
  color:#07323a!important;
  border-color:#ecfff8!important;
  box-shadow:inset 0 0 0 2px #e1fff1;
}
body.mare-cardume #grid .tile:focus-visible{
  outline:3px solid var(--play-sand)!important;
  outline-offset:1px!important;
}
/* Visible states remain encoded both by color and borders/position. */
body.mare-trilha .trilha-grid button.chosen{
  border-color:#ddfff3!important;
  box-shadow:inset 0 0 0 2px #d2fff0!important;
}
body.mare-enigma .enigma-cell.selected{
  border-color:#e6fff7!important;
  box-shadow:inset 0 0 0 2px #073640!important;
}
body.mare-marujo .marujo-cell:is(.selected,.found){
  outline:1px solid #ddfff1;
  outline-offset:-2px;
}
body.mar-app :is(.depth-status,.newgame-notice,.notice),
body.mare-recife .status{
  color:#c7f4e7;
  line-height:1.5;
}
/* Twelve-game voyage navigation in the lower priority region. */
body.mar-app .mare-game-nav,
body.mare-recife .mare-game-nav{padding-block:22px}
body.mar-app .mare-game-nav__link,
body.mare-recife .mare-game-nav__link{
  min-height:57px;
  background:rgba(13,45,58,.75);
  border:1px solid var(--play-stroke);
  border-radius:12px;
  text-decoration:none;
}
body.mar-app .mare-game-nav__link:is(:hover,:focus-visible),
body.mare-recife .mare-game-nav__link:is(:hover,:focus-visible){
  border-color:var(--play-mint);
  background:#174655;
}
body.mar-app .mare-game-nav__link[aria-current="page"],
body.mare-recife .mare-game-nav__link[aria-current="page"]{
  border-color:var(--play-mint);
  background:#19534f;
  color:#fff;
}
body.mar-app dialog,
body.mare-recife .overlay{
  color:var(--play-ink);
  border:1px solid var(--play-stroke);
  border-radius:20px;
  box-shadow:0 24px 70px rgba(0,9,19,.62);
}
body.mar-app dialog::backdrop{
  background:rgba(2,13,21,.78);
  backdrop-filter:blur(4px);
}
/* Compact initial viewport, but don't hide help, scores or essential controls. */
@media(max-width:760px){
  body.mar-app header:not(.mare-game-nav){min-height:64px;gap:10px;padding-block:11px!important}
  body.mar-app :is(.concha-hero,.trilha-hero,.enigma-hero,.marujo-hero,.depth-intro){padding-block:15px 13px!important}
  body.mar-app :is(.mare-game-symbol-lockup,.depth-title-lockup) h1{font-size:clamp(2rem,7vw,3.15rem)!important}
  body.mar-app :is(.mare-game-symbol-lockup,.depth-title-lockup) img{width:56px;height:56px}
  body.mar-app :is(.panel,.game,.concha-play,.concha-discover,.trilha-panel,.trilha-info,.trilha-mode,.enigma-card,.enigma-clues,.enigma-stats,.marujo-panel,.marujo-card,.newgame-panel,.depth-panel){
    border-radius:16px!important;
    padding:clamp(12px,2.6vw,19px)!important;
  }
  body.mar-app :is(.trilha-actions,.newgame-actions,.depth-buttons,.marujo-actions,.enigma-actions){
    gap:8px;
  }
}
@media(max-width:420px){
  body.mar-app header a[href="./"]:not(:has(img)){padding:8px 10px;white-space:normal;text-align:center}
  body.mar-app :is(.mare-game-symbol-lockup,.depth-title-lockup) img{width:48px;height:48px}
  body.mare-cardume #grid .tile{font-size:12px!important;padding:6px 2px;min-height:70px!important}
  body.mar-app :is(.entry,.actions,.lower,.concha-controls,.newgame-actions,.depth-buttons,.trilha-actions,.enigma-actions,.marujo-actions){
    max-width:100%;
  }
  body.mare-recife .topbar{padding-block:10px!important;min-height:64px}
  body.mare-recife .return-link{gap:8px}
  body.mare-recife .return-link .mare-game-symbol-lockup img{max-width:48px}
}
@media(hover:hover) and (pointer:fine){
  body:is(.mar-app,.mare-recife) :is(.actions,.lower,.switch,.concha-controls,.trilha-actions,.enigma-actions,.marujo-actions,.newgame-actions,.depth-buttons) > button:not(:disabled):hover{
    transform:translateY(-2px);
  }
}
@media(prefers-reduced-motion:reduce){
  body:is(.mar-app,.mare-recife) :is(button,a,input,[role="button"],.tile,.letter){
    animation:none!important;
    transition:none!important;
    transform:none!important;
  }
  body:is(.mar-app,.mare-recife){scroll-behavior:auto}
}
@media(prefers-contrast:more){
  body:is(.mar-app,.mare-recife) :is(.panel,.game,.newgame-panel,.depth-panel,.concha-play,.trilha-panel,.enigma-card,.marujo-panel){
    border-color:#ddfff6!important;
  }
  body:is(.mar-app,.mare-recife) :is(button,a,input):focus-visible{
    outline-color:#ffe5aa!important;
    outline-width:4px!important;
  }
  body.mar-app :is(.newgame-hud,.depth-hud,.statusline,.trilha-meta,.enigma-meta,.marujo-meta,.progress,.meta){
    color:#fff;
  }
}

/* WCAG navigation: motion reduction must not reveal the keyboard-only skip link.
   The reduced-motion rule above disables decorative transforms, not the skip
   link's essential off-screen / focused positions. */
body:is(.mar-app,.mare-recife) > .mare-skip-link:not(:focus):not(:focus-visible){
  transform:translateY(-190%)!important;
}
body:is(.mar-app,.mare-recife) > .mare-skip-link:is(:focus,:focus-visible){
  transform:translateY(0)!important;
}

/* Source: src/styles/shared/mare-finesse.css */
/* MARÉ | Phase 3 · Gameplay Finesse
   Board-specific polish, never a replacement for gameplay states.
   No Three.js/canvas in puzzle surfaces. */
:root{
 --finesse-surface:#102f3d;
 --finesse-surface-2:#163b4b;
 --finesse-line:rgba(165,234,216,.33);
 --finesse-accent:#a1f3d9;
 --finesse-warm:#e9c88b;
 --finesse-ink:#f4fff8;
 --finesse-ease:cubic-bezier(.22,1,.36,1);
}
body:is(.mar-app,.mare-recife){
 --finesse-ring:0 0 0 1px rgba(168,244,221,.18),0 14px 40px rgba(0,10,24,.16);
}
body:is(.mar-app,.mare-recife) :is(.panel,.game,.newgame-panel,.depth-panel,.concha-play,.trilha-panel,.enigma-card,.marujo-panel){
 position:relative;
 isolation:isolate;
}
body:is(.mar-app,.mare-recife) :is(.panel,.game,.newgame-panel,.depth-panel,.concha-play,.trilha-panel,.enigma-card,.marujo-panel)::before{
 content:"";
 position:absolute;
 top:0;
 inset-inline:24px;
 height:1px;
 background:linear-gradient(90deg,transparent,rgba(184,250,228,.34),transparent);
 pointer-events:none;
}
body:is(.mar-app,.mare-recife) :is(.notice,.newgame-notice,.depth-status,.status,[role="status"]){
 text-wrap:pretty;
}
body:is(.mar-app,.mare-recife) :is(button,input,[role="button"]):focus-visible{
 outline:3px solid var(--finesse-warm)!important;
 outline-offset:3px!important;
}
/* State feedback is subtle and contextual, without moving game boards. */
body:is(.mar-app,.mare-recife) [data-play-feedback="win"]{
 border-color:rgba(151,248,205,.62)!important;
 box-shadow:0 0 0 1px rgba(108,222,174,.17),0 20px 55px rgba(0,13,27,.23)!important;
}
body:is(.mar-app,.mare-recife) [data-play-feedback="retry"] :is(.notice,.newgame-notice,.depth-status,.status){
 color:#ffdbad;
}
body:is(.mar-app,.mare-recife) [data-play-feedback="hint"] :is(.notice,.newgame-notice,.depth-status,.status){
 color:#e9d79e;
}
body:is(.mar-app,.mare-recife) [data-play-feedback="win"] :is(.notice,.newgame-notice,.depth-status,.status){
 color:#baffdf;
}
/* RECIFE: tiles communicate correct, present and absent with readable edges. */
body.mare-recife #board{
 width:min(100%,330px);
 margin-inline:auto;
 gap:clamp(4px,1.2vw,7px);
}
body.mare-recife #board .boardrow{gap:clamp(4px,1.2vw,7px)}
body.mare-recife #board .tile{
 border-radius:9px;
 font-variant-numeric:tabular-nums;
 box-shadow:inset 0 1px rgba(255,255,255,.045);
}
body.mare-recife #board .tile:where(.correct,[data-state="correct"]){outline:1px solid #c3ffe8;outline-offset:-3px}
body.mare-recife #board .tile:where(.present,[data-state="present"]){outline:1px solid #ffe3a1;outline-offset:-3px}
body.mare-recife #keyboard :is(button,.key):focus-visible{outline-offset:1px!important}
/* ABISMO: ranking and input gain a clear reading rhythm. */
body.mare-abismo #guessform{scroll-margin-top:15px}
body.mare-abismo #guesses{display:grid;gap:8px;min-width:0}
body.mare-abismo :is(.legend,.progress){font-variant-numeric:tabular-nums}
body.mare-abismo #guess{font-size:16px}
/* CARDUME: intentionally distinct selectable letters; groups remain prominent. */
body.mare-cardume #grid{margin-inline:auto;max-width:820px}
body.mare-cardume #grid .tile{
 border-radius:11px!important;
 transition:transform .16s var(--finesse-ease),box-shadow .16s ease,border-color .16s ease,background-color .16s ease;
}
body.mare-cardume #grid .tile[aria-pressed="true"]{
 box-shadow:inset 0 0 0 2px rgba(241,255,249,.95),0 4px 13px rgba(1,23,30,.22)!important;
}
body.mare-cardume #solved .solution{
 border:1px solid rgba(255,255,255,.18);
 box-shadow:inset 0 1px rgba(255,255,255,.22);
}
body.mare-cardume .statusline{font-variant-numeric:tabular-nums}
/* CORRENTE: meaning in history, form as primary point of entry. */
body.mare-corrente #form .entry{gap:10px}
body.mare-corrente #history{min-width:0}
body.mare-corrente :is(.history,.legend){line-height:1.5}
/* CONCHA: the wheel is the visual centerpiece, not the score. */
body.mare-concha #wheel{
 margin-inline:auto;
 position:relative;
 isolation:isolate;
}
body.mare-concha #wheel :is(button,.concha-letter){
 transition:transform .2s var(--finesse-ease),background-color .2s,border-color .2s,box-shadow .2s;
}
body.mare-concha #wheel .center{box-shadow:0 0 0 2px rgba(211,255,241,.38),0 10px 27px rgba(0,20,29,.16)}
body.mare-concha #results{scroll-margin-top:12px}
/* TRILHA: cells and the current path read as one continuous task. */
body.mare-trilha #grid button{
 border-radius:12px;
 box-shadow:inset 0 1px rgba(255,255,255,.055);
}
body.mare-trilha #grid button.chosen{
 outline:2px solid #d8fff4;
 outline-offset:-5px;
}
body.mare-trilha #formed{overflow-wrap:anywhere;color:#e8fff2}
/* ENIGMA: clue direction and active cell have distinct outlines. */
body.mare-enigma #board{min-width:0}
body.mare-enigma #board .enigma-cell.active{
 box-shadow:inset 0 -3px rgba(148,237,220,.6);
}
body.mare-enigma #board .enigma-cell.selected{
 outline:2px solid #fbffe9;
 outline-offset:-4px;
}
body.mare-enigma #currentclue{color:#f1fff8;line-height:1.45}
/* MARUJO: selected/solved paths become visually trackable. */
body.mare-marujo #board .marujo-cell.selected{
 box-shadow:inset 0 0 0 2px #e3fff7;
}
body.mare-marujo #board .marujo-cell.found{
 box-shadow:inset 0 0 0 1px rgba(205,255,224,.63);
}
body.mare-marujo #words{overflow-wrap:anywhere}
/* NAUFRAGO: legible word slots and keyboard focus. */
body.mare-forca #word{gap:clamp(3px,1vw,9px)}
body.mare-forca #word .forca-slot{
 min-width:clamp(23px,5.1vw,43px);
 border-bottom-color:#a8e8cf;
 font-variant-numeric:tabular-nums;
}
body.mare-forca #keyboard button{
 border-radius:9px;
 min-width:0;
}
body.mare-forca #keyboard button:not(:disabled):focus-visible{outline-offset:1px!important}
/* SINAIS: decoding pairs are selectable without color alone. */
body.mare-criptograma #cipher .crypto-tile{
 border:1px solid rgba(135,204,204,.4);
}
body.mare-criptograma #cipher .crypto-tile.selected{
 outline:2px solid #e2fff5;
 outline-offset:0;
}
body.mare-criptograma #cipher .crypto-tile.crypto-correct{
 border-color:#a8f5d5;
 box-shadow:inset 0 -3px rgba(109,235,164,.72);
}
body.mare-criptograma #guess{text-align:center;font-size:20px}
/* PEROLA: anagram letters are editorial, not a glowing badge. */
body.mare-perola #scramble{
 line-height:1.25;
 max-width:100%;
 overflow-wrap:anywhere;
 text-shadow:0 4px 16px rgba(0,8,22,.15);
}
body.mare-perola #entry{letter-spacing:.08em}
body.mare-perola #hint{max-width:50ch}
/* FAROL: selected words and order communicate the actual puzzle. */
body.mare-farol :is(#chosen,#tiles){gap:8px;align-content:start}
body.mare-farol #chosen{border-color:rgba(151,235,211,.62)}
body.mare-farol #tiles button{
 transition:background-color .16s ease,border-color .16s ease,transform .16s var(--finesse-ease);
}
body.mare-farol #chosen button{
 background:#17665f;
 border-color:#9df2dd;
}
/* Exact outcome from the verified result ledger, not message heuristics. */
.mare-finale{
 position:fixed;
 z-index:10000;
 inset:auto 16px 16px auto;
 width:min(405px,calc(100vw - 32px));
 border:1px solid rgba(160,234,210,.55)!important;
 background:linear-gradient(135deg,#174b49,#0c303b)!important;
 color:#effff8!important;
 box-shadow:0 22px 65px rgba(0,11,25,.55)!important;
 border-radius:20px!important;
 padding:21px 22px!important;
 display:flex;
 flex-direction:column;
 gap:8px;
}
.mare-finale[data-outcome="loss"]{
 border-color:rgba(228,190,144,.65)!important;
 background:linear-gradient(135deg,#453728,#1d3240)!important;
}
.mare-finale__eyebrow{
 font-size:.69rem;
 text-transform:uppercase;
 letter-spacing:.16em;
 font-weight:800;
 color:#c3efdf;
}
.mare-finale[data-outcome="loss"] .mare-finale__eyebrow{color:#f2d8b4}
.mare-finale__summary{
 display:flex;
 align-items:center;
 gap:12px;
}
.mare-finale__symbol{
 display:grid;
 place-items:center;
 flex:none;
 width:42px;
 height:42px;
 border-radius:13px;
 border:1px solid rgba(196,249,226,.35);
 background:rgba(147,238,201,.14);
 font:700 21px 'Outfit',system-ui,sans-serif;
}
.mare-finale strong{
 font:700 clamp(1.35rem,3vw,1.65rem)/1.08 'Outfit',system-ui,sans-serif;
 letter-spacing:-.035em;
}
.mare-finale__detail{font-size:.89rem;line-height:1.55;color:#d0e9e2}
.mare-finale__actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:7px}
.mare-finale__actions a{
 min-height:42px;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 padding:10px 14px;
 border:1px solid rgba(172,246,220,.4);
 border-radius:12px;
 text-decoration:none;
 background:#a1f3d9;
 color:#063237;
 font:800 .8rem/1.2 'DM Sans',system-ui,sans-serif;
}
.mare-finale__actions a:last-child{background:#1c4952;color:#effff7}
.mare-finale__close{
 position:absolute;
 top:12px;
 right:12px;
 min-height:35px;
 min-width:35px;
 padding:6px;
 border:1px solid rgba(207,253,236,.35);
 border-radius:10px;
 background:#123a42;
 color:#fff;
 cursor:pointer;
 font-size:19px;
}
.mare-finale a:focus-visible,.mare-finale button:focus-visible{
 outline:3px solid #e9c88b!important;
 outline-offset:2px!important;
}
@media(hover:hover) and (pointer:fine){
 body:is(.mar-app,.mare-recife) :is(#grid button,#board button,#wheel button):not(:disabled):hover{
  border-color:rgba(193,254,235,.72);
 }
 body.mare-cardume #grid .tile:not(:disabled):hover,
 body.mare-farol #tiles button:not(:disabled):hover{
  transform:translateY(-2px);
 }
}
@media(max-width:540px){
 .mare-finale{inset:auto 10px 10px!important;width:calc(100vw - 20px);padding:18px 18px!important}
 body.mare-cardume #grid .tile{font-size:clamp(11px,2.8vw,14px)!important}
 body.mare-criptograma #cipher .crypto-tile{width:clamp(28px,8.2vw,37px);min-height:54px}
 body.mare-recife #board{width:min(100%,310px)}
}
@media(prefers-reduced-motion:reduce){
 body:is(.mar-app,.mare-recife) :is(#grid button,#board button,#wheel button,.mare-finale){
  animation:none!important;
  transition:none!important;
  transform:none!important;
 }
 .mare-finale{animation:none!important}
}

/* Phase 4 (320px): Concha actions reflow instead of forcing horizontal overflow. */
@media(max-width:360px){
 body.mare-concha .concha-controls{flex-wrap:wrap}
 body.mare-concha .concha-controls > button{flex:1 1 calc(50% - 6px);min-width:0}
 body.mare-concha .concha-controls > .main-action{flex-basis:100%}
 body.mare-concha .concha-wheel{grid-template-columns:repeat(3,minmax(0,62px));grid-template-rows:repeat(3,58px)}
}

/* Source: src/styles/shared/mare-pwa.css */
/* MARÉ PWA status, opt-in install and update, responsive by construction. */
.mare-pwa{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;margin-top:18px;max-width:650px}
.mare-pwa__status{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:650;line-height:1.45;color:#b6ded7}
.mare-pwa__status::before{content:"";width:7px;height:7px;flex:none;border-radius:50%;background:#8ad9c0;box-shadow:0 0 0 3px #8ad9c021}
.mare-pwa__action{min-height:44px;padding:10px 14px;border:1px solid #a0e7cd;border-radius:10px;color:#ecfff6;background:#12494d;font:750 12px/1.25 system-ui,sans-serif;cursor:pointer}
.mare-pwa__action:is(:hover,:focus-visible){background:#236c69}
.mare-pwa__action:focus-visible{outline:3px solid #f0d494;outline-offset:3px}
.mare-pwa__action[hidden],.mare-pwa[hidden]{display:none!important}
.mare-pwa--compact:not([hidden]){position:fixed;bottom:12px;right:12px;z-index:10005;max-width:min(355px,calc(100vw - 24px));padding:11px 14px;background:#092a37;border:1px solid #8dd7c7;border-radius:13px;box-shadow:0 12px 35px #001522bb}
@media(max-width:520px){.mare-pwa{align-items:flex-start;flex-direction:column}.mare-pwa--compact{right:8px;bottom:8px}}
@media(prefers-reduced-motion:reduce){.mare-pwa *{transition:none!important;animation:none!important}}

/* Source: src/styles/shared/mare-social.css */
/* MARÉ Fase 9 · social local-first, isolated on home & game routes. */
.mare-social{
 --social-text:#f2fbf8;--social-muted:#bdd9dc;--social-mint:#a1f3d9;
 --social-edge:rgba(150,226,214,.30);--social-bg:#082a3b;
 border:1px solid var(--social-edge);border-radius:23px;
 background:radial-gradient(ellipse at 93% 0%,rgba(24,142,139,.18),transparent 48%),
 linear-gradient(132deg,#0d3844,#081f30);
 color:var(--social-text);padding:clamp(18px,3vw,34px);
 position:relative;min-width:0;overflow:hidden;
}
.mare-social *{box-sizing:border-box}
.mare-social h2,.mare-social h3{font-family:Outfit,system-ui,sans-serif;letter-spacing:-.025em;color:#f2fbf8;margin:8px 0 12px}
.mare-social h2{font-size:clamp(23px,2.5vw,33px);line-height:1.17}
.mare-social h3{font-size:19px;line-height:1.25}
.mare-social p{font-size:13px;line-height:1.6;color:var(--social-muted);margin:0}
.mare-social__eyebrow{font:800 11px/1.4 system-ui,sans-serif;letter-spacing:.15em;color:var(--social-mint)}
.mare-social__intro{max-width:70ch;margin-bottom:22px!important}
.mare-social__layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(285px,.85fr);gap:16px}
.mare-social__choice,.mare-social__peer{
 display:flex;flex-direction:column;align-items:flex-start;gap:12px;min-width:0;
 background:rgba(1,22,33,.49);border:1px solid rgba(148,212,203,.25);
 border-radius:17px;padding:clamp(16px,2.1vw,22px);
}
.mare-social__choice label{display:flex;flex-direction:column;gap:9px;font:750 12px/1.4 system-ui,sans-serif;color:#ecfff9;width:100%}
.mare-social__select,.mare-social__url{
 display:block;max-width:100%;width:100%;min-height:44px;
 padding:11px 12px;background:#133d49;border:1px solid #7ab8b1;border-radius:10px;
 font:650 13px/1.4 system-ui,sans-serif;color:#f1fff9;
}
.mare-social__select option{background:#153b48;color:white}
.mare-social__url{font:500 12px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;overflow:hidden;text-overflow:ellipsis}
.mare-social__badge{color:#dbf8ed!important;font-weight:650}
.mare-social__preview{width:100%;max-width:520px;margin:2px 0;min-width:0}
.mare-social__canvas{display:block;width:100%;height:auto;aspect-ratio:16/9;border:1px solid rgba(168,240,214,.4);border-radius:12px;background:#06212f}
.mare-social__actions{display:flex;flex-wrap:wrap;align-items:center;gap:9px;width:100%}
.mare-social__actions .mare-social__url{flex-basis:100%}
.mare-social__button,.mare-social__play{
 display:inline-flex;align-items:center;justify-content:center;
 min-height:44px;padding:10px 14px;border-radius:11px;
 border:1px solid #9ee9d0;background:#a6f2d8;
 color:#07313a;font:800 12px/1.3 system-ui,sans-serif;
 text-align:center;text-decoration:none;cursor:pointer;box-shadow:none;
}
.mare-social__button:not(:first-of-type){background:#123f4a;color:#eefaf7}
.mare-social__button:is(:hover,:focus-visible),.mare-social__play:is(:hover,:focus-visible){background:#d7fff0;color:#06323a}
.mare-social :is(.mare-social__button,.mare-social__select,.mare-social__url,.mare-social__play):focus-visible{
 outline:3px solid #f1cd87;outline-offset:3px;
}
.mare-social__status{font-size:12px!important;color:#e6faec!important;overflow-wrap:anywhere}
.mare-social__peer{justify-content:flex-start}
.mare-social__compare{
 width:100%;padding:11px 13px;border-radius:10px;border:1px solid #5d9598;
 background:#103a48;color:#f0fdf7!important;font-weight:650;
}
.mare-social__verdict{color:#b0f1d8!important;font-weight:750}
.mare-social__foot{margin-top:17px!important;font-size:11px!important;max-width:90ch}
.mare-social--hub{margin:26px 0 34px;order:2}
.mare-social--game{
 width:min(1050px,calc(100% - 32px));margin:32px auto;
 padding:19px 23px;display:flex;flex-direction:column;gap:12px;
}
.mare-social--game h2{font-size:21px;margin:0}
.mare-social--game .mare-social__game-hint{max-width:72ch}
.mare-social--game .mare-social__actions{max-width:100%}
.mare-social--game .mare-social__url{max-width:540px}
.mare-social--game .mare-social__play{align-self:flex-start}
@media(max-width:750px){
 .mare-social__layout{grid-template-columns:minmax(0,1fr)}
 .mare-social--game{width:calc(100% - 24px)}
}
@media(max-width:470px){
 .mare-social{padding:16px;border-radius:16px}
 .mare-social__actions{flex-direction:column;align-items:stretch}
 .mare-social__button,.mare-social__play{width:100%}
 .mare-social__url{min-width:0}
}
@media(prefers-reduced-motion:reduce){.mare-social *, .mare-social{transition:none!important;animation:none!important}}

/* Prevent legacy link/button tokens from lowering contrast or tap size. */
body.mare-hub a.mare-social__play,
body.mar-app a.mare-social__play,
body.mare-recife a.mare-social__play{
 color:#082e36!important;background:#a9f2d8!important;border-color:#a9f2d8!important;
}
body.mare-hub a.mare-social__play:is(:hover,:focus-visible),
body.mar-app a.mare-social__play:is(:hover,:focus-visible),
body.mare-recife a.mare-social__play:is(:hover,:focus-visible){
 color:#063037!important;background:#d5fff0!important;
}
body.mare-recife .mare-modes button{min-height:44px;min-width:44px}

/* Source: src/styles/shared/mare-selos.css */
/* MARÉ · Selos do Mar. Coleção na home e aviso de novo selo no resumo da rodada.
   Usa os tokens Kanagawa Light; nada aqui depende de cor para transmitir estado. */
.mare-selos{
 --selos-ink:var(--kan-ink,#173e5e);--selos-muted:var(--kan-secondary,#446578);
 --selos-line:var(--kan-line,rgba(35,78,112,.23));--selos-paper:var(--kan-white,#fffdf7);
 --selos-mist:var(--kan-mist,#e8f1f1);--selos-indigo:var(--kan-indigo,#174b6a);
 --selos-focus:var(--kan-focus,#ab6a17);
 position:relative;min-width:0;box-sizing:border-box;
 margin:24px 0 0;padding:clamp(18px,3vw,34px);
 background:var(--selos-paper);color:var(--selos-ink);
 border:1px solid var(--selos-line);border-radius:18px;
 box-shadow:var(--kan-shadow,0 18px 42px rgba(35,69,92,.09));
 font-family:var(--kan-sans,'DM Sans',system-ui,sans-serif);
}
body.mare-hub.mare-studio .mare-selos{order:5}
.mare-selos *{box-sizing:border-box}
.mare-selos h2,.mare-selos h3{
 font-family:var(--kan-serif,Georgia,serif);color:var(--selos-ink);
 letter-spacing:-.01em;margin:6px 0 10px;text-shadow:none;
}
.mare-selos h2{font-size:clamp(24px,2.6vw,34px);line-height:1.15}
.mare-selos h3{font-size:19px;line-height:1.25;margin-top:26px}
.mare-selos p{margin:0;font-size:14px;line-height:1.6;color:var(--selos-muted)}
.mare-selos__eyebrow{display:block;font:800 11px/1.4 system-ui,sans-serif;letter-spacing:.15em;color:var(--selos-indigo)}
.mare-selos__lead{max-width:68ch}
.mare-selos__meter{
 display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:2px 10px;
 margin:18px 0 4px;max-width:520px;
}
.mare-selos__points{font:700 clamp(40px,6vw,60px)/1 var(--kan-serif,Georgia,serif);color:var(--selos-indigo)}
.mare-selos__points-label{font-size:15px;font-weight:600;color:var(--selos-muted)}
.mare-selos__track{
 grid-column:1/-1;height:11px;margin-top:8px;overflow:hidden;
 border:1px solid var(--selos-line);border-radius:99px;background:var(--selos-mist);
}
.mare-selos__fill{display:block;height:100%;background:var(--selos-indigo);border-radius:99px}
.mare-selos__grid{
 list-style:none;margin:0;padding:0;
 display:grid;grid-template-columns:repeat(auto-fill,minmax(212px,1fr));gap:12px;
}
.mare-selos__item{
 display:flex;align-items:center;gap:12px;min-width:0;
 padding:12px;background:var(--selos-mist);
 border:1px solid var(--selos-line);border-radius:14px;
}
.mare-selos__item.is-earned{background:var(--selos-paper);border-color:var(--selos-indigo)}
.mare-selos__seal{flex:none;width:64px;height:64px}
.mare-selos__info{display:flex;flex-direction:column;gap:1px;min-width:0}
.mare-selos__info strong{font-size:15px;line-height:1.25;color:var(--selos-ink)}
.mare-selos__state{font-size:13px;font-weight:700;color:var(--selos-indigo)}
.mare-selos__item.is-locked .mare-selos__state{color:var(--selos-muted);font-weight:600}
.mare-selos__info small{font-size:12px;line-height:1.35;color:var(--selos-muted)}
.mare-selos__grid--special{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.mare-selos__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.mare-selos__button{
 min-height:44px;padding:10px 16px;border-radius:11px;cursor:pointer;
 border:1px solid var(--selos-indigo);background:var(--selos-indigo);color:var(--selos-paper);
 font:800 13px/1.3 system-ui,sans-serif;
}
.mare-selos__button--quiet{background:var(--selos-paper);color:var(--selos-indigo)}
.mare-selos__button:is(:hover,:focus-visible){background:var(--selos-ink);color:var(--selos-paper);border-color:var(--selos-ink)}
.mare-selos :is(.mare-selos__button):focus-visible{outline:3px solid var(--selos-focus);outline-offset:3px}
.mare-selos__status{min-height:1.4em;margin-top:10px;font-size:13px!important;overflow-wrap:anywhere}
.mare-selos__friend{
 margin-top:18px;padding:16px;border:1px dashed var(--selos-indigo);
 border-radius:14px;background:var(--selos-mist);
}
.mare-selos__friend[hidden]{display:none}
.mare-selos__friend h3{margin-top:0}
.mare-selos__friend p+p{margin-top:8px}
.mare-selos__friend-total{font-weight:700;color:var(--selos-ink)!important}
.mare-selos__mini{
 list-style:none;margin:12px 0;padding:0;
 display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;max-width:380px;
}
.mare-selos__mini-item svg{display:block;width:100%;height:auto}
.mare-selos__note{font-size:12px!important}
.mare-selos__sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* Alto contraste: a página inteira vira escura, então o bloco acompanha. */
:root[data-mare-contrast="high"] body.mare-kanagawa .mare-selos{
 background:#061925!important;background-image:none!important;color:#fff!important;border-color:#b0ebdf!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa .mare-selos :is(h2,h3,p,small,span,strong,.mare-selos__state){color:#fff!important}
:root[data-mare-contrast="high"] body.mare-kanagawa .mare-selos :is(.mare-selos__item,.mare-selos__friend){
 background:#020c13!important;border-color:#b0ebdf!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa .mare-selos__track{background:#020c13!important;border-color:#b0ebdf!important}
:root[data-mare-contrast="high"] body.mare-kanagawa .mare-selos__fill{background:#b0ebdf!important}
:root[data-mare-contrast="high"] body.mare-kanagawa .mare-selos__button{background:#b0ebdf!important;color:#020c13!important;border-color:#b0ebdf!important}
:root[data-mare-contrast="high"] body.mare-kanagawa .mare-selos__button--quiet{background:#020c13!important;color:#fff!important}
@media(max-width:480px){
 .mare-selos__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .mare-selos__grid--special{grid-template-columns:1fr}
 .mare-selos__item{flex-direction:column;align-items:flex-start;text-align:left}
 .mare-selos__actions .mare-selos__button{flex:1 1 100%}
 .mare-selos__mini{grid-template-columns:repeat(4,minmax(0,1fr))}
}
/* Novo selo, dentro do resumo da rodada que já existe nas páginas de jogo. */
.mare-finale__seal{
 display:flex;align-items:center;gap:10px;margin:6px 0 0;
 font-size:14px;line-height:1.4;
}
.mare-finale__seal-art{flex:none;width:44px;height:44px}

/* Source: src/styles/shared/mare-accessibility.css */
/* Phase 10: consistent accessible, low-distraction preference surface. */
.mare-access{box-sizing:border-box;width:min(1080px,calc(100% - 24px));margin:28px auto 34px;
 color:#eafaf6;font-family:system-ui,sans-serif;min-width:0}
.mare-access *{box-sizing:border-box}
.mare-access__details{border:1px solid #6b9e9f;border-radius:17px;
 background:linear-gradient(125deg,#0b3241,#0b2638);overflow:hidden}
.mare-access__summary{display:flex;align-items:center;gap:11px;
 padding:16px 20px;min-height:54px;cursor:pointer;list-style:none;color:#edfbf6}
.mare-access__summary::-webkit-details-marker{display:none}
.mare-access__summary::after{content:"⌄";margin-left:auto;font-size:20px;color:#acf1db}
.mare-access__details[open] .mare-access__summary::after{content:"⌃"}
.mare-access__icon{display:grid;place-items:center;background:#174a50;color:#b4ffe4;
 border:1px solid #71b8a7;border-radius:10px;height:35px;width:35px;flex:none}
.mare-access__summary strong{font-size:14px;line-height:1.4}
.mare-access__summary-caption{color:#b9d7d6;font-size:11px;line-height:1.4;margin-left:4px}
.mare-access__content{padding:0 20px 20px;display:grid;gap:14px}
.mare-access__content>p{font-size:13px;line-height:1.6;color:#d2e8e4;margin:0}
.mare-access__form{display:grid;gap:15px}
.mare-access__scale{border:1px solid #5b8a8c;border-radius:13px;
 display:flex;flex-wrap:wrap;gap:10px;padding:13px 15px;margin:0;min-width:0}
.mare-access__scale legend{font-weight:750;color:#eefcf8;font-size:13px;padding:0 6px}
.mare-access__radio{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;
 border:1px solid #648f92;border-radius:10px;color:#fff;font-size:13px;cursor:pointer;min-height:44px}
.mare-access input{accent-color:#a1f3d9;width:18px;height:18px;flex:none}
.mare-access__toggles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.mare-access__toggle{display:flex;align-items:flex-start;gap:10px;padding:13px;
 border:1px solid #5b8a8c;border-radius:13px;cursor:pointer;min-width:0}
.mare-access__toggle>span{display:grid;gap:5px;min-width:0}
.mare-access__toggle strong{font-size:13px;line-height:1.4;color:#f2fff8}
.mare-access__toggle small{font-size:11px;line-height:1.55;color:#c3dcdb}
.mare-access__reset{display:inline-flex;align-items:center;justify-content:center;
 border:1px solid #99e8d0;border-radius:11px;padding:10px 17px;min-height:44px;
 background:#a9f2d8;color:#08343d;font:800 12px/1.4 system-ui,sans-serif;cursor:pointer;justify-self:start}
.mare-access :is(summary,button,input):focus-visible{outline:3px solid #ffdf92!important;outline-offset:3px!important}
.mare-access__status{font:600 12px/1.5 system-ui,sans-serif;color:#d8faef;margin:0}
@media(max-width:720px){
 .mare-access__toggles{grid-template-columns:1fr}
 .mare-access__summary-caption{display:none}
 .mare-access__summary,.mare-access__content{padding-left:14px;padding-right:14px}
}
@media(max-width:380px){
 .mare-access__scale{display:grid;grid-template-columns:1fr}
 .mare-access__radio{width:100%}
}
:root[data-mare-scale="large"]{font-size:112.5%!important}
:root[data-mare-scale="extra"]{font-size:125%!important}
:root[data-mare-scale="large"] :is(.mar-container,.mare-logbook,.mare-social,.mare-access,.mare-content-control) :is(p,label,small,button,summary,a),
:root[data-mare-scale="large"] :is(.mar-app,.mare-recife) :is(.notice,.status,.mare-social p){font-size:1rem!important;line-height:1.55!important}
:root[data-mare-scale="extra"] :is(.mar-container,.mare-logbook,.mare-social,.mare-access,.mare-content-control) :is(p,label,small,button,summary,a),
:root[data-mare-scale="extra"] :is(.mar-app,.mare-recife) :is(.notice,.status,.mare-social p){font-size:1.125rem!important;line-height:1.55!important}
:root[data-mare-contrast="high"] body{
 background-color:#020c13!important;color:#fff!important;
}
:root[data-mare-contrast="high"] body :is(.mar-game,.mare-logbook,.mare-voyage__rhythm,.mare-voyage__spotlight,.mare-social,.mare-content-control,.mare-access__details,.game,.panel,.newgame-panel,.mar-continue){
 background:#061925!important;border-color:#a3ede4!important;
}
:root[data-mare-contrast="high"] body :is(p,small,legend,label,h1,h2,h3,strong,.mare-explorer__eyebrow,.mare-voyage__eyebrow){
 color:#fff!important;
}
:root[data-mare-contrast="high"] body :is(input,textarea,select){border-color:#b6f8e1!important}
:root[data-mare-contrast="high"] body a.mare-skip-link{
 background:#061925!important;color:#fff!important;border:2px solid #fff!important;
}
:root[data-mare-contrast="high"] body :is(button,a,input,select,textarea,summary):focus-visible{
 outline:4px solid #ffdf91!important;outline-offset:3px!important;
}
:root[data-mare-focus="on"] body :is(.scene,.seaweed,.fish,[data-ocean-scene],.mare-studio-hero__seal,.mare-studio-hero__coordinates){
 display:none!important;
}
:root[data-mare-focus="on"] body::before,
:root[data-mare-focus="on"] body::after{display:none!important}
:root[data-mare-motion="reduce"] body *,
:root[data-mare-motion="reduce"] body *::before,
:root[data-mare-motion="reduce"] body *::after{
 animation:none!important;transition:none!important;scroll-behavior:auto!important;
}
@media(prefers-reduced-motion:reduce){.mare-access *{animation:none!important;transition:none!important}}

/* Intrinsic wrapping prevents 125% text from widening the Concha
   difficulty field: label + native select cannot share one narrow line. */
@media(max-width:600px){
 :root[data-mare-scale="large"] .mare-content-control label,
 :root[data-mare-scale="extra"] .mare-content-control label{
  display:flex;flex-wrap:wrap;align-items:stretch;min-width:0;
 }
 :root[data-mare-scale="large"] .mare-content-control select,
 :root[data-mare-scale="extra"] .mare-content-control select{
  width:100%;max-width:100%;min-width:0;
 }
}

/* Source: src/styles/shared/mare-content.css */
/* Real free-game difficulty preferences; no change to daily gameplay. */
.mare-content-control{
 display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;
 min-width:0;width:100%;margin:14px 0;padding:13px 16px;
 border:1px solid rgba(144,213,202,.4);border-radius:14px;
 background:linear-gradient(108deg,rgba(5,43,58,.96),rgba(11,62,67,.89));
 color:#eafbf5;
}
.mare-content-control strong{font:800 10px/1.6 system-ui,sans-serif;letter-spacing:.11em;color:#9ff1d6}
.mare-content-control p{font:450 12px/1.5 system-ui,sans-serif;color:#d2eae6;margin:4px 0 0;max-width:55ch}
.mare-content-control__actions{display:flex;flex-wrap:wrap;align-items:center;gap:9px;max-width:100%}
.mare-content-control label{display:flex;align-items:center;gap:8px;font:700 12px/1.3 system-ui,sans-serif}
.mare-content-control select,.mare-content-control button{
 min-height:44px;border:1px solid #97d7c5;border-radius:10px;
 font:700 12px/1.3 system-ui,sans-serif;padding:9px 13px;
}
.mare-content-control select{color:#f5fff8;background:#113a48}
.mare-content-control option{color:#fff;background:#123f4d}
.mare-content-control__actions > button{color:#062f33!important;background:#a5eed5!important;cursor:pointer}
.mare-content-control__actions > button:is(:hover,:focus-visible){color:#062f33!important;background:#d6ffee!important}
.mare-content-control :is(select,button):focus-visible{outline:3px solid #f4d68c;outline-offset:3px}
.mare-content-control__status{font:600 11px/1.45 system-ui,sans-serif;color:#ddf7ee;max-width:25ch}
@media(max-width:600px){.mare-content-control,.mare-content-control__actions{flex-direction:column;align-items:stretch}.mare-content-control label{justify-content:space-between}}
@media(prefers-reduced-motion:reduce){.mare-content-control *{transition:none!important;animation:none!important}}

/* Source: src/styles/shared/mare-kanagawa.css */
/*
 * MARÉ / Kanagawa Light — visual layer, 2026.
 * Source of truth for the light presentation. Loaded LAST in all 13 pages.
 * This stylesheet deliberately changes surfaces, not game logic, geometry,
 * persistent states, or the semantic structure of the 12 puzzles.
 */
/* Self-hosted variable fonts (SIL OFL 1.1, see assets/fonts/OFL-*.txt).
   Same files online and offline: no third-party request, no FOUT drift. */
@font-face{font-family:'DM Sans';font-style:normal;font-display:swap;font-weight:100 1000;src:url('../assets/fonts/dm-sans-latin-ext-wght-normal.woff2') format('woff2-variations'),url('../assets/fonts/dm-sans-latin-ext-wght-normal.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'DM Sans';font-style:normal;font-display:swap;font-weight:100 1000;src:url('../assets/fonts/dm-sans-latin-wght-normal.woff2') format('woff2-variations'),url('../assets/fonts/dm-sans-latin-wght-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Outfit';font-style:normal;font-display:swap;font-weight:100 900;src:url('../assets/fonts/outfit-latin-ext-wght-normal.woff2') format('woff2-variations'),url('../assets/fonts/outfit-latin-ext-wght-normal.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Outfit';font-style:normal;font-display:swap;font-weight:100 900;src:url('../assets/fonts/outfit-latin-wght-normal.woff2') format('woff2-variations'),url('../assets/fonts/outfit-latin-wght-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root {
  color-scheme:light;
  --kan-paper:#f8f3e8;
  --kan-white:#fffdf7;
  --kan-cream:#f2e9d9;
  --kan-mist:#e8f1f1;
  --kan-sky:#d9ebee;
  --kan-blue:#315f87;
  --kan-indigo:#174b6a;
  --kan-deep:#173e5e;
  --kan-ink:#173e5e;
  --kan-secondary:#446578;
  --kan-line:rgba(35,78,112,.23);
  --kan-shadow:0 18px 42px rgba(35,69,92,.09);
  --kan-focus:#ab6a17;
  --kan-serif:Georgia,'Times New Roman',serif;
  --kan-sans:'DM Sans',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  --text:var(--kan-ink);
  --muted:var(--kan-secondary);
  --surface:var(--kan-white);
  --line:var(--kan-line);
  --ocean:var(--kan-deep);
  --cyan:var(--kan-indigo);
  --teal:var(--kan-blue);
  --gold:#a76c25;
  --play-abyss:var(--kan-paper);
  --play-layer:var(--kan-mist);
  --play-panel:var(--kan-white);
  --play-panel-high:var(--kan-sky);
  --play-ink:var(--kan-ink);
  --play-muted:var(--kan-secondary);
  --play-mint:var(--kan-indigo);
  --play-sand:var(--kan-focus);
  --m3-bg:var(--kan-paper);
  --m3-surface:var(--kan-white);
  --m3-ink:var(--kan-ink);
  --m3-muted:var(--kan-secondary);
  --mare-evo-panel:var(--kan-white);
  --mare-evo-border:var(--kan-line);
  --mare-evo-focus:var(--kan-focus);
  --mare-evo-shadow:var(--kan-shadow);
  --finesse-surface:var(--kan-white);
  --finesse-surface-2:var(--kan-mist);
  --finesse-line:var(--kan-line);
  --finesse-ink:var(--kan-ink);
  --finesse-accent:var(--kan-indigo);
  --finesse-warm:var(--kan-focus);
}
html{scrollbar-color:#9cbcca var(--kan-paper)}
body.mare-kanagawa:is(.mare-hub,.mar-app,.mare-recife) {
  color-scheme:light!important;
  color:var(--kan-ink)!important;
  background:var(--kan-paper)!important;
  background-image:radial-gradient(ellipse 58% 38% at 90% 2%,#d9e9eb 0%,transparent 72%),
    linear-gradient(180deg,#fcf8f0 0%,#f8f3e8 55%,#eef3f0 100%)!important;
  font-family:var(--kan-sans);
  min-height:100vh;
}
body.mare-kanagawa::before,body.mare-kanagawa::after{
  animation:none!important;
  background-image:none!important;
  opacity:0!important;
  pointer-events:none;
}
body.mare-kanagawa:is(.mar-app,.mare-recife) > :is(.scene,.seaweed,.fish){display:none!important}
body.mare-kanagawa :is(h1,h2,h3,h4){color:var(--kan-ink);text-shadow:none}
body.mare-kanagawa :is(p,small,legend,label){color:var(--kan-secondary)}
body.mare-kanagawa :is(a,button,input,select,textarea,summary):focus-visible{
  outline:3px solid var(--kan-focus)!important;
  outline-offset:3px!important;
}
body.mare-kanagawa :is(button,input,select,textarea){font-family:var(--kan-sans);color-scheme:light}
body.mare-kanagawa :is(a,button,[role="button"]){-webkit-tap-highlight-color:rgba(49,95,135,.12)}
body.mare-kanagawa a.mare-skip-link{
  color:var(--kan-white)!important;background:var(--kan-deep)!important;
  border-color:var(--kan-focus)!important;
}
body.mare-kanagawa img[src="assets/brand/mare-logo-transparent.svg"]{
  filter:brightness(0) saturate(100%) invert(20%) sepia(38%) saturate(998%) hue-rotate(164deg) brightness(92%) contrast(96%)!important;
}
body.mare-kanagawa :is(header,footer,.mar-top,.depth-header,.newgame-header,.topbar){
  border-color:var(--kan-line)!important;
}
body.mare-kanagawa :is(.mare-game-nav,.mar-footer,.depth-footer,.newgame-footer){
  color:var(--kan-secondary)!important;border-color:var(--kan-line)!important;
}

/* Home: an editorial gallery on Japanese rice-paper, not a dark gaming UI. */
body.mare-hub.mare-studio.mare-kanagawa{
  --studio-bg:var(--kan-paper);
  --studio-surface:var(--kan-white);
  --studio-edge:var(--kan-line);
  --studio-mint:var(--kan-indigo);
  --studio-text:var(--kan-ink);
  --studio-muted:var(--kan-secondary);
  --studio-sand:#a76c25;
  background:var(--kan-paper)!important;
  color:var(--kan-ink)!important;
}
body.mare-kanagawa .mar-top{
  padding-block:18px!important;
  background:rgba(255,253,247,.7)!important;
  border-bottom:1px solid var(--kan-line)!important;
}
body.mare-kanagawa .mar-top nav a{
  color:var(--kan-ink)!important;
  font-weight:700;
}
body.mare-kanagawa .mar-top nav a:is(:hover,:focus-visible){color:#286c97!important}
body.mare-kanagawa .mare-studio-hero{
  background:linear-gradient(115deg,#fcf8ef 0%,#f8f3e8 45%,#dfecee 100%)!important;
  border:1px solid rgba(40,82,112,.24)!important;
  border-radius:5px 30px 5px 30px!important;
  box-shadow:var(--kan-shadow)!important;
  min-height:490px;
  overflow:hidden;
}
body.mare-kanagawa .mare-studio-hero::before{
  background:repeating-linear-gradient(0deg,rgba(40,70,90,.025) 0 1px,transparent 1px 5px)!important;
  opacity:.65!important;
}
body.mare-kanagawa .mare-studio-hero__copy{
  position:relative;z-index:2;
  padding:clamp(32px,5vw,76px) 15px clamp(32px,5vw,76px) clamp(26px,5vw,72px);
}
body.mare-kanagawa .mare-studio-hero__eyebrow{
  color:var(--kan-indigo)!important;font-weight:800;letter-spacing:.22em;
}
body.mare-kanagawa .mare-studio-hero h1{
  color:var(--kan-ink)!important;
  font-family:var(--kan-serif)!important;font-weight:600!important;
  font-size:clamp(3.2rem,5.1vw,6.15rem)!important;
  line-height:1.02;letter-spacing:-.047em!important;
  max-width:10ch;
}
body.mare-kanagawa .mare-studio-hero h1 em{
  font-style:italic!important;font-weight:500!important;color:#285f80!important;
  font-family:var(--kan-serif)!important;
}
body.mare-kanagawa .mare-studio-hero__copy>p{
  color:#355973!important;font-size:clamp(1rem,1.35vw,1.22rem)!important;
  line-height:1.7;max-width:38ch;
}
body.mare-kanagawa .mare-studio-hero__actions{gap:12px;flex-wrap:wrap}
body.mare-kanagawa .mare-studio-hero__actions a{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;border:1px solid #315f87!important;
  border-radius:4px!important;padding:12px 20px;
  background:transparent!important;color:var(--kan-deep)!important;
  font-weight:800;box-shadow:none!important;
}
body.mare-kanagawa .mare-studio-hero__actions a:first-child{
  color:var(--kan-white)!important;background:var(--kan-indigo)!important;
}
body.mare-kanagawa .mare-studio-hero__actions a:is(:hover,:focus-visible){
  background:#d8e9ee!important;color:var(--kan-deep)!important;
}
body.mare-kanagawa .mare-studio-hero__visual{
  background:#e8efe9 url('../assets/backgrounds/kanagawa-wave.svg') center/cover no-repeat!important;
  border-radius:0!important;
  min-height:490px;
  box-shadow:inset 1px 0 rgba(40,75,99,.12);
}
body.mare-kanagawa .mare-studio-hero__visual::before,
body.mare-kanagawa .mare-studio-hero__visual::after{
  content:none!important;
}
body.mare-kanagawa .mare-studio-hero__visual canvas{display:none!important}
body.mare-kanagawa .mare-studio-hero__seal,
body.mare-kanagawa .mare-studio-hero__coordinates{
  color:var(--kan-deep)!important;background:rgba(250,248,240,.83)!important;
  border:1px solid rgba(30,69,96,.28)!important;border-radius:3px!important;
  box-shadow:none!important;
}
body.mare-kanagawa .mar-section-head{
  padding:34px 0 20px!important;
  border-color:var(--kan-line)!important;
}
body.mare-kanagawa .mar-section-head h2{
  font-family:var(--kan-serif)!important;
  font-size:clamp(2rem,3.2vw,3.15rem)!important;
  color:var(--kan-ink)!important;letter-spacing:-.03em!important;
}
body.mare-kanagawa .mar-section-head p{color:var(--kan-secondary)!important}
body.mare-kanagawa :is(.mare-discover,.mar-continue,.mare-recommendation,.mare-explorer,
  .mare-logbook,.mare-social,.mare-content-control,.mare-voyage>section){
  border-color:var(--kan-line)!important;
}
body.mare-kanagawa .mar-catalog{gap:17px!important}
body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game{
  height:auto!important;min-height:385px!important;max-height:none!important;
  padding:22px!important;
  color:var(--kan-ink)!important;
  background:linear-gradient(145deg,#fffdf7 0%,#f1f7f5 100%)!important;
  border:1px solid rgba(37,78,109,.24)!important;
  border-radius:5px 24px 5px 24px!important;
  box-shadow:0 10px 28px rgba(30,66,89,.065)!important;
  transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease;
}
body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game:nth-child(3n+2){
  background:linear-gradient(143deg,#fcf9f0 0%,#eaf2f1 100%)!important;
}
body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game::before,
body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game::after{
  background:none!important;box-shadow:none!important;
}
body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game[hidden]{display:none!important}
body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game:is(:hover,:focus-within){
  border-color:#4f84a2!important;
  box-shadow:0 18px 40px rgba(28,72,106,.13)!important;
  transform:translateY(-3px);
}
body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game>.mar-tag{
  color:var(--kan-blue)!important;border-color:var(--kan-line)!important;
  background:rgba(222,235,238,.75)!important;border-radius:3px!important;
}
body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game>.mar-game-symbol{
  filter:drop-shadow(0 4px 7px rgba(32,73,99,.10))!important;
}
body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game>h2.recife-card-heading{
  color:var(--kan-ink)!important;
  font-family:var(--kan-serif)!important;
  font-weight:700!important;letter-spacing:-.025em!important;
  font-size:clamp(2rem,2.5vw,3rem)!important;
  text-shadow:none!important;
}
body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game .mar-game-info p{
  color:var(--kan-secondary)!important;line-height:1.55;
}
body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game .mar-cta{
  min-height:48px;border:1px solid #3c6f8f!important;
  border-radius:4px!important;color:var(--kan-deep)!important;
  background:rgba(220,236,238,.6)!important;
  font-weight:800;
}
body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game .mar-cta:is(:hover,:focus-visible){
  background:var(--kan-indigo)!important;color:var(--kan-white)!important;
}
body.mare-kanagawa .mare-filter{
  color:var(--kan-deep)!important;background:var(--kan-white)!important;
  border:1px solid var(--kan-line)!important;
}
body.mare-kanagawa .mare-filter[aria-pressed="true"]{
  background:var(--kan-indigo)!important;color:var(--kan-white)!important;
}
body.mare-kanagawa :is(.mare-empty,.mar-footer){color:var(--kan-secondary)!important}

/* Diary, voyages, preferences and sharing: quieter paper-surface utilities. */
body.mare-kanagawa :is(.mare-logbook,.mare-voyage__rhythm,.mare-voyage__spotlight,
 .mare-social,.mare-content-control,.mare-access__details,.mar-continue,
 .mare-recommendation,.mare-discover){
  color:var(--kan-ink)!important;
  background:var(--kan-white)!important;
  border:1px solid var(--kan-line)!important;
  box-shadow:0 9px 25px rgba(26,66,91,.055)!important;
}
body.mare-kanagawa :is(.mare-logbook,.mare-voyage,.mare-social,.mare-access,.mare-content-control)
 :is(h2,h3,h4,strong,summary,legend,label){
  color:var(--kan-ink)!important;
}
body.mare-kanagawa :is(.mare-logbook,.mare-voyage,.mare-social,.mare-access,.mare-content-control)
 :is(p,small,span:not(.mare-voyage__seal):not(.mare-voyage__day-mark)){
  color:var(--kan-secondary);
}
body.mare-kanagawa :is(.mare-voyage__eyebrow,.mare-explorer__eyebrow,.mare-studio-hero__eyebrow){
  color:var(--kan-indigo)!important;
}
body.mare-kanagawa :is(.mare-logbook__stat,.mare-logbook__destination,.mare-logbook__award,
 .mare-voyage__history-item,.mare-voyage__streak-metrics>div,.mare-access__scale,.mare-access__toggle,
 .mare-social__compare,.mare-social__select,.mare-social__peer,.mare-voyage__seal){
  background:var(--kan-mist)!important;color:var(--kan-ink)!important;
  border-color:var(--kan-line)!important;
}
body.mare-kanagawa :is(.mare-logbook__destination-info strong,.mare-logbook__stat-value,
 .mare-logbook__award-description strong,.mare-voyage__streak-metrics strong,
 .mare-voyage__seal span,.mare-social__verdict){color:var(--kan-deep)!important}
body.mare-kanagawa :is(.mare-logbook__destination-info small,.mare-voyage__day small,
 .mare-logbook__fleet-caption,.mare-social__status,.mare-access__summary-caption,
 .mare-access__toggle small,.mare-access__content>p){color:var(--kan-secondary)!important}
body.mare-kanagawa :is(.mare-social__badge,.mare-social__url,.mare-access__status,
 .mare-voyage__history-item time){color:var(--kan-deep)!important}
body.mare-kanagawa :is(.mare-explorer__share,.mare-social__button,.mare-social__play,
 .mare-access__reset,.mare-voyage__play){
  background:var(--kan-indigo)!important;color:var(--kan-white)!important;
  border-color:var(--kan-indigo)!important;
}
body.mare-kanagawa :is(.mare-social__button,.mare-social__play,.mare-access__reset,
 .mare-voyage__play,.mare-explorer__share):is(:hover,:focus-visible){
  background:var(--kan-deep)!important;color:white!important;
}
body.mare-kanagawa :is(.mare-social__select option){background:#fffdf7!important;color:var(--kan-ink)!important}
body.mare-kanagawa .mare-access__icon{
  background:var(--kan-sky)!important;color:var(--kan-indigo)!important;border-color:var(--kan-line)!important;
}
body.mare-kanagawa .mare-access input{accent-color:var(--kan-indigo)}
body.mare-kanagawa .mare-access__summary::after{color:var(--kan-indigo)!important}

/* Interior: transform the shell, not the game's winning/selection logic. */
body.mare-kanagawa:is(.mar-app,.mare-recife) {
  --play-layer:var(--kan-mist);
  --play-panel:var(--kan-white);
  --play-panel-high:var(--kan-sky);
  --play-ink:var(--kan-ink);
  --play-muted:var(--kan-secondary);
  --play-mint:var(--kan-indigo);
  --play-sand:var(--kan-focus);
}
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.shell,.wrap,.layout,.concha-shell,.trilha-shell,.enigma-shell,.marujo-shell,
     .newgame-shell,.depth-shell,.app,.container){
  color:var(--kan-ink);
  position:relative;
}
body.mare-kanagawa:is(.mar-app,.mare-recife) :is(.topbar,.depth-header,.newgame-header,
 .concha-header,.trilha-header,.enigma-header,.marujo-header){
  background:rgba(255,253,247,.78)!important;
  border-color:var(--kan-line)!important;color:var(--kan-ink)!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife) :is(header a,.return-link>a,.newgame-back,
 .depth-header>a,.back){
  color:var(--kan-deep)!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife) :is(.game,.panel,.newgame-panel,.depth-panel,
 .concha-play,.concha-discover,.trilha-panel,.trilha-info,.trilha-mode,.enigma-card,.enigma-clues,
 .enigma-stats,.marujo-panel,.marujo-card,.modal,.mare-game-nav){
  background:var(--kan-white)!important;
  background-image:none!important;
  color:var(--kan-ink)!important;
  border:1px solid var(--kan-line)!important;
  box-shadow:var(--kan-shadow)!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.depth-intro,.newgame-intro,.concha-hero,.trilha-hero,.enigma-hero,.marujo-hero,
     .hero,.intro,.heading,.return-link){
  color:var(--kan-ink)!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.depth-title-lockup h1,.newgame-intro h1,.mare-game-symbol-lockup h1,
 .hero h1,.intro h1,.heading h1,.recife-title-lockup){
  font-family:var(--kan-serif)!important;
  color:var(--kan-deep)!important;
  text-shadow:none!important;
  letter-spacing:-.045em!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.depth-eyebrow,.newgame-eyebrow,.overline,.eyebrow,.tiny,
 .trilha-eyebrow,.enigma-eyebrow,.marujo-eyebrow,.mare-game-nav__title,
 .nav-intro,.depth-hud,.newgame-hud){
  color:var(--kan-blue)!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.notice,.status,.newgame-notice,.depth-status,.depth-clue,.depth-instructions,
     .bottomnote,.mare-game-nav__name,.depth-panel label,.concha-stat){
  color:var(--kan-secondary)!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife) :is(input,textarea,select):not([type="checkbox"]):not([type="radio"]){
  background:#fffefb!important;color:var(--kan-ink)!important;
  border:1px solid #7399b1!important;
  box-shadow:inset 0 1px 3px rgba(30,70,96,.05)!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife) :is(input,textarea)::placeholder{color:#5a7180!important}
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.controls,.actions,.lower,.switch,.concha-tabs,.concha-controls,.trilha-actions,
 .newgame-actions,.newgame-modes,.depth-buttons,.depth-modes,.enigma-modes,.marujo-modes)
 > button:not(:disabled){
  color:var(--kan-deep)!important;
  background:var(--kan-mist)!important;
  border:1px solid #7fa8bf!important;
  box-shadow:none!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.controls,.actions,.lower,.switch,.concha-tabs,.concha-controls,.trilha-actions,
 .newgame-actions,.newgame-modes,.depth-buttons,.depth-modes,.enigma-modes,.marujo-modes)
 > button[aria-pressed="true"],
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.controls,.actions,.lower,.switch,.concha-tabs,.concha-controls,.trilha-actions,
 .newgame-actions,.newgame-modes,.depth-buttons,.depth-modes,.enigma-modes,.marujo-modes)
 > button.active{
  color:var(--kan-white)!important;background:var(--kan-indigo)!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.mare-game-nav__link,.mare-game-nav__name){
  background:transparent!important;color:var(--kan-deep)!important;
  border-color:var(--kan-line)!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife) .mare-game-nav__link:is(:hover,:focus-visible){
  background:var(--kan-mist)!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife) .mare-game-nav__link[aria-current="page"]{
  background:#d8e9ee!important;color:var(--kan-deep)!important;
  border-color:#739eb7!important;
}
/* Base cells only. Data states and solved outcomes retain their own selectors. */
body.mare-kanagawa.mare-recife #board .tile:not(.correct):not(.present):not(.absent):not([data-state]),
body.mare-kanagawa.mare-cardume #grid .tile:not([aria-pressed="true"]):not(.solved),
body.mare-kanagawa.mare-trilha #grid button:not(.chosen):not([aria-pressed="true"]),
body.mare-kanagawa.mare-enigma #board .enigma-cell:not(.selected):not(.active),
body.mare-kanagawa.mare-marujo #board .marujo-cell:not(.selected):not(.found),
body.mare-kanagawa.mare-criptograma #cipher .crypto-tile:not(.selected):not(.crypto-correct){
  background:#eef4f2!important;
  border-color:#8aaabc!important;color:var(--kan-ink)!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife) :is(.board,.grid,.keyboard,.depth-tiles,.depth-scramble){color:var(--kan-ink)}
body.mare-kanagawa:is(.mar-app,.mare-recife) :is(.modalwrap,.overlay)::backdrop{background:rgba(21,49,74,.46)}
body.mare-kanagawa:is(.mar-app,.mare-recife) :is(.mare-social,.mare-access__details){
  background:var(--kan-white)!important;color:var(--kan-ink)!important;
}
/* Thin engraved-wave signature in unused space, not behind gameplay text. */
body.mare-kanagawa:is(.mar-app,.mare-recife) :is(.depth-shell,.newgame-shell,.shell,.wrap){
  background-image:linear-gradient(rgba(248,243,232,.93),rgba(248,243,232,.93)),
    url('../assets/backgrounds/kanagawa-wave.svg');
  background-repeat:no-repeat;background-position:right top;background-size:100% 100%,min(560px,80vw) auto;
}
body.mare-kanagawa .mare-finale{
  background:var(--kan-white)!important;color:var(--kan-ink)!important;border-color:var(--kan-line)!important;
}
body.mare-kanagawa .mare-finale :is(h2,h3,strong){color:var(--kan-deep)!important}
body.mare-kanagawa .mare-finale :is(p,.mare-finale__detail){color:var(--kan-secondary)!important}
body.mare-kanagawa .mare-finale__actions a{
  color:var(--kan-white)!important;background:var(--kan-indigo)!important;border-color:var(--kan-indigo)!important;
}

/* Functional preferences always win over aesthetic treatments. */
:root[data-mare-focus="on"] body.mare-kanagawa .mare-studio-hero__visual{display:none!important}
:root[data-mare-focus="on"] body.mare-kanagawa:is(.mar-app,.mare-recife) :is(.depth-shell,.newgame-shell,.shell,.wrap){
  background-image:none!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa{
  color-scheme:dark!important;background:#020c13!important;color:#fff!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa :is(.mare-studio-hero,.mar-top,.mar-game,
 .mare-logbook,.mare-social,.mare-access__details,.mare-voyage>section,.mar-continue,
 .game,.panel,.newgame-panel,.depth-panel,.trilha-panel,.concha-play,.enigma-card,
 .marujo-panel,.mare-game-nav,.modal){
  background:#061925!important;background-image:none!important;color:#fff!important;
  border-color:#b0ebdf!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa :is(h1,h2,h3,h4,p,small,span,strong,label,legend,
 .mare-studio-hero h1,.mare-studio-hero h1 em,.recife-title-lockup,.depth-title-lockup h1,
 .mar-top nav a,.mare-game-nav__name,.mare-logbook__stat-value){
  color:#fff!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa .mare-studio-hero__visual{display:none!important}
:root[data-mare-contrast="high"] body.mare-kanagawa img[src="assets/brand/mare-logo-transparent.svg"]{filter:none!important}
:root[data-mare-contrast="high"] body.mare-kanagawa :is(button,a,input,select,textarea,summary):focus-visible{
  outline:4px solid #ffdf91!important;
}
/* Contrast repair for legacy text tokens originally designed for dark backgrounds. */
body.mare-hub.mare-kanagawa :is(.mare-discover-title>strong,.mare-discover-title strong,
 .mare-discover p,.mar-continue p,.mare-recommendation p){
 color:var(--kan-deep)!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.gameheading>p,.depth-intro>p,.newgame-intro>p,
 .trilha-result>span,.marujo-selection>span,
 #edition,#direction,.statusline,.statusline>span,
 .depth-hud>span,.newgame-hud>span,
 label[for="guess"],label[for="word"],label[for="entry"],
 .hint,.hint-text,.instructions,.help-text,.caption,.legend){
 color:var(--kan-deep)!important;
 text-shadow:none!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.panel,.game,.newgame-panel,.depth-panel,.concha-play,.trilha-panel,
 .enigma-card,.marujo-panel,.marujo-card,.depth-intro,.newgame-intro)
 :is(p,label,small,legend):not(.mare-social__status){
 color:var(--kan-secondary)!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(button#check,button#submit,button#go,button#send,
 .main-action,.primary,.btn-primary,.depth-buttons>#submit,
 .newgame-actions>#submit,.controls>[type="submit"],.actions>[type="submit"]){
 color:#fffdf7!important;
 background:#174b6a!important;
 border:1px solid #174b6a!important;
 text-shadow:none!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(button#check,button#submit,button#go,button#send,.main-action,.primary,.btn-primary)
 :is(span,strong){color:#fffdf7!important}
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(button#check,button#submit,button#go,button#send,.main-action,.primary,.btn-primary):disabled{
 opacity:.65!important;cursor:not-allowed;
}

/* Contrast-safe field labels, metadata and primary form actions. */
body.mare-kanagawa :is(.mare-discover-title>span,.mare-progress,.mare-progress>span,
 .concha-top,.concha-listhead,.concha-listhead>b,.concha-progress-label,.concha-progress-label>b,
 .empty,.trilha-result,.trilha-result>span,.marujo-selection,.marujo-selection>span,
 .trilha-meta,.marujo-meta,.enigma-meta){
 color:#173e5e!important;text-shadow:none!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(#best,#level,#clock,#direction,#edition,#attempts,#remaining,
 .trilha-result>span,.marujo-selection>span){
 color:#173e5e!important;text-shadow:none!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.trilha-result,.marujo-selection,.enigma-meta,.trilha-meta,.marujo-meta,
 .statusline,.concha-top,.concha-listhead,.concha-progress-label){
 background:transparent!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife) button[type="submit"]:not(:disabled){
 background:#174b6a!important;color:#fffdf7!important;
 border:1px solid #174b6a!important;text-shadow:none!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife) button[type="submit"]:is(:hover,:focus-visible){
 background:#173e5e!important;color:#fffdf7!important;
}

/* Fine-grained WCAG fixes verified against browser-computed backgrounds. */
body.mare-kanagawa #mare-quick-guide{
 background:#fffdf7!important;color:#173e5e!important;border-color:var(--kan-line)!important;
}
body.mare-kanagawa #mare-quick-guide :is(p,span,strong){
 color:#173e5e!important;
}
body.mare-kanagawa .mare-recommendation__title,
body.mare-kanagawa .mare-discover-title>span{
 color:#173e5e!important;
}
body.mare-kanagawa .mare-social__choice,
body.mare-kanagawa .mare-social__peer{
 background:#e8f1f1!important;border-color:var(--kan-line)!important;color:#173e5e!important;
}
body.mare-kanagawa .mare-social__choice>label,
body.mare-kanagawa .mare-social__choice .mare-social__badge{
 color:#173e5e!important;
}
body.mare-kanagawa .mare-social__url,
body.mare-kanagawa .mare-social__select{
 background:#fffdf7!important;color:#173e5e!important;
 border-color:#7296a8!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife) .empty{
 background:#e8f1f1!important;color:#173e5e!important;
 border-color:var(--kan-line)!important;
}
body.mare-kanagawa.mare-recife .mare-legend>span,
body.mare-kanagawa.mare-recife .mare-progress{
 color:#173e5e!important;text-shadow:none!important;
}
body.mare-kanagawa.mare-trilha #formed{
 color:#173e5e!important;text-shadow:none!important;
}
body.mare-kanagawa.mare-trilha #daily[aria-pressed="true"],
body.mare-kanagawa.mare-trilha #daily.active{
 background:#174b6a!important;color:#fffdf7!important;
}
body.mare-kanagawa.mare-enigma .enigma-current{
 background:#e8f1f1!important;border:1px solid var(--kan-line)!important;
}
body.mare-kanagawa.mare-enigma .enigma-current :is(#direction,#currentclue){
 color:#173e5e!important;text-shadow:none!important;
}
body.mare-kanagawa.mare-marujo #words>span{
 background:#e8f1f1!important;color:#173e5e!important;
 border-color:#8baabc!important;
}
body.mare-kanagawa.mare-marujo #words>span.found{
 background:#d3eadc!important;border-color:#4e8873!important;color:#173e5e!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa
 :is(#mare-quick-guide,.mare-social__choice,.mare-social__peer,
 .mare-social__url,.mare-social__select,.empty,.enigma-current,.marujo-words>span){
 background:#061925!important;border-color:#b0ebdf!important;color:#fff!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa
 :is(#mare-quick-guide p,.mare-social__choice>label,.mare-social__badge,
 .mare-recommendation__title,.mare-discover-title>span,.enigma-current #direction,
 .enigma-current #currentclue,#formed,#words>span){
 color:#fff!important;
}

/* Populated Diary accessibility state: old mint caption on light paper. */
body.mare-hub.mare-kanagawa .mar-eyebrow{
 color:#173e5e!important;text-shadow:none!important;
}
:root[data-mare-contrast="high"] body.mare-hub.mare-kanagawa .mar-eyebrow{
 color:#fff!important;
}

/* Specificity-safe accessibility overrides: dark mode must win over paper cards. */
:root[data-mare-contrast="high"] body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game{
 background:#061925!important;background-image:none!important;border-color:#b0ebdf!important;
 color:#fff!important;
}
:root[data-mare-contrast="high"] body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game
 :is(.mar-tag,.recife-card-heading,.mar-game-info p){color:#fff!important}
:root[data-mare-contrast="high"] body.mare-kanagawa
 :is(.mare-logbook__stat,.mare-logbook__destination,.mare-logbook__award,
 .mare-voyage__history-item,.mare-voyage__streak-metrics>div,.mare-access__scale,
 .mare-access__toggle,.mare-social__compare,.mare-social__select,.mare-social__peer,.mare-voyage__seal){
 background:#061925!important;border-color:#b0ebdf!important;color:#fff!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa
 :is(.mare-logbook__destination-info strong,.mare-logbook__stat-value,.mare-logbook__award-description strong,
 .mare-voyage__streak-metrics strong,.mare-voyage__seal span,.mare-social__verdict,
 .mare-logbook__destination-info small,.mare-social__status,.mare-access__summary-caption,
 .mare-access__toggle small,.mare-access__content>p){color:#fff!important}
:root[data-mare-contrast="high"] body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.depth-shell,.newgame-shell,.shell,.wrap){background-image:none!important}

@media(max-width:920px){
 body.mare-kanagawa .mare-studio-hero{grid-template-columns:1fr 1fr}
 body.mare-kanagawa .mare-studio-hero h1{font-size:clamp(2.9rem,5.9vw,5rem)!important}
}
@media(max-width:720px){
 body.mare-kanagawa .mare-studio-hero{
  display:flex!important;flex-direction:column!important;
  border-radius:5px 19px 5px 19px!important;
 }
 body.mare-kanagawa .mare-studio-hero__copy{padding:32px 25px 16px!important}
 body.mare-kanagawa .mare-studio-hero h1{max-width:13ch;font-size:clamp(2.65rem,9vw,4.25rem)!important}
 body.mare-kanagawa .mare-studio-hero__visual{
  position:relative!important;inset:auto!important;opacity:1!important;
  width:100%;height:240px;min-height:240px!important;background-position:center 43%!important;
 }
 body.mare-kanagawa .mare-studio-hero__visual .mare-studio-hero__seal,
 body.mare-kanagawa .mare-studio-hero__visual .mare-studio-hero__coordinates{display:none!important}
 body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game{min-height:345px!important}
 body.mare-kanagawa .mar-top{background:transparent!important}
}
@media(max-width:420px){
 body.mare-kanagawa .mare-studio-hero__visual{height:210px;min-height:210px!important}
 body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game{padding:19px!important;min-height:340px!important}
 body.mare-kanagawa .mare-studio-hero__actions a{width:100%}
}
@media(prefers-reduced-motion:reduce){
 body.mare-kanagawa *,body.mare-kanagawa *::before,body.mare-kanagawa *::after{
  animation-duration:.01ms!important;transition-duration:.01ms!important;
 }
 body.mare-kanagawa .mar-catalog>article.mar-game:is(:hover,:focus-within){transform:none!important}
}
:root[data-mare-motion="reduce"] body.mare-kanagawa *,
:root[data-mare-motion="reduce"] body.mare-kanagawa *::before,
:root[data-mare-motion="reduce"] body.mare-kanagawa *::after{
 animation:none!important;transition:none!important;transform:none!important;
}

/* Keyboard skip link is always visible while focused, including motion-reduced users. */
body.mare-kanagawa > a.mare-skip-link{
 position:fixed!important;top:12px!important;left:12px!important;
 z-index:99999!important;transform:translateY(-160%)!important;
}
body.mare-kanagawa > a.mare-skip-link:is(:focus,:focus-visible){
 top:12px!important;left:12px!important;
 transform:translateY(0)!important;clip-path:none!important;
 opacity:1!important;visibility:visible!important;
}
:root[data-mare-motion="reduce"] body.mare-kanagawa > a.mare-skip-link:not(:focus):not(:focus-visible){
 transform:translateY(-160%)!important;
}
:root[data-mare-motion="reduce"] body.mare-kanagawa > a.mare-skip-link:is(:focus,:focus-visible){
 transform:translateY(0)!important;
}

/* High-contrast + large text: strongest display-contract selectors go last. */
:root[data-mare-contrast="high"] body.mare-hub.mare-kanagawa
 :is(.mare-discover-title>strong,.mare-discover-title>span,
 .mare-recommendation__title,.mare-recommendation__copy){
 color:#fff!important;text-shadow:none!important;
}
:root[data-mare-contrast="high"] body.mare-hub.mare-kanagawa
 #mare-quick-guide :is(strong,p,span){
 color:#fff!important;text-shadow:none!important;
}
:root[data-mare-contrast="high"] body.mare-hub.mare-kanagawa
 .mar-catalog>article.mar-game>.mar-tag{
 color:#fff!important;background:#061925!important;
 border-color:#b0ebdf!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa
 :is(.mare-recommendation,.mare-discover,.mare-social__choice,.mare-social__peer,
 #mare-quick-guide,.mare-logbook,.mare-voyage__spotlight,.mare-voyage__rhythm){
 background:#061925!important;border-color:#b0ebdf!important;
}

/* Diagnostic footer and global navigation stay readable in contrast mode,
 * including the extra-large accessible typography preset. */
:root[data-mare-contrast="high"] body.mare-kanagawa
 :is(footer,.mar-footer,.depth-footer,.newgame-footer,.mare-game-nav__title,
 .mare-game-nav__name,.return-link,.back,.mare-studio-hero__eyebrow){
 color:#fff!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa
 :is(footer,.mar-footer,.depth-footer,.newgame-footer) a,
:root[data-mare-contrast="high"] body.mare-hub.mare-kanagawa .mar-footer a[href="?diagnostico=1"]{
 color:#fff!important;
 text-decoration:underline;text-underline-offset:3px;
}

/* High-contrast invariant for ALL twelve games. Accessible ink, metadata,
 * and navigation must not inherit the light palette while canvas is dark.
 * Puzzle states and controls remain semantically distinct. */
:root[data-mare-contrast="high"] body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(h1,h2,h3,h4,label,legend,.tiny,.eyebrow,.overline,
 .mare-progress,.bottomnote,.gameheading>p,.depth-intro>p,.newgame-intro>p,
 .trilha-result>span,.marujo-selection>span,.trilha-info>p,.trilha-info>h2,
 .concha-stat>span,.concha-listhead,.concha-progress-label,
 .depth-hud>span,.newgame-hud>span,.statusline>span,
 #edition,#clock,#level,#best,#tries,#found,#remaining,#results>p,
 #status,#progress,#scramble,#currentclue,#direction,
 .mare-game-nav__title,.mare-game-nav__name,
 .return-link>a,.topbar a,.newgame-back,.depth-header>a,.back){
 color:#fff!important;text-shadow:none!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.mare-game-nav__link,.mare-game-nav__link[aria-current="page"],
 .trilha-info,.trilha-mode,.enigma-card,.enigma-current,.enigma-clues,
 .marujo-card,.marujo-panel,.depth-intro,.newgame-intro){
 background:#061925!important;background-image:none!important;border-color:#b0ebdf!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.mare-game-nav__link,.mare-game-nav__link[aria-current="page"]) :is(span,strong){
 color:#fff!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.game,.panel,.newgame-panel,.depth-panel,.concha-play,
 .trilha-panel,.enigma-card,.marujo-card)
 :is(p,small,legend,label):not(.tile):not(.key){
 color:#fff!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.depth-modes,.newgame-modes,.concha-tabs,.trilha-mode,.enigma-modes,.marujo-modes)
 > button:not(:disabled){
 background:#061925!important;border-color:#b0ebdf!important;color:#fff!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.depth-modes,.newgame-modes,.concha-tabs,.trilha-mode,.enigma-modes,.marujo-modes)
 > button[aria-pressed="true"]{
 background:#174b6a!important;color:#fff!important;
}

/* Last two high-contrast game surfaces: the Concha discovery pane and
 * Enigma stats had light paper behind accessible white labels. */
:root[data-mare-contrast="high"] body.mare-kanagawa.mare-concha
 :is(.concha-discover,.concha-stat,#results){
 background:#061925!important;background-image:none!important;
 border-color:#b0ebdf!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa.mare-concha
 :is(.concha-stat>span,#found,#results>p){
 color:#fff!important;text-shadow:none!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa.mare-enigma .enigma-stats{
 background:#061925!important;background-image:none!important;
 border-color:#b0ebdf!important;
}
:root[data-mare-contrast="high"] body.mare-kanagawa.mare-enigma .enigma-stats :is(p,span,strong,#progress){
 color:#fff!important;text-shadow:none!important;
}

/* Concha's populated word-count heading belongs to the high-contrast ink set. */
:root[data-mare-contrast="high"] body.mare-kanagawa.mare-concha
 .concha-listhead > b{
 color:#fff!important;text-shadow:none!important;
}


/* ================================================================
   KANAGAWA LIGHT / CONSISTENCY PASS
   Measured in Chromium across all 13 routes (desktop 1440 / mobile 390).
   Limit these material overrides to the standard light theme: accessibility
   high contrast has its own protected styling below in the cascade.
   ================================================================ */
:root:not([data-mare-contrast="high"]) body.mare-kanagawa {
  --kan-control:#e8f1f1;
  --kan-control-hover:#d9ebee;
  --kan-control-line:#88aabd;
  --kan-wash:#eff5f3;
  --kan-outline:#789caf;
}

/* Home: remove surviving deep-sea panels, neon backgrounds and dark cards. */
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa.mare-studio
 .mar-catalog > article.mar-game:first-child {
  background:linear-gradient(147deg,#fffdf7 0%,#e8f1f1 85%)!important;
  background-image:linear-gradient(147deg,#fffdf7 0%,#e8f1f1 85%)!important;
  border-color:#9bbcc9!important;
  box-shadow:0 12px 34px rgba(28,72,106,.08)!important;
}
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa
 :is(.mare-logbook__panel,.mare-voyage__activity,.mare-explorer__meter,
     .mare-explorer__mission,.mare-logbook__collection,.mare-explorer__missions,
     .mare-logbook__collection summary,.mare-logbook__empty,
     .mare-explorer__track,.mare-voyage__history,
     .mare-voyage__day-mark,.mare-voyage__streak,
     .mare-logbook__mission-track,.mare-guide){
  color:var(--kan-ink)!important;
  background:var(--kan-wash)!important;
  background-image:none!important;
  border-color:var(--kan-line)!important;
  box-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa
 :is(.mare-logbook__panel,.mare-voyage__activity,.mare-explorer__meter,
 .mare-explorer__missions,.mare-guide,.mare-logbook__collection){
  background:var(--kan-white)!important;
  box-shadow:0 9px 28px rgba(22,63,91,.06)!important;
}
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa
 :is(.mare-explorer__mission.is-complete,.mare-logbook__award.is-earned,
 .mare-explorer__badge.is-earned,.mare-voyage__day.is-done .mare-voyage__day-mark){
  background:#d8eee4!important;
  color:#173e5e!important;
  border-color:#7fac9a!important;
}
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa
 :is(.mare-logbook__empty,.mare-logbook__collection summary,
 .mare-explorer__mission,.mare-explorer__mission p,.mare-explorer__mission span,
 .mare-logbook__panel p,.mare-logbook__panel small,.mare-voyage__activity p,
 .mare-voyage__activity small,.mare-voyage__day-mark,
 .mare-explorer__badge,.mare-logbook__award,.mare-logbook__award small,
 .mare-guide strong,.mare-card-meta,.mare-card-meta span){
  color:var(--kan-ink)!important;
  text-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa
 :is(.mare-recommendation__link,.mar-continue .mar-cta,
 .mare-explorer__share,.mare-logbook__collection summary){
  border-radius:5px!important;
}
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa
 :is(.mar-continue,.mare-guide,.mare-empty,.mare-recommendation,
 .mare-logbook__empty){
  border-color:var(--kan-line)!important;
}
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa
 .mar-mode-links a {
  color:var(--kan-deep)!important;
  background:#e8f1f1!important;
  border:1px solid #9bbcc9!important;
  border-radius:4px!important;
}
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa
 .mar-mode-links a:is(:hover,:focus-visible){
  background:#d3e8ee!important;
  border-color:#4e829f!important;
}
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa
 .mare-social__canvas{
  background:#f8f3e8!important;
  border:1px solid #9ab6c1!important;
  box-shadow:0 12px 25px rgba(25,58,83,.09)!important;
}
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa
 :is(.mare-social__badge,.mare-social__status,.mare-social__intro,
 .mare-social__verdict,.mare-social__eyebrow,.mare-social__choice label){
  color:var(--kan-ink)!important;
}
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa
 .mare-social__button:not(:first-of-type){
  background:#e8f1f1!important;
  color:var(--kan-deep)!important;
  border-color:#7299ad!important;
}
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa
 .mare-social__button:not(:first-of-type):is(:hover,:focus-visible){
  background:#d3e8ee!important;
}

/* Shared in-game header controls: no dark translucent chips on light paper. */
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(header a[href="./"]:not(:has(img)),.return-link>a,.back,.newgame-back,
 .depth-header>a:not(:has(img))){
  color:var(--kan-deep)!important;
  background:#fffdf7!important;
  background-image:none!important;
  border:1px solid #9ab8c7!important;
  box-shadow:none!important;
  text-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(header a[href="./"]:not(:has(img)),.return-link>a,.back,.newgame-back,
 .depth-header>a:not(:has(img))):is(:hover,:focus-visible){
  color:var(--kan-deep)!important;
  background:#deedf0!important;
  border-color:#4a7e99!important;
}
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.progress,.depth,.meta,.gameheading,.heading,
 .mare-progress,.mare-pane-head,.concha-top,.concha-stat,
 .depth-hud,.newgame-hud,.statusline,.trilha-meta,.enigma-meta,.marujo-meta){
  border-color:var(--kan-line)!important;
  color:var(--kan-secondary)!important;
}
/* Paper-key controls. Primary, active, win/loss, found and marked cells
   are excluded: the meaning of puzzle states must remain perceptible. */
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.mare-modes button,.mare-sonda-picker button,
 .controls>button,.actions>button,.trilha-actions>button,
 .trilha-info button,.trilha-mode button,.enigma-actions button,
 .enigma-clues button,.marujo-actions button,.marujo-modes button,
 .concha-controls button,.concha-tabs button,.newgame-shell button,
 .depth-shell button,.switch button):not(.primary):not(.main-action):not(.chosen):not(.current):not(.completed):not(.active):not([aria-pressed="true"]):not([type="submit"]):not(:disabled){
  color:var(--kan-deep)!important;
  background:var(--kan-control)!important;
  background-image:none!important;
  border:1px solid var(--kan-control-line)!important;
  box-shadow:none!important;
  text-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.mare-modes button,.mare-sonda-picker button,.controls>button,
 .actions>button,.trilha-actions>button,.trilha-info button,
 .trilha-mode button,.enigma-actions button,.enigma-clues button,
 .marujo-actions button,.concha-controls button,.concha-tabs button,
 .newgame-shell button,.depth-shell button,.switch button):not(.primary):not(.main-action):not(.chosen):not(.current):not(.completed):not(.active):not([aria-pressed="true"]):not([type="submit"]):not(:disabled):is(:hover,:focus-visible){
  background:var(--kan-control-hover)!important;
  border-color:#497f9e!important;
}

/* Recife: cards, focus panel, keyboard and unplayed tiles. */
:root:not([data-mare-contrast="high"]) body.mare-recife.mare-kanagawa
 :is(.mare-pane,.mare-pane.focused,.mare-pane-head,
 .leftPanel,.panel-art,.panel-sonar,.ocean-tag,.explore-points>div){
  background:var(--kan-white)!important;background-image:none!important;
  border-color:var(--kan-line)!important;color:var(--kan-ink)!important;
  box-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-recife.mare-kanagawa
 .mare-pane.focused:not(.solved){
  background:#eaf3f3!important;
  outline:2px solid #7ba5b9;
  outline-offset:2px;
}
:root:not([data-mare-contrast="high"]) body.mare-recife.mare-kanagawa
 :is(.mare-modes button:not(.active):not([aria-pressed="true"]),
 .mare-sonda-picker button:not(.chosen),
 .key:not(.correct):not(.present):not(.absent)){
  color:var(--kan-deep)!important;
  background:linear-gradient(160deg,#f9fbf8,#dfecef)!important;
  border:1px solid #91b2c4!important;
  box-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-recife.mare-kanagawa
 :is(.mare-row .tile,.game .tile):not(.correct):not(.present):not(.absent){
  color:var(--kan-ink)!important;
  background:#f9fbfa!important;
  border-color:#94b1bf!important;
  box-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-recife.mare-kanagawa
 .mare-modes button:not(.active):not([aria-pressed="true"]) small{
  color:#446578!important;
}
:root:not([data-mare-contrast="high"]) body.mare-recife.mare-kanagawa
 :is(.leftPanel p,.leftPanel small,.leftPanel .rule,.gameheading p,.bottomnote){
  color:var(--kan-secondary)!important;
}

/* Concha's wheel and discovery items, preserving the central-letter cue. */
:root:not([data-mare-contrast="high"]) body.mare-concha.mare-kanagawa
 .concha-letter:not(.center):not([aria-pressed="true"]){
  color:var(--kan-ink)!important;
  background:linear-gradient(145deg,#fffdf7,#dcecef)!important;
  border:1px solid #749bb2!important;
  box-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-concha.mare-kanagawa
 .concha-letter.center{
  color:#fffdf7!important;
  background:#315f87!important;
  border:2px solid #153e5f!important;
  box-shadow:0 3px 8px rgba(31,77,109,.15)!important;
}
:root:not([data-mare-contrast="high"]) body.mare-concha.mare-kanagawa
 .concha-results span:not(.pangram){
  background:#e8f1f1!important;
  border-color:#97b8c4!important;
  color:var(--kan-ink)!important;
}
:root:not([data-mare-contrast="high"]) body.mare-concha.mare-kanagawa
 .concha-results span.pangram{
  background:#f1e1b9!important;
  color:#61410f!important;
  border-color:#b99759!important;
}

/* Enigma: full puzzle is now a paper grid, not an abyssal slab. */
:root:not([data-mare-contrast="high"]) body.mare-enigma.mare-kanagawa
 .enigma-board{
  background:#b7cfdb!important;
  border:5px solid #9bb5c2!important;
  box-shadow:inset 0 1px 6px rgba(28,69,92,.11)!important;
}
:root:not([data-mare-contrast="high"]) body.mare-enigma.mare-kanagawa
 .enigma-cell:not(.blank):not(.active):not(.selected):not(.completed){
  background:#fffdf7!important;
  border-color:#9dbccc!important;
  color:#173e5e!important;
}
:root:not([data-mare-contrast="high"]) body.mare-enigma.mare-kanagawa
 .enigma-cell.blank{
  background:#547e99!important;
  border-color:#547e99!important;
  color:transparent!important;
}
:root:not([data-mare-contrast="high"]) body.mare-enigma.mare-kanagawa
 .enigma-cell.active{
  background:#d7e9ed!important;
  color:#173e5e!important;
  border-color:#366c91!important;
}
:root:not([data-mare-contrast="high"]) body.mare-enigma.mare-kanagawa
 .enigma-cell.selected{
  background:#315f87!important;
  border-color:#174b6a!important;
  color:#fffdf7!important;
}
:root:not([data-mare-contrast="high"]) body.mare-enigma.mare-kanagawa
 .enigma-cell small{
  color:inherit!important;
}

/* Farol/Pérola: game-piece buttons and manuscript-like choice area. */
:root:not([data-mare-contrast="high"]) body.mare-farol.mare-kanagawa
 .depth-tile:not(.chosen):not(.selected):not([aria-pressed="true"]){
  background:#e8f1f1!important;
  border:1px solid #87aabd!important;
  color:#173e5e!important;
}
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mare-perola,.mare-farol)
 :is(.depth-scramble,.depth-picked,.depth-chosen){
  background:#eef5f1!important;
  border-color:var(--kan-line)!important;
  color:var(--kan-ink)!important;
}

/* New games: tactile typewriter keys, not neon buttons. */
:root:not([data-mare-contrast="high"]) body.mare-forca.mare-kanagawa
 .forca-keyboard button:not(.correct):not(.wrong):not(:disabled){
  background:#e6eff0!important;color:#173e5e!important;
  border-color:#92b2c1!important;box-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-criptograma.mare-kanagawa
 .crypto-tile:not(.selected):not(.crypto-correct){
  background:#edf4f1!important;border-color:#8fb0be!important;
  color:#173e5e!important;
}

/* Shared small-print and ancillary content in paper mode. */
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(.legend,.legend span,.depth-instructions,.newgame-hint,.newgame-notice,
 .concha-note,.trilha-clue p,.marujo-card p,.enigma-clues p,.game .empty){
  color:var(--kan-secondary)!important;
}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  :root:not([data-mare-contrast="high"]) body.mare-kanagawa
  :is(.mar-mode-links a,.concha-letter,.depth-tile):is(:hover,:focus-visible){
    transform:translateY(-1px);
    transition:transform .18s ease,background-color .18s ease;
  }
}


/* Individual unplayed game pieces share a light paper base.
   Only neutral/unselected states are recolored. */
:root:not([data-mare-contrast="high"]) body.mare-cardume.mare-kanagawa
 .tile:not(.solved):not([aria-pressed="true"]){
  background:#eff6f4!important;background-image:none!important;
  border:1px solid #9cbbc9!important;color:#173e5e!important;
  box-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-cardume.mare-kanagawa
 .tile[aria-pressed="true"]{
  background:#315f87!important;background-image:none!important;
  color:#fffdf7!important;border-color:#174b6a!important;
  box-shadow:inset 0 0 0 2px #a8ced9!important;
}
:root:not([data-mare-contrast="high"]) body.mare-abismo.mare-kanagawa
 :is(.item,.guesses .item,.listtitle,.guess){
  background:#eff5f2!important;background-image:none!important;
  color:#173e5e!important;border-color:#99b7c3!important;
  box-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-abismo.mare-kanagawa
 :is(.item small,.item .rank,.listtitle span,.guesshead){
  color:#315f87!important;
}
:root:not([data-mare-contrast="high"]) body.mare-corrente.mare-kanagawa
 :is(.guess,.guesshead){
  background:#eff5f2!important;
  color:#173e5e!important;border-color:#9cbbc9!important;
  box-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-corrente.mare-kanagawa
 .letter:not(.found):not(.linked):not(.solved){
  background:#e8f1f1!important;color:#173e5e!important;
  border-color:#92b4c3!important;
}
:root:not([data-mare-contrast="high"]) body.mare-corrente.mare-kanagawa
 :is(.guesshead,.depth,.depth span,.meta){
  color:#446578!important;
}
:root:not([data-mare-contrast="high"]) body.mare-trilha.mare-kanagawa
 .trilha-grid button:not(.chosen):not([aria-pressed="true"]){
  background:#fffdf7!important;color:#173e5e!important;
  border-color:#90b1c0!important;box-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-trilha.mare-kanagawa
 .trilha-grid button.available:not(.chosen){
  background:#e8f2f1!important;
  border-color:#497d9e!important;
}
:root:not([data-mare-contrast="high"]) body.mare-trilha.mare-kanagawa
 .trilha-grid button.chosen{
  background:#315f87!important;color:#fffdf7!important;
  border-color:#173e5e!important;box-shadow:0 0 0 2px #b1d3d9!important;
}
:root:not([data-mare-contrast="high"]) body.mare-marujo.mare-kanagawa
 .marujo-cell:not(.selected):not(.found){
  background:#fffdf7!important;color:#173e5e!important;
  border:1px solid #96b6c7!important;
  box-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-marujo.mare-kanagawa
 .marujo-cell.selected{
  background:#315f87!important;color:#fffdf7!important;
  border-color:#173e5e!important;
}
:root:not([data-mare-contrast="high"]) body.mare-marujo.mare-kanagawa
 .marujo-cell.found{
  background:#2f7b66!important;color:#fffdf7!important;
  border-color:#205a4f!important;
}
:root:not([data-mare-contrast="high"]) body.mare-marujo.mare-kanagawa
 :is(.marujo-words span:not(.found),.marujo-selection){
  background:#edf5f2!important;color:#173e5e!important;
  border-color:#9cb9c5!important;
}
:root:not([data-mare-contrast="high"]) body.mare-marujo.mare-kanagawa
 .marujo-words span.found{
  background:#d8eee4!important;color:#275b4d!important;
  border-color:#76a990!important;
}
:root:not([data-mare-contrast="high"]) body.mare-forca.mare-kanagawa
 .forca-slot:not(.correct):not(.absent){
  background:#eef4f1!important;color:#173e5e!important;
  border-color:#9bb7c1!important;
}
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mare-perola,.mare-farol)
 .depth-instructions{
  background:#eff6f4!important;color:#173e5e!important;
  border:1px solid #a4bdc4!important;
}
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mare-perola,.mare-farol)
 .depth-scramble{
  background:transparent!important;color:#315f87!important;
  text-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mare-perola,.mare-farol)
 .depth-picked{
  background:#d8ebea!important;color:#173e5e!important;
  border:1px solid #709bae!important;
}
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mare-forca,.mare-criptograma)
 :is(.newgame-shell dialog,dialog){
  background:#fffdf7!important;color:#173e5e!important;
  border:1px solid #97b7c5!important;
  box-shadow:0 18px 50px rgba(25,67,95,.18)!important;
}
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mare-forca,.mare-criptograma)
 dialog :is(h2,h3,p,strong){
  color:#173e5e!important;
}
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mare-forca,.mare-criptograma)
 dialog button{
  background:#174b6a!important;color:#fffdf7!important;
  border-color:#174b6a!important;
}


/* Export preview and in-game social cards use the same engraved paper. */
:root:not([data-mare-contrast="high"]) body.mare-kanagawa
 .mare-social__canvas{
  background:#fffdf7!important;
  border:1px solid #9ab6c1!important;
  border-radius:5px!important;
  box-shadow:0 12px 26px rgba(25,58,83,.08)!important;
}
/* Idle action affordances and navigation labels stay readable as ink. */
:root:not([data-mare-contrast="high"]) body.mare-kanagawa
 :is(.mare-game-nav__link,.mare-game-nav__name,.mare-social__intro,
 .mare-social__choice label,.mare-logbook__panel strong,
 .mare-voyage__activity strong){
  color:var(--kan-ink)!important;
}
:root:not([data-mare-contrast="high"]) body.mare-kanagawa
 .mare-game-nav__link.is-active{
  background:#dcebef!important;
  border-color:#7ea8b9!important;
}


/* Details isolated by computed-style review: mission badges and Recife HUD. */
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa
 .mare-explorer__badge:not(.is-earned){
  color:#173e5e!important;
  background:#e2eef0!important;
  border:1px solid #9bb7c4!important;
  box-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-recife.mare-kanagawa
 .topbar .round{
  color:#173e5e!important;
  background:#fffdf7!important;
  border:1px solid #94b4c3!important;
  box-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-recife.mare-kanagawa
 .topbar .round:is(:hover,:focus-visible){
  background:#dcebef!important;border-color:#497c98!important;
}


/* Secondary commands should read as quiet tools, not as a row of primary
   navy CTAs. Disabled buttons keep their disabled state/opacity. */
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(button#clear,button#hint,button#share,button#undo,
 button#free,button#reset,button#reveal,button#previous,
 button#toggle,button#next,button#verify):not(.active):not([aria-pressed="true"]):not(:disabled){
  color:#173e5e!important;
  background:#e8f1f1!important;
  background-image:none!important;
  border:1px solid #91b0bf!important;
  text-shadow:none!important;
  box-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mar-app,.mare-recife)
 :is(button#clear,button#hint,button#share,button#undo,
 button#free,button#reset,button#reveal,button#previous,
 button#toggle,button#next,button#verify):not(.active):not([aria-pressed="true"]):not(:disabled):is(:hover,:focus-visible){
  background:#d7e9ed!important;border-color:#497d9c!important;
}


/* ==========================================================================
   Auditoria 2026-10 · correções de interface, consistência e motion.
   Kept at the very end of the last stylesheet so it settles the cascade
   without touching game logic. Every color rule is scoped away from the
   high-contrast preference; every animation is cancelled by the existing
   reduced-motion rules above (system setting and in-app preference).
   ========================================================================== */
:root{
  --mare-ease-out:cubic-bezier(.22,1,.36,1);
  --mare-ease-in-out:cubic-bezier(.65,0,.35,1);
  --mare-ease-spring:cubic-bezier(.34,1.5,.64,1);
  --mare-t-fast:120ms;
  --mare-t-base:200ms;
  --mare-t-slow:340ms;
  --mare-col:880px;
}
body.mare-recife{--mare-col:808px}
body:is(.mare-abismo,.mare-cardume,.mare-corrente){--mare-col:920px}
body:is(.mare-concha,.mare-trilha,.mare-enigma,.mare-marujo){--mare-col:1066px}
body:is(.mare-perola,.mare-farol){--mare-col:960px}
body:is(.mare-forca,.mare-criptograma){--mare-col:1040px}

/* --- Fixes ---------------------------------------------------------------- */

/* The hidden skip link leaked its shadow into the top-left corner. */
body.mare-kanagawa > a.mare-skip-link:not(:focus):not(:focus-visible){
  box-shadow:none!important;opacity:0!important;pointer-events:none;
}

/* Hub: four catalog titles kept a legacy near-white ink from the dark theme
   and were invisible on paper cards (Cardume, Corrente, Náufrago, Sinais). */
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa
 .mar-catalog>article.mar-game>h2.recife-card-heading{
  color:var(--kan-deep)!important;-webkit-text-fill-color:currentColor!important;text-shadow:none!important;
}
/* One title voice for all twelve cards (four still used the old sans). */
:root:not(.mare-no-match) body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game>h2.recife-card-heading{
  font-family:var(--kan-serif)!important;font-weight:700!important;
  font-size:clamp(1.9rem,1.35rem + 1.1vw,2.25rem)!important;letter-spacing:-.025em!important;line-height:1.05!important;
}
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa
 .mar-catalog>article.mar-game :is(.mar-game-info>p,.mare-card-meta){
  color:var(--kan-secondary)!important;text-shadow:none!important;
}
/* Offline status was mint-on-cream (≈1.4:1). */
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa .mare-pwa__status{color:var(--kan-secondary)!important}
:root:not([data-mare-contrast="high"]) body.mare-hub.mare-kanagawa .mare-pwa__status::before{background:#2f8a73!important;box-shadow:0 0 0 3px rgba(47,138,115,.16)!important}

/* Abismo: the dark legacy sea sat behind dark Kanagawa ink, so the title,
   eyebrow and intro were unreadable. The page now shares the paper backdrop. */
:root:not([data-mare-contrast="high"]) body.mare-abismo.mare-kanagawa .ocean{
  background:none!important;
}

/* Recife: active mode caption was dark-on-dark. */
:root:not([data-mare-contrast="high"]) body.mare-kanagawa .mare-modes button:is(.active,[aria-pressed="true"]) small{
  color:rgba(255,253,247,.86)!important;
}
/* Recife: the progress rail now reflects real progress instead of a fixed
   three-colour decoration (it looked a third complete at 0 guesses). */
body.mare-kanagawa.mare-recife .mare-progress::after{
  background:
    linear-gradient(90deg,#2f8a73 0 calc(var(--mare-solved,0)*100%),transparent 0) top/100% 100% no-repeat,
    linear-gradient(90deg,#7fa8bf 0 calc(var(--mare-used,0)*100%),#dce8ea 0)!important;
  box-shadow:none!important;height:6px!important;
  transition:background-size var(--mare-t-slow) var(--mare-ease-out);
}
/* Recife keys: icon on phones, word on wider screens; never clipped. */
body.mare-recife .key .key-icon{display:none;font-size:1.25em;line-height:1}
body.mare-recife .key .key-text{font-size:.78em;letter-spacing:.04em;text-transform:uppercase}
@media(max-width:520px){
  body.mare-recife .key .key-icon{display:inline}
  body.mare-recife .key .key-text{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}

/* Results card sits under game dialogs instead of stacking on top of them. */
body.mare-kanagawa .mare-finale{z-index:9!important}

/* Wave engraving: the opaque cream veil painted a hard-edged paper rectangle
   behind each game column (visible seam against the page sky on desktop).
   The engraving is now a soft, faded ornament with no box of its own. */
body.mare-kanagawa:is(.mar-app,.mare-recife) :is(.depth-shell,.newgame-shell,.shell,.wrap){
  background-image:none!important;isolation:isolate;
}
body.mare-kanagawa:is(.mar-app,.mare-recife) :is(.depth-shell,.newgame-shell,.shell,.wrap)::before{
  content:"";position:absolute;z-index:-1;top:0;right:0;
  width:min(560px,80vw);aspect-ratio:1.35;pointer-events:none;
  background:url('../assets/backgrounds/kanagawa-wave.svg') no-repeat right top/contain;
  opacity:.09;
  /* The engraving carries its own paper rectangle: a radial vignette
     dissolves every edge so no box outline survives. */
  -webkit-mask-image:radial-gradient(ellipse 62% 58% at 62% 42%,#000 30%,transparent 78%);
          mask-image:radial-gradient(ellipse 62% 58% at 62% 42%,#000 30%,transparent 78%);
}
:root:is([data-mare-focus="on"],[data-mare-contrast="high"]) body.mare-kanagawa
 :is(.depth-shell,.newgame-shell,.shell,.wrap)::before{display:none}

/* Shared blocks under each game share the game's column width. */
@media(min-width:700px){
  body.mare-kanagawa:is(.mar-app,.mare-recife) > :is(.mare-social,.mare-access){
    width:min(calc(100% - 48px),var(--mare-col))!important;max-width:none!important;
    margin-left:auto!important;margin-right:auto!important;box-sizing:border-box;
  }
}

/* Unavailable actions read as unavailable — not as a filled grey primary. */
:root:not([data-mare-contrast="high"]) body.mare-kanagawa:is(.mar-app,.mare-recife)
 button:disabled:not(:is(.forca-keyboard,.keyboard,#grid,#board,.trilha-grid,#cipher,#wheel,.concha-wheel,.mare-modes) button){
  background:transparent!important;background-image:none!important;
  color:#5d7888!important;border:1px dashed #a3bccb!important;
  box-shadow:none!important;opacity:1!important;cursor:not-allowed;
}

/* Hub navigation on phones: one calm scrollable row, no 3-line wrapping. */
@media(max-width:620px){
  body.mare-hub.mare-kanagawa .mar-top{flex-wrap:wrap!important;row-gap:6px!important}
  body.mare-hub.mare-kanagawa .mar-top nav{
    order:3;flex:1 0 100%;display:flex!important;gap:4px!important;
    overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
    margin:0 -4px;padding:2px 4px 4px;
  }
  body.mare-hub.mare-kanagawa .mar-top nav::-webkit-scrollbar{display:none}
  body.mare-hub.mare-kanagawa .mar-top nav a{
    white-space:nowrap;flex:none;padding:10px 12px!important;min-height:44px;
    display:inline-flex!important;align-items:center;border-radius:999px;
  }
  body.mare-hub.mare-kanagawa .mar-top nav a:first-child{padding-left:4px!important}
}

/* Sinais: words never split across lines; numbers readable on paper. */
.crypto-word{display:inline-flex;flex-wrap:nowrap;gap:inherit;column-gap:3px}
:root:not([data-mare-contrast="high"]) body.mare-kanagawa .crypto-tile .crypto-number{color:#4d6b7d!important;font-weight:700}

/* Curadoria (free-play intensity): compact disclosure below the board. */
body.mare-kanagawa .mare-content-control{
  display:block!important;box-sizing:border-box;width:auto;margin:18px 0!important;padding:0!important;
  background:var(--kan-white)!important;color:var(--kan-ink)!important;
  border:1px solid var(--kan-line)!important;border-radius:16px!important;box-shadow:none!important;
}
body.mare-kanagawa:is(.mar-app,.mare-recife) > .mare-content-region{width:min(calc(100% - 28px),var(--mare-col));margin:0 auto}
body.mare-kanagawa .mare-content-control__summary{
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  min-height:52px;padding:12px 18px;cursor:pointer;list-style:none;border-radius:15px;
  transition:background-color var(--mare-t-base) var(--mare-ease-out);
}
body.mare-kanagawa .mare-content-control__summary::-webkit-details-marker{display:none}
body.mare-kanagawa .mare-content-control__summary:hover{background:var(--kan-mist)}
body.mare-kanagawa .mare-content-control__summary strong{
  color:var(--kan-blue)!important;font:800 11px/1.4 var(--kan-sans)!important;letter-spacing:.14em;text-transform:uppercase;
}
body.mare-kanagawa .mare-content-control__current{
  display:inline-flex;align-items:center;gap:10px;color:var(--kan-secondary);font:600 13px/1.3 var(--kan-sans);
}
body.mare-kanagawa .mare-content-control__current::after{
  content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:translateY(-2px) rotate(45deg);transition:transform var(--mare-t-base) var(--mare-ease-out);
}
body.mare-kanagawa .mare-content-control[open] .mare-content-control__current::after{transform:translateY(2px) rotate(-135deg)}
body.mare-kanagawa .mare-content-control__body{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;
  padding:4px 18px 16px;border-top:1px solid var(--kan-line);padding-top:14px;
}
body.mare-kanagawa .mare-content-control__body p{margin:0!important;max-width:52ch;color:var(--kan-secondary)!important;font:500 13px/1.55 var(--kan-sans)!important}
body.mare-kanagawa .mare-content-control label{color:var(--kan-ink)!important;font:700 13px/1.3 var(--kan-sans)!important}
body.mare-kanagawa .mare-content-control__actions > button{
  background:var(--kan-indigo)!important;color:var(--kan-white)!important;border:1px solid var(--kan-indigo)!important;
}
body.mare-kanagawa .mare-content-control__actions > button:is(:hover,:focus-visible){background:var(--kan-deep)!important;color:var(--kan-white)!important}
body.mare-kanagawa .mare-content-control__status{color:var(--kan-secondary)!important;max-width:32ch}
@media(prefers-reduced-motion:no-preference){
  body.mare-kanagawa .mare-content-control[open] .mare-content-control__body{animation:mare-unfold var(--mare-t-slow) var(--mare-ease-out)}
}
:root[data-mare-contrast="high"] body.mare-kanagawa .mare-content-control{background:#061925!important;border-color:#b0ebdf!important}
:root[data-mare-contrast="high"] body.mare-kanagawa .mare-content-control :is(strong,span,p,label){color:#fff!important}

/* Recife on phones: board AND keyboard fit one screen (390×844 and up). */
@media(max-width:650px){
  body.mare-kanagawa.mare-recife .topbar{height:58px!important}
  body.mare-kanagawa.mare-recife .return-link{
    display:flex!important;align-items:center;justify-content:space-between;gap:10px;
    margin:10px 4px 8px!important;padding:0!important;min-height:0!important;
  }
  body.mare-kanagawa.mare-recife .return-link>a{padding:8px 12px!important;min-height:40px;font-size:13px!important}
  body.mare-kanagawa.mare-recife .return-link .mare-game-symbol-lockup{gap:8px!important;margin:0!important}
  body.mare-kanagawa.mare-recife .return-link .mare-game-symbol-lockup img{width:34px!important;height:34px!important}
  body.mare-kanagawa.mare-recife .recife-title-lockup{font-size:24px!important;margin:0!important}
  body.mare-kanagawa.mare-recife .game{padding-top:12px!important}
  body.mare-kanagawa.mare-recife .mare-modes{margin-bottom:8px!important}
  body.mare-kanagawa.mare-recife .mare-modes button{min-height:44px!important;padding:6px 4px!important}
  body.mare-kanagawa.mare-recife .gameheading{margin-bottom:6px!important}
  body.mare-kanagawa.mare-recife .gameheading>p{display:none!important}
  body.mare-kanagawa.mare-recife .gameheading h2{font-size:19px!important;margin:2px 0!important}
  body.mare-kanagawa.mare-recife .mare-legend{margin:6px 0 8px!important}
  body.mare-kanagawa.mare-recife .game[data-mode=solo] .mare-boards{
    width:min(100%,calc((100svh - 528px) * .86),330px)!important;min-width:236px;
  }
  body.mare-kanagawa.mare-recife .status{min-height:20px!important;margin:6px 0!important}
  body.mare-kanagawa.mare-recife .keyboard{margin-top:6px!important}
  body.mare-kanagawa.mare-recife .key{height:48px!important}
  body.mare-kanagawa.mare-recife .bottomnote{display:none!important}
}

/* Náufrago: the wreck illustration no longer pushes the keyboard off-screen. */
@media(max-width:650px){
  body.mare-kanagawa.mare-forca .forca-illustration{max-height:150px!important;height:auto!important}
}

/* Landmark wrappers added around game titles must not change layout. */
body.mare-kanagawa .return-link[role="region"]{outline:none}

/* --- Motion --------------------------------------------------------------- */

@keyframes mare-pop{0%{transform:scale(.84)}55%{transform:scale(1.08)}100%{transform:scale(1)}}
@keyframes mare-flip{0%{transform:perspective(380px) rotateX(0)}50%{transform:perspective(380px) rotateX(-90deg)}100%{transform:perspective(380px) rotateX(0)}}
@keyframes mare-rise{0%{transform:translateY(0)}35%{transform:translateY(-16px)}62%{transform:translateY(3px)}82%{transform:translateY(-3px)}100%{transform:translateY(0)}}
@keyframes mare-shake{0%,100%{transform:translateX(0)}15%{transform:translateX(-7px)}30%{transform:translateX(6px)}45%{transform:translateX(-5px)}60%{transform:translateX(4px)}75%{transform:translateX(-2px)}}
@keyframes mare-settle{0%{transform:scale(.9)}60%{transform:scale(1.05)}100%{transform:scale(1)}}
@keyframes mare-surface{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
@keyframes mare-unfold{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes mare-fade{from{opacity:0}to{opacity:1}}
@keyframes mare-dialog-in{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
@keyframes mare-glint{0%{box-shadow:0 0 0 0 rgba(47,138,115,.45)}100%{box-shadow:0 0 0 10px rgba(47,138,115,0)}}

@media(prefers-reduced-motion:no-preference){
  /* Tactile feedback on every pressable control. */
  body.mare-kanagawa :is(button,.mar-cta,.mare-game-nav__link,.mare-studio-hero__actions a,.back,.return-link>a){
    transition:
      background-color var(--mare-t-base) var(--mare-ease-out),
      border-color var(--mare-t-base) var(--mare-ease-out),
      color var(--mare-t-base) var(--mare-ease-out),
      box-shadow var(--mare-t-base) var(--mare-ease-out),
      transform var(--mare-t-fast) var(--mare-ease-out);
  }
  body.mare-kanagawa :is(button,.mar-cta,.mare-game-nav__link,.mare-studio-hero__actions a):not(:disabled):active{
    transform:scale(.965);transition-duration:60ms;
  }
  @media(hover:hover){
    body.mare-kanagawa .mare-game-nav__link:hover{transform:translateY(-2px)}
    body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game{
      transition:box-shadow var(--mare-t-slow) var(--mare-ease-out),border-color var(--mare-t-slow) var(--mare-ease-out),transform var(--mare-t-slow) var(--mare-ease-out);
    }
    body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game:hover{
      transform:translateY(-4px);box-shadow:0 22px 46px rgba(35,69,92,.14)!important;
    }
    body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game .mar-game-symbol{transition:transform .6s var(--mare-ease-out)}
    body.mare-hub.mare-kanagawa .mar-catalog>article.mar-game:hover .mar-game-symbol{transform:translateY(-3px) rotate(-4deg)}
  }

  /* Recife: type → pop, submit → flip in sequence, invalid → shake,
     win → the solved row rises like a wave crest. */
  body.mare-recife .tile.is-popping{animation:mare-pop 150ms var(--mare-ease-out)}
  body.mare-recife .tile.is-revealing{
    animation:mare-flip 360ms var(--mare-ease-in-out) calc(var(--i,0) * 110ms) both;
    backface-visibility:hidden;
  }
  body.mare-recife .mare-row.is-invalid{animation:mare-shake 420ms var(--mare-ease-out)}
  body.mare-recife .mare-row.is-winning .tile.is-revealing{
    animation:
      mare-flip 360ms var(--mare-ease-in-out) calc(var(--i,0) * 110ms) both,
      mare-rise 560ms var(--mare-ease-out) calc(860ms + var(--i,0) * 85ms);
  }
  body.mare-recife .key.is-settling{animation:mare-settle 260ms var(--mare-ease-spring)}
  body.mare-recife .mare-progress::after{transition:background 400ms var(--mare-ease-out)}

  /* Cardume: wrong set shakes in place; a found school surfaces. */
  body.mare-cardume #grid .tile.is-wrong{animation:mare-shake 420ms var(--mare-ease-out)}
  body.mare-cardume #grid .tile[aria-pressed="true"]{transform:translateY(-2px)}
  body.mare-cardume #solved .solution.is-new{animation:mare-surface 460ms var(--mare-ease-out) both}

  /* Marujo: live trace while dragging, found word glints letter by letter. */
  body.mare-marujo #board .marujo-cell.is-found-now{animation:mare-settle 320ms var(--mare-ease-spring) calc(var(--i,0) * 45ms) both}

  /* Dialogs and the results card arrive instead of blinking in. */
  body.mare-kanagawa dialog[open]{animation:mare-dialog-in 280ms var(--mare-ease-out)}
  body.mare-kanagawa dialog[open]::backdrop{animation:mare-fade 240ms ease-out}
  body.mare-kanagawa .modalwrap.open{animation:mare-fade 200ms ease-out}
  body.mare-kanagawa .modalwrap.open .modal{animation:mare-dialog-in 300ms var(--mare-ease-out)}
  body.mare-kanagawa .mare-finale:not([hidden]){animation:mare-dialog-in 380ms var(--mare-ease-out)!important}
  body.mare-kanagawa .mare-finale.mare-finale-win .mare-finale__symbol{animation:mare-glint 1.4s ease-out 2}

  /* Selected/active tiles across puzzles ease between states. */
  body.mare-kanagawa :is(.trilha-grid button,.marujo-cell,.crypto-tile,.enigma-cell,.concha-wheel button,.forca-keyboard button,.key){
    transition:background-color 180ms var(--mare-ease-out),border-color 180ms var(--mare-ease-out),color 180ms var(--mare-ease-out),transform 120ms var(--mare-ease-out),box-shadow 180ms var(--mare-ease-out);
  }
}
/* Trace is a state, not decoration: also shown with reduced motion. */
:root:not([data-mare-contrast="high"]) body.mare-marujo #board .marujo-cell.is-tracing{
  background:#d4e6ee!important;border-color:var(--kan-blue)!important;color:var(--kan-deep)!important;
  box-shadow:inset 0 0 0 2px rgba(49,95,135,.35)!important;
}
body.mare-marujo #board{touch-action:none}

/* Recife solo: one board needs no "SONDA 01" caption nor a focus frame. */
:root:not([data-mare-contrast="high"]) body.mare-recife.mare-kanagawa .game[data-mode=solo] .mare-pane{
  background:transparent!important;outline:0!important;border:0!important;padding:0!important;
}
body.mare-recife.mare-kanagawa .game[data-mode=solo] .mare-pane-head{display:none!important}
:root:not([data-mare-contrast="high"]) body.mare-recife.mare-kanagawa .mare-pane-head{background:transparent!important}

/* Pérola / Farol: the answer field is a full-width row with its label above. */
body.mare-kanagawa .depth-panel label[for="entry"]{display:block;margin:20px 0 8px!important}
body.mare-kanagawa .depth-panel .depth-entry{display:block;width:100%!important;max-width:520px;box-sizing:border-box;min-height:48px}

/* Recife on laptop screens (≤1000px tall): keep the virtual keyboard in view. */
@media(min-width:651px) and (max-height:1000px){
  body.mare-kanagawa.mare-recife .return-link{margin-top:6px!important;margin-bottom:10px!important;padding:0!important}
  body.mare-kanagawa.mare-recife .return-link .mare-game-symbol-lockup img{width:52px!important;height:52px!important}
  body.mare-kanagawa.mare-recife .gameheading>p{display:none!important}
  body.mare-kanagawa.mare-recife .game[data-mode=solo] .mare-boards{
    width:min(100%,326px,max(250px,calc((100vh - 600px) * .86)))!important;
  }
  body.mare-kanagawa.mare-recife .bottomnote{margin-top:6px!important}
}
@media(min-width:651px){
  body.mare-kanagawa.mare-forca .forca-illustration{max-height:210px!important;height:auto!important}
}

/* Close buttons kept a legacy dark fill under dark ink (≈1.3:1). */
:root:not([data-mare-contrast="high"]) body.mare-kanagawa :is(.modal .close,#close,.mare-finale__close){
  background:var(--kan-white)!important;color:var(--kan-deep)!important;
  border:1px solid var(--kan-line)!important;box-shadow:none!important;
}
:root:not([data-mare-contrast="high"]) body.mare-kanagawa :is(.modal .close,#close,.mare-finale__close):is(:hover,:focus-visible){
  background:var(--kan-mist)!important;border-color:#4a7e99!important;
}

/* Cardume loads its boards asynchronously: reserve the 4×4 grid's footprint
   so the controls below don't jump when the tiles arrive (CLS). */
body.mare-cardume #grid:empty{min-height:292px}
@media(min-width:700px){body.mare-cardume #grid:empty{min-height:351px}}