/* WLINGO — design system intercambiável, versão 1.
   Estilo (editorial, minimal, tech, warm) e modo (claro, escuro ou sistema)
   são independentes. Todos os componentes usam tokens, não cores por usuário.
 */
body[data-ui-style]{
 --font-display:Arial,Helvetica,sans-serif;
 --font-body:Inter,system-ui,-apple-system,'Segoe UI',sans-serif;
 --font-mono:ui-monospace,SFMono-Regular,Consolas,monospace;
 --card-padding:22px;
 --section-spacing:38px;
 --button-spacing:15px;
 --ui-ease:cubic-bezier(.2,.8,.2,1);
 --ui-duration:180ms;
 --constellation-strong:rgba(255,122,65,.54);
 --constellation-soft:rgba(255,162,116,.18);
 --constellation-accent:#ff9568;
 --constellation-text:#fff8ec;
 --constellation-surface:#1c1714;
 --display:var(--font-display);
 --body:var(--font-body);
 font-family:var(--font-body);
 transition:background-color var(--ui-duration) var(--ui-ease),color var(--ui-duration) var(--ui-ease);
}
/* EDITORIAL: impacto moderado, alto contraste e acento laranja. */
body[data-ui-style="editorial"][data-ui-resolved="light"]{
 --paper:#f5f0e8;--surface:#fffaf3;--surface-2:#ece5d9;--ink:#24201b;--muted:#655a50;--line:#d8cabb;
 --orange:#ee6134;--orange-strong:#c8491d;--coral:#f99b79;--green:#286b4c;
 --green-soft:#dbefe4;--blue:#416ca8;--yellow:#eac451;
 --shadow:0 12px 30px rgba(43,31,18,.08);--radius:20px;--radius-sm:12px;--focus:#1559c0;
}
body[data-ui-style="editorial"][data-ui-resolved="dark"]{
 --paper:#1b1715;--surface:#29231f;--surface-2:#352d28;--ink:#fff7ec;--muted:#ccb9a9;--line:#55463e;
 --orange:#ff7848;--orange-strong:#ff996d;--coral:#ffa98e;--green:#7ed4a3;
 --green-soft:#263c30;--blue:#a0bfff;--yellow:#f7d56d;
 --shadow:0 15px 36px rgba(0,0,0,.23);--radius:20px;--radius-sm:12px;--focus:#a3bcff;
}
/* MINIMAL: branco limpo, verde profundo, contornos sutis. */
body[data-ui-style="minimal"][data-ui-resolved="light"]{
 --paper:#f7faf8;--surface:#fff;--surface-2:#eaf1ed;--ink:#172d27;--muted:#50685e;--line:#c8dcd1;
 --orange:#236f60;--orange-strong:#185848;--coral:#5da38a;--green:#216c50;
 --green-soft:#e2f1e9;--blue:#2a6a80;--yellow:#e1c65e;
 --shadow:0 4px 16px rgba(22,56,39,.045);--radius:13px;--radius-sm:9px;--focus:#15637e;
 --font-display:system-ui,-apple-system,'Segoe UI',sans-serif;
 --constellation-strong:rgba(70,177,145,.55);--constellation-soft:rgba(67,135,119,.22);
 --constellation-accent:#a8ead3;--constellation-text:#f5fff9;--constellation-surface:#162a24;
}
body[data-ui-style="minimal"][data-ui-resolved="dark"]{
 --paper:#101c19;--surface:#1b2b25;--surface-2:#25382f;--ink:#f5fff9;--muted:#bfd3c7;--line:#3c584a;
 --orange:#8de1c0;--orange-strong:#aceed5;--coral:#84c8af;--green:#80d5a4;
 --green-soft:#294839;--blue:#9ad6e8;--yellow:#e2d391;
 --shadow:0 8px 24px rgba(0,0,0,.2);--radius:13px;--radius-sm:9px;--focus:#8bd3e9;
 --constellation-strong:rgba(109,234,187,.55);--constellation-soft:rgba(90,188,151,.22);
 --constellation-accent:#a8ead3;--constellation-text:#f5fff9;--constellation-surface:#142822;
}
/* TECH: azul noturno, ciano elétrico, contornos precisos. */
body[data-ui-style="tech"][data-ui-resolved="light"]{
 --paper:#edf5fa;--surface:#faffff;--surface-2:#dcebf4;--ink:#15283d;--muted:#49657b;--line:#bfd4e4;
 --orange:#087eab;--orange-strong:#07688d;--coral:#4fb0cf;--green:#177957;
 --green-soft:#d8f0e3;--blue:#3159a8;--yellow:#d8b84c;
 --shadow:0 12px 26px rgba(17,65,98,.08);--radius:14px;--radius-sm:8px;--focus:#0b65c4;
 --font-display:system-ui,-apple-system,'Segoe UI',sans-serif;
 --constellation-strong:rgba(51,219,255,.62);--constellation-soft:rgba(85,155,218,.24);
 --constellation-accent:#62dfff;--constellation-text:#f1fcff;--constellation-surface:#0e2035;
}
body[data-ui-style="tech"][data-ui-resolved="dark"]{
 --paper:#0c1424;--surface:#14233a;--surface-2:#1c3049;--ink:#eefaff;--muted:#b6cde1;--line:#31475e;
 --orange:#56d9fa;--orange-strong:#85e7ff;--coral:#7adffc;--green:#7ad8b5;
 --green-soft:#1d403e;--blue:#9fbaff;--yellow:#f2d88f;
 --shadow:0 15px 33px rgba(0,0,0,.27);--radius:14px;--radius-sm:8px;--focus:#92e9ff;
 --font-display:system-ui,-apple-system,'Segoe UI',sans-serif;
 --constellation-strong:rgba(51,219,255,.62);--constellation-soft:rgba(85,155,218,.24);
 --constellation-accent:#62dfff;--constellation-text:#f1fcff;--constellation-surface:#0b1b2e;
}
/* WARM: papel claro, cobre, caráter artesanal confortável. */
body[data-ui-style="warm"][data-ui-resolved="light"]{
 --paper:#f8f0e1;--surface:#fffaf0;--surface-2:#efe1cd;--ink:#3e3024;--muted:#796555;--line:#dfcdb6;
 --orange:#bc6938;--orange-strong:#a04f24;--coral:#d89868;--green:#497454;
 --green-soft:#e0eedf;--blue:#5477a1;--yellow:#dfb959;
 --shadow:0 12px 29px rgba(99,60,34,.09);--radius:25px;--radius-sm:16px;--focus:#335dba;
 --font-display:Georgia,'Times New Roman',serif;
 --constellation-strong:rgba(232,164,105,.6);--constellation-soft:rgba(202,148,112,.21);
 --constellation-accent:#efba83;--constellation-text:#fff9ed;--constellation-surface:#34251c;
}
body[data-ui-style="warm"][data-ui-resolved="dark"]{
 --paper:#241c17;--surface:#322720;--surface-2:#433229;--ink:#fff5e7;--muted:#d7bfaa;--line:#665041;
 --orange:#f0ac76;--orange-strong:#ffc394;--coral:#f3af8c;--green:#8bd3a4;
 --green-soft:#2f4736;--blue:#bdceff;--yellow:#f0d088;
 --shadow:0 15px 30px rgba(0,0,0,.23);--radius:25px;--radius-sm:16px;--focus:#bad1ff;
 --font-display:Georgia,'Times New Roman',serif;
 --constellation-strong:rgba(232,164,105,.6);--constellation-soft:rgba(202,148,112,.21);
 --constellation-accent:#efba83;--constellation-text:#fff9ed;--constellation-surface:#34251c;
}
/* Design tokens de densidade. Os grids se adaptam; funcionalidade não é alterada. */
body[data-ui-density="compact"]{--card-padding:15px;--section-spacing:24px;--button-spacing:10px}
body[data-ui-density="spacious"]{--card-padding:30px;--section-spacing:54px;--button-spacing:20px}
body[data-ui-style] .section{padding-block:var(--section-spacing)}
body[data-ui-style] .card{padding:var(--card-padding)}
body[data-ui-style] .extra-card{padding:var(--card-padding);min-height:calc(170px + var(--card-padding))}
body[data-ui-style] .btn{padding-inline:var(--button-spacing)}
body[data-ui-style] .hero-title{font-family:var(--font-display);font-weight:850;letter-spacing:-.047em;line-height:1.13}
body[data-ui-style="warm"] h1,body[data-ui-style="warm"] h2{letter-spacing:-.036em;font-weight:750}
body[data-ui-style] .constellation-wrap{background:radial-gradient(ellipse at center,color-mix(in srgb,var(--constellation-accent),transparent 86%),transparent 62%),var(--constellation-surface)}
body[data-ui-style] .constellation-wrap .constellation-caption{color:var(--constellation-text)}
body[data-ui-style] .extra-card{transition:transform var(--ui-duration) var(--ui-ease),box-shadow var(--ui-duration) var(--ui-ease),border-color var(--ui-duration) var(--ui-ease)}
body[data-ui-style="minimal"] .extra-card{border-top-width:1px}
body[data-ui-style="tech"] .extra-card{border-top-width:2px}
body[data-ui-style="warm"] .extra-card{border-top-width:2px}
body[data-ui-style] .top .navbtn:focus-visible,body[data-ui-style] button:focus-visible,body[data-ui-style] select:focus-visible,body[data-ui-style] input:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
/* Painel de aparência independente da página de matrícula. */
.appearance-page .section-head{align-items:flex-start;gap:20px}
.appearance-page h1{font-size:clamp(34px,4.7vw,58px)}
.appearance-page h2{font-size:clamp(22px,2.5vw,34px);margin-top:0}
.appearance-panels{display:grid;grid-template-columns:minmax(240px,.75fr) minmax(0,1.25fr);gap:18px;align-items:start}
.appearance-prefs .field{display:block;margin-bottom:19px}
.appearance-prefs select{width:100%;max-width:100%}
.theme-catalog{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}
.theme-sample{display:flex;flex-direction:column;gap:5px;padding:12px;border:2px solid var(--line);border-radius:var(--radius-sm);cursor:pointer;background:var(--surface-2);min-width:0;transition:background-color .18s,border-color .18s,transform .18s}
.theme-sample:hover{transform:translateY(-2px)}
.theme-sample:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}
.theme-sample.is-selected,.theme-sample:has(input:checked){border-color:var(--orange);box-shadow:0 0 0 1px var(--orange)}
.theme-sample input{align-self:flex-end;width:19px;height:19px;margin:0;accent-color:var(--orange)}
.theme-sample-visual{position:relative;display:block;height:95px;overflow:hidden;background:var(--sample-bg);border-radius:10px;padding:14px}
.theme-sample-visual i{position:absolute;bottom:15px;height:26px;width:20%;background:var(--sample-accent);border-radius:5px}
.theme-sample-visual i:nth-child(1){left:12px;opacity:.85}
.theme-sample-visual i:nth-child(2){left:35%;height:45px;opacity:.65}
.theme-sample-visual i:nth-child(3){left:64%;height:33px;opacity:.4}
.theme-sample-visual b{position:absolute;top:9px;left:12px;font-size:19px;line-height:1;color:#fff;mix-blend-mode:difference}
.theme-sample-visual b span{color:var(--sample-accent)}
.theme-sample strong{font-size:17px}
.theme-sample small{color:var(--muted);line-height:1.45}
/* Reduce/off moves: do not override a user's reduced-motion OS setting. */
body[data-ui-motion="reduced"] *,body[data-ui-motion="reduced"] *::before,body[data-ui-motion="reduced"] *::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
body[data-ui-motion="off"] *,body[data-ui-motion="off"] *::before,body[data-ui-motion="off"] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
@media(prefers-reduced-motion:reduce){.theme-sample{transition:none!important}}
@media(max-width:760px){.top nav .quiet[data-view="appearance"]{display:none}.appearance-panels{grid-template-columns:1fr}.theme-catalog{gap:9px}.appearance-page .section-head{flex-direction:column}.theme-sample-visual{height:86px}}
@media(max-width:370px){.theme-catalog{grid-template-columns:1fr}.theme-sample-visual{height:74px}}

/* Contraste explícito nas combinações de acento médio com botões cheios. */
body[data-ui-style="minimal"][data-ui-resolved="light"] .btn:not(.outline),
body[data-ui-style="tech"][data-ui-resolved="light"] .btn:not(.outline),
body[data-ui-style="warm"][data-ui-resolved="light"] .btn:not(.outline){color:#fff}
/* Limite de largura para títulos e áreas de formulário, sem texto sobreposto. */
body[data-ui-style] .hero-copy{min-width:0}
body[data-ui-style] .appearance-page *,body[data-ui-style] .hero-copy *{overflow-wrap:anywhere}
body[data-ui-style] .appearance-page .theme-catalog{min-width:0}

/* O herói precisa manter contexto e ações visíveis em telas estreitas. */
@media(max-width:760px){
 body[data-ui-style] .hero-title{font-size:clamp(42px,12vw,56px);line-height:1.02;letter-spacing:-.055em}
 body[data-ui-style] .hero-greeting{font-size:16px;margin-bottom:8px}
 body[data-ui-style] .hero-subtitle{font-size:17px;line-height:1.45}
 body[data-ui-style] .constellation-caption{left:16px;right:16px;bottom:15px;max-width:none;margin:0;padding:7px 9px;border-radius:9px;background:color-mix(in srgb,var(--constellation-surface) 82%,transparent);backdrop-filter:blur(3px);z-index:1}
}
@media(max-width:390px){body[data-ui-style] .hero-title{font-size:44px}}