@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

/* ============================================================
   Ambientes de Estudo — 3 temas × 2 modos (dia/noite) = 6 combos
   data-theme = moderno | vikings | aurora
   data-mode   = day | night
   ============================================================ */

/* ── Moderno (padrão) — Noite ── */
:root,
:root[data-theme="moderno"]:not([data-mode="day"]) {
  color-scheme: dark;
  --color-primary: #c9923e;
  --color-primary-dark: #efbd66;
  --color-accent: #d6a85f;
  --color-warm: #c9923e;
  --color-purple: #b695d6;
  --text-primary: #f5f1e9;
  --text-secondary: #aaa69f;
  --text-light: #ffffff;
  --bg-primary: #0b0b0d;
  --bg-secondary: #141416;
  --card-bg: rgba(14,16,18,.74);
  --card-hover: rgba(201,146,62,.075);
  --border-light: rgba(214,168,95,.16);
  --shadow: 0 24px 70px rgba(0,0,0,.4);
  --overlay-tint: 9,9,11;
  --xp-gold: #d6a85f;
  --success: #7fb99a;
  --error: #c9786d;
  --level-a1: #7fb99a;
  --level-a2: #6f9bd1;
  --level-b1: #9c93c9;
  --level-b2: #a3a3ab;
  --level-c1: #c9a1c4;
  --level-c2: #a5a5ad;
  --particle-color: rgba(214,168,95,.2);
  --aurora-1: transparent;
  --aurora-2: transparent;
}
/* ── Moderno — Dia ── */
:root[data-theme="moderno"][data-mode="day"] {
  color-scheme: light;
  --color-primary: #4a7ab5;
  --color-primary-dark: #3a6295;
  --color-accent: #5c9a74;
  --color-warm: #4a7ab5;
  --color-purple: #7b6fb0;
  --text-primary: #1a1d2e;
  --text-secondary: #555a6e;
  --text-light: #ffffff;
  --bg-primary: #eef2f8;
  --bg-secondary: #e2e7f0;
  --card-bg: rgba(255,255,255,.75);
  --card-hover: rgba(74,122,181,.08);
  --border-light: rgba(74,122,181,.18);
  --shadow: 0 12px 40px rgba(0,0,0,.08);
  --overlay-tint: 238,242,248;
  --xp-gold: #4a7ab5;
  --success: #5c9a74;
  --error: #c96d62;
  --particle-color: rgba(74,122,181,.15);
  --aurora-1: transparent;
  --aurora-2: transparent;
}

/* ── Vikings — Noite ── */
:root[data-theme="vikings"]:not([data-mode="day"]) {
  color-scheme: dark;
  --color-primary: #b8874a;
  --color-primary-dark: #e0b578;
  --color-accent: #6f8f6a;
  --color-warm: #b8874a;
  --color-purple: #8799b2;
  --text-primary: #f0e6d2;
  --text-secondary: #d0c1a7;
  --text-light: #f7f3eb;
  --bg-primary: #0e0c09;
  --bg-secondary: #17130e;
  --card-bg: rgba(29,23,15,.76);
  --card-hover: rgba(184,135,74,.12);
  --border-light: rgba(184,135,74,.18);
  --shadow: 0 24px 70px rgba(0,0,0,.5);
  --overlay-tint: 14,11,7;
  --xp-gold: #b8874a;
  --success: #6f8f6a;
  --error: #c9786d;
  --level-a1: #6f8f6a;
  --level-a2: #7d8fa8;
  --level-b1: #b8874a;
  --level-b2: #a68f78;
  --level-c1: #bd806e;
  --level-c2: #a5a5ad;
  --particle-color: rgba(184,135,74,.18);
  --aurora-1: transparent;
  --aurora-2: transparent;
}
/* ── Vikings — Dia ── */
:root[data-theme="vikings"][data-mode="day"] {
  color-scheme: light;
  --color-primary: #9a6e35;
  --color-primary-dark: #7a5530;
  --color-accent: #5a7a56;
  --color-warm: #9a6e35;
  --color-purple: #6e7e99;
  --text-primary: #2a2018;
  --text-secondary: #6b5d4a;
  --text-light: #ffffff;
  --bg-primary: #f7f2e8;
  --bg-secondary: #ede4d4;
  --card-bg: rgba(255,255,255,.7);
  --card-hover: rgba(154,110,53,.08);
  --border-light: rgba(154,110,53,.2);
  --shadow: 0 12px 40px rgba(0,0,0,.1);
  --overlay-tint: 247,242,232;
  --xp-gold: #9a6e35;
  --success: #5a7a56;
  --error: #b85d52;
  --particle-color: rgba(154,110,53,.12);
  --aurora-1: transparent;
  --aurora-2: transparent;
}

/* ── Aurora — Dia ── */
:root[data-theme="aurora"]:not([data-mode="night"]) {
  color-scheme: light;
  --color-primary: #8f9de0;
  --color-primary-dark: #5f6fc4;
  --color-accent: #7bb0c9;
  --color-warm: #c79bd8;
  --color-purple: #8f9de0;
  --text-primary: #2b2d42;
  --text-secondary: #505578;
  --text-light: #ffffff;
  --bg-primary: #eef1fa;
  --bg-secondary: #e4e9f7;
  --card-bg: rgba(255,255,255,.76);
  --card-hover: rgba(143,157,224,.1);
  --border-light: rgba(140,150,210,.28);
  --shadow: 0 24px 60px rgba(120,130,190,.18);
  --overlay-tint: 238,241,250;
  --xp-gold: #8f9de0;
  --success: #6fa88f;
  --error: #d1786f;
  --level-a1: #6fa88f;
  --level-a2: #7bb0c9;
  --level-b1: #8f9de0;
  --level-b2: #c79bd8;
  --level-c1: #e0a9c4;
  --level-c2: #9aa0b8;
  --particle-color: rgba(143,157,224,.2);
  --aurora-1: rgba(143,210,190,.22);
  --aurora-2: rgba(180,145,225,.18);
}
/* ── Aurora — Noite ── */
:root[data-theme="aurora"][data-mode="night"] {
  color-scheme: dark;
  --color-primary: #7b8cd4;
  --color-primary-dark: #a0b0f0;
  --color-accent: #5f9eb8;
  --color-warm: #b080c8;
  --color-purple: #7b8cd4;
  --text-primary: #e8eaf5;
  --text-secondary: #c3c8df;
  --text-light: #ffffff;
  --bg-primary: #141828;
  --bg-secondary: #1c2035;
  --card-bg: rgba(36,42,72,.72);
  --card-hover: rgba(143,157,224,.1);
  --border-light: rgba(140,150,210,.2);
  --shadow: 0 24px 70px rgba(0,0,0,.4);
  --overlay-tint: 20,24,40;
  --xp-gold: #7b8cd4;
  --success: #5a9680;
  --error: #c06860;
  --particle-color: rgba(143,157,224,.25);
  --aurora-1: rgba(110,190,170,.28);
  --aurora-2: rgba(160,130,220,.20);
}

/* ── Comuns (não dependem de tema) ── */
:root {
  --radius: 20px;
  --radius-sm: 12px;
}
* { box-sizing: border-box; }
html { background: var(--bg-primary); scroll-behavior: smooth; overflow-x: hidden; }
body { margin: 0; min-height: 100vh; font-family: Poppins, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: var(--text-primary); background: var(--bg-primary); line-height: 1.65; overflow-x: hidden; font-size:clamp(.94rem,.22vw + .88rem,1.04rem); position:relative; }
/* Aurora boreal — aplicada como background-layer extra no tema Aurora */
[data-theme="aurora"] body {
  background:
    radial-gradient(ellipse 95% 58% at 25% -4%, var(--aurora-1), transparent 57%),
    radial-gradient(ellipse 80% 64% at 84% 8%, var(--aurora-2), transparent 54%),
    radial-gradient(ellipse 62% 46% at 48% 78%, rgba(120,190,210,.16), transparent 58%),
    var(--bg-primary);
  background-size:140% 140%, 150% 150%, 130% 130%, auto;
  animation: auroraWave 15s ease-in-out infinite;
}
[data-theme="vikings"] body {
  background:
    linear-gradient(rgba(10,8,5,.78),rgba(10,8,5,.94)),
    url('../images/black-forest.png') center top/cover fixed;
}
[data-theme="vikings"][data-mode="day"] body {
  background:
    linear-gradient(rgba(247,242,232,.78),rgba(237,228,212,.94)),
    url('../images/black-forest.png') center top/cover fixed;
}
@keyframes auroraWave {
  0%,100% { background-position: 0% 0%, 100% 0%, 50% 100%; }
  33% { background-position: 18% 8%, 82% 16%, 44% 88%; }
  66% { background-position: 8% 18%, 92% 5%, 56% 94%; }
}
a { color: inherit; text-decoration: none; }

/* ── Partículas de ambiente (flutuantes) ── */
body::before {
  content:"";
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(1.5px 1.5px at 15% 20%, var(--particle-color) 50%, transparent),
    radial-gradient(1px 1px at 78% 12%, var(--particle-color) 50%, transparent),
    radial-gradient(1.5px 1.5px at 42% 68%, var(--particle-color) 50%, transparent),
    radial-gradient(1px 1px at 88% 55%, var(--particle-color) 50%, transparent),
    radial-gradient(1.5px 1.5px at 8% 80%, var(--particle-color) 50%, transparent),
    radial-gradient(1px 1px at 55% 32%, var(--particle-color) 50%, transparent),
    radial-gradient(1.5px 1.5px at 92% 88%, var(--particle-color) 50%, transparent),
    radial-gradient(1px 1px at 32% 90%, var(--particle-color) 50%, transparent),
    radial-gradient(1.5px 1.5px at 65% 75%, var(--particle-color) 50%, transparent),
    radial-gradient(1px 1px at 18% 45%, var(--particle-color) 50%, transparent);
  animation: particlesFloat 20s ease-in-out infinite;
}

/* Chuva nórdica: linhas finas, lentas e atrás de todo o conteúdo. */
[data-theme="vikings"] body::before {
  opacity:.22;
  background-image:
    repeating-linear-gradient(104deg,transparent 0 34px,rgba(205,220,230,.34) 35px 36px,transparent 37px 78px),
    repeating-linear-gradient(104deg,transparent 0 72px,rgba(205,220,230,.2) 73px 74px,transparent 75px 132px);
  background-size:260px 240px,380px 320px;
  animation:vikingRain 1.8s linear infinite;
}
@keyframes vikingRain { from{background-position:0 -320px,80px -410px} to{background-position:-70px 320px,0 410px} }
@keyframes particlesFloat {
  0%,100% { transform:translate(0,0); }
  25% { transform:translate(8px,-10px); }
  50% { transform:translate(-4px,-18px); }
  75% { transform:translate(-10px,-6px); }
}

button,input,select,textarea { font: inherit; }

/* Camada viva de cada ambiente. Puramente visual e sem interceptar cliques. */
body::after {
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  opacity:.28; mix-blend-mode:screen;
}
[data-theme="moderno"] body::after {
  background:linear-gradient(115deg,transparent 0 43%,rgba(214,168,95,.035) 50%,transparent 57%);
  background-size:220% 100%; animation:modernSheen 18s ease-in-out infinite;
}
[data-theme="vikings"] body::after {
  opacity:.18; mix-blend-mode:soft-light;
  background-image:repeating-linear-gradient(92deg,rgba(255,255,255,.025) 0 1px,transparent 1px 6px),radial-gradient(circle at 50% 0,rgba(224,181,120,.22),transparent 42%);
}
[data-theme="aurora"] body::after {
  opacity:.9; filter:blur(18px) saturate(140%);
  background:linear-gradient(108deg,transparent 5%,rgba(74,225,193,.2) 22%,rgba(103,139,255,.28) 40%,rgba(210,111,255,.25) 58%,rgba(96,218,228,.16) 72%,transparent 88%);
  background-size:190% 100%; animation:auroraCurtain 13s ease-in-out infinite alternate;
}
@keyframes modernSheen { 0%,35%{background-position:120% 0} 70%,100%{background-position:-120% 0} }
@keyframes auroraCurtain { from{background-position:100% 0;transform:skewX(-2deg) scaleY(1)} to{background-position:-70% 0;transform:skewX(3deg) scaleY(1.07)} }
body > * { position:relative; z-index:1; }

/* Personalidade dos materiais: metal limpo, madeira/couro e vidro boreal. */
[data-theme="moderno"] .card { box-shadow:inset 0 1px rgba(255,255,255,.025),0 18px 50px rgba(0,0,0,.28); }
[data-theme="vikings"] h1,[data-theme="vikings"] h2,[data-theme="vikings"] h3,[data-theme="vikings"] .brand,[data-theme="vikings"] .brand2,[data-theme="vikings"] .price-tag { font-family:Georgia,"Times New Roman",serif; }
[data-theme="vikings"] .card {
  border-color:rgba(184,135,74,.28);
  background-image:linear-gradient(145deg,rgba(184,135,74,.08),transparent 42%),repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0 1px,transparent 1px 4px);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.22),0 20px 50px rgba(0,0,0,.42);
}
[data-theme="vikings"] .btn,[data-theme="vikings"] input,[data-theme="vikings"] select,[data-theme="vikings"] textarea { font-family:inherit; }
[data-theme="aurora"] .card { box-shadow:inset 0 1px rgba(255,255,255,.5),0 18px 50px rgba(105,115,190,.16); }
[data-theme="aurora"][data-mode="day"] .btn-primary { color:#fff; background:linear-gradient(135deg,#7868df,#9e7bea); }
[data-theme="aurora"][data-mode="day"] .muted,[data-theme="aurora"][data-mode="day"] small { color:#555b82; }
[data-theme="aurora"][data-mode="night"] .muted,[data-theme="aurora"][data-mode="night"] small { color:#c3c8df; }
button,a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid var(--color-primary-dark); outline-offset: 3px; }
::selection { background: rgba(214,168,95,.28); }
.container { width:min(1180px, calc(100% - 40px)); margin:0 auto; padding:0; }

.navbar { min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:12px max(24px, calc((100vw - 1320px)/2)); background:rgba(var(--overlay-tint),.88); backdrop-filter:blur(20px) saturate(130%); border-bottom:1px solid var(--border-light); position:sticky; top:0; z-index:50; }
.navbar .brand { font-weight:600; font-size:.98rem; letter-spacing:-.02em; color:var(--text-primary); display:flex; align-items:center; gap:10px; white-space:nowrap; }
.navbar .brand span { display:grid; place-items:center; width:28px; height:28px; color:var(--color-primary-dark); filter:grayscale(1); }
.navbar nav { display:flex; gap:2px; align-items:center; overflow-x:auto; scrollbar-width:none; }
.navbar nav::-webkit-scrollbar { display:none; }
.navbar nav a { padding:8px 11px; border-radius:9px; font-weight:500; font-size:.84rem; color:var(--text-secondary); white-space:nowrap; transition:.2s ease; }
.navbar nav a:hover { background:var(--card-hover); color:var(--text-primary); }
.navbar nav a.active { background:rgba(214,168,95,.12); color:var(--color-primary-dark); }
.navbar .nav-right { display:flex; align-items:center; gap:8px; white-space:nowrap; }

/* Dropdown "Conteúdo" no menu */
.nav-dropdown { position:relative; }
.nav-dd-trigger { padding:8px 11px; border-radius:9px; font-weight:500; font-size:.84rem; color:var(--text-secondary); white-space:nowrap; cursor:pointer; display:inline-block; user-select:none; }
.nav-dd-trigger:hover, .nav-dd-trigger.active { background:rgba(255,255,255,.05); color:var(--text-primary); }
.nav-dropdown .nav-dd-menu { display:none; position:absolute; top:100%; left:0; margin-top:6px; background:rgba(var(--overlay-tint),.97); border:1px solid var(--border-light); border-radius:var(--radius-sm); padding:8px; min-width:220px; box-shadow:var(--shadow); backdrop-filter:blur(20px); z-index:60; grid-template-columns:1fr 1fr; gap:2px; }
.nav-dropdown:hover .nav-dd-menu, .nav-dropdown:focus-within .nav-dd-menu { display:grid; }
.nav-dd-item { display:block; padding:9px 12px; border-radius:8px; font-size:.86rem; color:var(--text-secondary); white-space:nowrap; }
.nav-dd-item:hover, .nav-dd-item.active { background:rgba(214,168,95,.12); color:var(--color-primary-dark); }
@media (max-width:1050px){
  .nav-dropdown .nav-dd-menu { position:static; display:grid; margin-top:4px; box-shadow:none; background:transparent; border:none; padding:4px 0 4px 10px; grid-template-columns:1fr; }
  .nav-dd-trigger { pointer-events:none; }
}

.btn { min-height:44px; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:11px 20px; border-radius:12px; font-weight:600; font-size:.88rem; border:1px solid transparent; cursor:pointer; transition:transform .2s ease, background .2s ease, border-color .2s ease, opacity .2s ease; }
.btn:hover { transform:translateY(-1px); }
.btn:active { transform:translateY(0); }
.btn:disabled { opacity:.45; cursor:not-allowed; transform:none; }
.btn-primary { background:var(--color-primary); color:#fff; box-shadow:0 10px 30px rgba(0,0,0,.16); }
.btn-primary:hover { background:var(--color-primary-dark); }
.btn-accent { background:var(--color-accent); color:#0c120e; }
.btn-outline { background:var(--card-bg); border-color:var(--border-light); color:var(--text-primary); }
.btn-outline:hover { border-color:var(--color-primary); }
.btn-ghost { background:transparent; color:var(--text-secondary); }
.btn-ghost:hover { background:rgba(255,255,255,.05); color:var(--text-primary); }
.btn-sm { min-height:36px; padding:7px 13px; font-size:.8rem; }
.btn-block { width:100%; }

.card { background:var(--card-bg); border:1px solid var(--border-light); border-radius:var(--radius); box-shadow:var(--shadow); padding:24px; backdrop-filter:blur(18px); transition:border-color .25s ease, transform .25s ease, background .25s ease; }
.card:hover { border-color:var(--color-primary); background:var(--card-hover); }
.card-sm { border-radius:var(--radius-sm); padding:16px; }
.grid { display:grid; gap:18px; }
.grid-2 { grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); }
.grid-3 { grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); }
.grid-4 { grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); }

.hero { padding:clamp(72px,10vw,140px) 20px 72px; text-align:center; }
.hero h1 { font-size:clamp(2.4rem,6vw,5.5rem); line-height:1.03; letter-spacing:-.055em; font-weight:600; margin:0 0 22px; color:var(--text-primary); text-wrap:balance; }
.hero p { font-size:clamp(.98rem,1.5vw,1.15rem); color:var(--text-secondary); max-width:660px; margin:0 auto 30px; line-height:1.7; }
.hero .actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

.form-card { max-width:460px; margin:clamp(36px,8vw,90px) auto; }
.form-card h1 { letter-spacing:-.035em; }
.form-group { margin-bottom:18px; }
.form-group label { display:block; font-weight:500; margin-bottom:7px; font-size:.82rem; color:var(--text-secondary); }
.form-group input,.form-group select,.form-group textarea,input,select,textarea { color:var(--text-primary); background:rgba(255,255,255,.045); border:1px solid var(--border-light); }
.form-group input,.form-group select { width:100%; padding:13px 14px; border-radius:var(--radius-sm); font-size:.92rem; }
.form-group input:focus,.form-group select:focus,textarea:focus,input:focus,select:focus { outline:none; border-color:var(--color-primary); box-shadow:0 0 0 3px rgba(214,168,95,.1); }
.form-error { background:rgba(201,120,109,.12); border:1px solid rgba(201,120,109,.25); color:#e4a39a; padding:10px 14px; border-radius:var(--radius-sm); font-size:.85rem; margin-bottom:16px; display:none; }
.form-error.show { display:block; }
.form-footer { text-align:center; margin-top:18px; font-size:.85rem; color:var(--text-secondary); }
.form-footer a { color:var(--color-primary-dark); }

.xp-bar-track { background:rgba(255,255,255,.08); border-radius:999px; height:8px; overflow:hidden; }
.xp-bar-fill { height:100%; background:var(--color-primary); border-radius:999px; transition:width .4s ease; }
.level-badge { display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:999px; font-weight:600; color:#121212; font-size:.76rem; }
.section-title { font-size:clamp(1.3rem,2vw,1.75rem); letter-spacing:-.03em; font-weight:600; margin:40px 0 18px; color:var(--text-primary); }
.badge { display:inline-block; padding:4px 9px; border-radius:999px; font-size:.7rem; font-weight:600; background:rgba(255,255,255,.06); color:var(--text-secondary); }
.badge-locked { background:rgba(201,120,109,.12); color:#dfa097; }
.muted { color:var(--text-secondary); font-size:max(.86rem,1em); }
.center { text-align:center; }
.mt-0 { margin-top:0; }.mb-0 { margin-bottom:0; }
.flex { display:flex; align-items:center; }.flex-between { display:flex; align-items:center; justify-content:space-between; }
.gap-8 { gap:8px; }.gap-12 { gap:12px; }.gap-16 { gap:16px; }
.footer { text-align:center; padding:50px 20px; color:var(--text-secondary); font-size:.78rem; }

.sentence-row { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; padding:16px 0; border-bottom:1px solid var(--border-light); }
.sentence-row:last-child { border-bottom:none; }.sentence-de { font-weight:600; font-size:1rem; }.sentence-pt { color:var(--text-secondary); font-size:.87rem; margin-top:3px; }.sentence-pron { color:var(--color-primary-dark); font-size:.78rem; margin-top:3px; font-style:italic; }
.xp-pill { flex-shrink:0; background:rgba(214,168,95,.13); color:var(--color-primary-dark); font-weight:600; font-size:.72rem; padding:4px 9px; border-radius:999px; white-space:nowrap; }
.vocab-chip { display:inline-flex; flex-direction:column; padding:10px 13px; background:rgba(255,255,255,.045); border:1px solid var(--border-light); border-radius:var(--radius-sm); margin:4px; }.vocab-chip b{font-size:.9rem}.vocab-chip span{font-size:.76rem;color:var(--text-secondary)}
.tip-card { border-left:2px solid var(--color-warm); background:rgba(214,168,95,.07); padding:14px 16px; border-radius:var(--radius-sm); margin-bottom:12px; }.tip-card h4{margin:0 0 6px;font-size:.9rem}.tip-card p{margin:4px 0;font-size:.84rem}
.tabs { display:flex; gap:7px; margin-bottom:20px; flex-wrap:wrap; }.tab-btn { min-height:40px; padding:9px 15px; border-radius:10px; border:1px solid var(--border-light); background:rgba(255,255,255,.03); font-weight:500; cursor:pointer; color:var(--text-secondary); }.tab-btn.active{background:rgba(214,168,95,.14);border-color:rgba(214,168,95,.25);color:var(--color-primary-dark)}
.level-tab { padding:10px 16px; border-radius:10px; font-weight:600; cursor:pointer; text-align:center; color:#101010; position:relative; }.level-tab.locked{opacity:.45}.level-tab.active-level{outline:2px solid var(--text-primary);outline-offset:2px}

/* Workspace público */
.workspace-hero { min-height:calc(100svh - 72px); display:grid; align-items:end; position:relative; isolation:isolate; overflow:hidden; background:url('../images/berlin-night.png') center/cover no-repeat; }
.workspace-hero::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(var(--overlay-tint),.28),rgba(var(--overlay-tint),.78) 55%,var(--bg-primary) 100%); }
.workspace-hero .hero-inner { width:min(1180px,calc(100% - 40px)); margin:0 auto; padding:80px 0 72px; }
.eyebrow { color:var(--color-primary-dark); font-size:.75rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }
.workspace-hero h1 { max-width:850px; margin:14px 0 18px; font-size:clamp(2.7rem,6.5vw,6rem); line-height:1.02; letter-spacing:-.06em; font-weight:500; text-wrap:balance; }
.workspace-hero p { max-width:580px; color:#c2beb7; font-size:clamp(.95rem,1.5vw,1.08rem); }
.session-strip { margin-top:30px; width:min(740px,100%); display:flex; align-items:center; gap:14px; padding:12px; border:1px solid rgba(255,255,255,.12); background:rgba(12,12,14,.65); backdrop-filter:blur(20px); border-radius:16px; }
.session-play { width:44px; height:44px; border:0; border-radius:50%; background:var(--color-primary); color:#17130e; cursor:pointer; flex:0 0 auto; }
.session-meta { flex:1; min-width:0; }.session-meta strong,.session-meta span{display:block}.session-meta strong{font-size:.84rem}.session-meta span{font-size:.72rem;color:var(--text-secondary)}
.session-tools { display:flex; gap:6px; }.session-tools button{min-height:36px;border:1px solid var(--border-light);background:rgba(255,255,255,.04);color:var(--text-secondary);border-radius:9px;padding:7px 10px;cursor:pointer;font-size:.75rem}
.workspace-section { padding:72px 0; }.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:22px}.section-head h2{font-size:clamp(1.65rem,3vw,2.45rem);letter-spacing:-.045em;font-weight:500;margin:0}.section-head p{max-width:500px;color:var(--text-secondary);margin:0;font-size:.9rem}
.continue-card { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(280px,.7fr); overflow:hidden; padding:0; min-height:330px; }
.continue-cover { background:url('../images/cafe-night.png') center/cover; min-height:300px; position:relative; }.continue-cover::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(18,18,20,.65))}.continue-body{padding:34px;display:flex;flex-direction:column;justify-content:center}.continue-body h3{font-size:1.7rem;letter-spacing:-.04em;margin:8px 0}.progress-line{height:4px;background:rgba(255,255,255,.08);border-radius:10px;margin:20px 0}.progress-line span{display:block;width:62%;height:100%;background:var(--color-primary);border-radius:10px}
.environment-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:14px; }.environment-card{grid-column:span 4; min-height:260px; border-radius:18px; overflow:hidden; position:relative; background-size:cover;background-position:center;border:1px solid var(--border-light);cursor:pointer}.environment-card.wide{grid-column:span 6}.environment-card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(8,8,10,.92))}.environment-card:hover{transform:translateY(-3px);border-color:rgba(214,168,95,.35)}.environment-copy{position:absolute;inset:auto 20px 18px;z-index:1}.environment-copy strong,.environment-copy span{display:block}.environment-copy strong{font-size:1rem}.environment-copy span{font-size:.76rem;color:#aaa59d;margin-top:3px}.env-library{background-image:url('../images/library-night.png')}.env-rain{background-image:url('../images/rain-window.png')}.env-ice{background-image:url('../images/ice-train.png')}.env-forest{background-image:url('../images/black-forest.png')}.env-cafe{background-image:url('../images/cafe-night.png')}
.focus-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.focus-panel{min-height:300px;display:flex;flex-direction:column;justify-content:space-between}.player-wave{display:flex;align-items:end;gap:4px;height:70px}.player-wave i{display:block;flex:1;max-width:6px;border-radius:5px;background:rgba(214,168,95,.55);height:var(--h)}.pomo-ring{width:180px;height:180px;margin:10px auto;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--color-primary) 0 72%,rgba(255,255,255,.07) 72%);position:relative}.pomo-ring::before{content:"";position:absolute;inset:8px;background:var(--bg-secondary);border-radius:50%}.pomo-ring span{position:relative;font-size:2rem;font-weight:500;letter-spacing:-.05em}
.mission-list{display:grid;gap:10px}.mission{display:flex;align-items:center;gap:12px;padding:14px 16px;background:rgba(255,255,255,.025);border:1px solid var(--border-light);border-radius:12px}.mission-dot{width:18px;height:18px;border-radius:50%;border:1px solid var(--color-primary);display:grid;place-items:center;color:var(--color-primary);font-size:.65rem}.mission strong{font-size:.84rem}.mission span{display:block;color:var(--text-secondary);font-size:.72rem}

/* Refinamento progressivo das páginas legadas, sem alterar seletores funcionais */
body:has(.form-card) { background:linear-gradient(90deg,rgba(var(--overlay-tint),.92),rgba(var(--overlay-tint),.66)),url('../images/cafe-night.png') center/cover fixed; }
body:has(.form-card) .form-card { background:var(--card-bg); border:1px solid var(--border-light); backdrop-filter:blur(24px); box-shadow:var(--shadow); }
[data-theme="aurora"] body:has(.form-card) { background:radial-gradient(ellipse at 22% 0,var(--aurora-1),transparent 52%),radial-gradient(ellipse at 82% 12%,var(--aurora-2),transparent 54%),var(--bg-primary); }
[data-theme="vikings"] body:has(.form-card) { background:linear-gradient(rgba(var(--overlay-tint),.7),rgba(var(--overlay-tint),.92)),url('../images/black-forest.png') center/cover fixed; }
body:has(#xp-card) #xp-card { margin-top:18px; background:linear-gradient(110deg,rgba(214,168,95,.1),rgba(24,24,27,.76) 55%); }
body:has(#xp-card) .grid .card { min-height:170px; display:flex; flex-direction:column; justify-content:center; }
.container > h1,.container > h2 { margin-top:42px; letter-spacing:-.04em; font-weight:500; }
ul { color:var(--text-secondary); padding-left:20px; } li { margin:8px 0; }
table { width:100%; border-collapse:collapse; } th,td { padding:12px; border-bottom:1px solid var(--border-light); text-align:left; } th { color:var(--text-secondary); font-size:.76rem; font-weight:500; }
canvas { max-width:100%; border-radius:var(--radius-sm); }
a.card { cursor:pointer; }
a.card:hover { transform:translateY(-3px); background:var(--card-hover); }

/* Inventário de conteúdo (landing) */
.stat-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:14px; }
.stat-card { background:var(--card-bg); border:1px solid var(--border-light); border-radius:var(--radius-sm); padding:20px 18px; backdrop-filter:blur(14px); transition:border-color .25s ease, transform .25s ease; }
.stat-card:hover { border-color:rgba(214,168,95,.3); transform:translateY(-2px); }
.stat-card strong { display:block; font-size:clamp(1.6rem,2.6vw,2.2rem); font-weight:600; letter-spacing:-.04em; color:var(--color-primary-dark); font-variant-numeric:tabular-nums; }
.stat-card span { display:block; font-size:.8rem; color:var(--text-primary); margin-top:2px; font-weight:500; }
.stat-card small { display:block; font-size:.7rem; color:var(--text-secondary); margin-top:3px; line-height:1.45; }
.stat-total { grid-column:1/-1; text-align:center; padding:26px 18px; background:linear-gradient(110deg,rgba(214,168,95,.12),var(--card-bg) 60%); }
.stat-total strong { font-size:clamp(2.4rem,5vw,3.6rem); }

/* Cards de preço (landing + planos) */
.plans-page { position:relative; z-index:1; padding-top:clamp(44px,7vw,88px)!important; padding-bottom:72px!important; }
.plans-hero { position:relative; max-width:780px; margin:0 auto; }
.plans-hero h1 { margin:10px 0 12px; font-size:clamp(2.45rem,5vw,4.8rem); line-height:1.02; letter-spacing:-.055em; font-weight:650; text-wrap:balance; }
.plans-hero p { font-size:clamp(.98rem,1.4vw,1.16rem); line-height:1.7; }
[data-theme="aurora"] .plans-hero::before { content:""; position:absolute; inset:-70px -18vw -90px; z-index:-1; background:radial-gradient(ellipse at center,rgba(125,123,235,.2),transparent 65%); filter:blur(12px); pointer-events:none; }
[data-theme="aurora"] .plans-page::before {
  content:""; position:fixed; z-index:-1; pointer-events:none;
  top:60px; left:-10vw; width:120vw; height:min(520px,62vh);
  opacity:.88; filter:blur(18px) saturate(145%);
  background:
    radial-gradient(ellipse 42% 80% at 18% 0,rgba(77,225,195,.34),transparent 64%),
    radial-gradient(ellipse 48% 88% at 52% -8%,rgba(104,135,255,.4),transparent 65%),
    radial-gradient(ellipse 42% 82% at 83% 2%,rgba(215,113,255,.34),transparent 66%);
  transform-origin:50% 0; animation:plansAurora 12s ease-in-out infinite alternate;
}
[data-theme="aurora"][data-mode="night"] .plans-page::before {
  opacity:1; filter:blur(16px) saturate(165%);
  background:
    radial-gradient(ellipse 42% 82% at 14% -4%,rgba(45,235,188,.4),transparent 62%),
    radial-gradient(ellipse 50% 92% at 49% -10%,rgba(74,113,255,.5),transparent 64%),
    radial-gradient(ellipse 44% 86% at 85% 0,rgba(204,80,255,.43),transparent 65%);
}
@keyframes plansAurora {
  0% { transform:translate3d(-3%,0,0) skewX(-3deg) scaleX(1); }
  48% { transform:translate3d(2%,4%,0) skewX(2deg) scaleX(1.08); }
  100% { transform:translate3d(-1%,1%,0) skewX(4deg) scaleX(1.03); }
}
.price-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; align-items:stretch; }
.price-card { display:flex; flex-direction:column; gap:0; position:relative; min-height:520px; padding:clamp(24px,3vw,36px); overflow:visible; }
.price-card.featured { border-color:rgba(214,168,95,.45); background:linear-gradient(160deg,rgba(214,168,95,.1),var(--card-bg) 55%); }
.price-tag { font-size:clamp(1.9rem,3vw,2.5rem); font-weight:600; letter-spacing:-.045em; color:var(--text-primary); margin:10px 0 2px; }
.price-tag small { font-size:.85rem; font-weight:500; color:var(--text-secondary); letter-spacing:0; }
.price-note { font-size:.84rem; color:var(--text-secondary); margin:0 0 18px; min-height:44px; }
.price-flag { position:absolute; top:-11px; left:50%; transform:translateX(-50%); background:var(--color-primary); color:#17130e; font-size:.68rem; font-weight:600; padding:4px 12px; border-radius:999px; white-space:nowrap; }
.price-card ul { list-style:none; padding:0; margin:0 0 20px; }
.price-card ul li { padding-left:24px; position:relative; font-size:.92rem; line-height:1.48; margin:11px 0; color:var(--text-primary); }
.price-card ul li::before { content:"✓"; position:absolute; left:0; color:var(--color-accent); font-weight:600; }
.price-card ul li.off { opacity:.45; } .price-card ul li.off::before { content:"—"; color:var(--text-secondary); }
.price-card .btn { margin-top:auto; }
[data-theme="aurora"] .price-card { background:linear-gradient(155deg,rgba(255,255,255,.84),rgba(234,236,255,.62)); border-color:rgba(125,118,220,.28); }
[data-theme="aurora"][data-mode="night"] .price-card { background:linear-gradient(155deg,rgba(52,59,99,.84),rgba(31,36,66,.7)); }
[data-theme="aurora"] .price-card.featured { transform:translateY(-8px); border-color:rgba(120,103,224,.62); box-shadow:0 28px 70px rgba(104,91,195,.24); }
[data-theme="vikings"] .price-card.featured { transform:translateY(-8px); box-shadow:0 30px 70px rgba(0,0,0,.5),inset 0 0 0 1px rgba(224,181,120,.16); }

/* Player lofi embutido na landing */
.lofi-inline { border-radius:12px; overflow:hidden; border:1px solid var(--border-light); background:rgba(12,12,14,.6); }
.lofi-inline iframe { display:block; width:100%; border:0; }

/* Itens bloqueados (modo visitante) */
.locked-item { opacity:.75; position:relative; }
.locked-item:hover { opacity:1; border-color:rgba(214,168,95,.4); }
.lock-pill { flex-shrink:0; background:rgba(255,255,255,.07); color:var(--text-secondary); font-size:.78rem; padding:4px 9px; border-radius:999px; }
/* Texto de mentira borrado — da volume visual sem revelar conteudo real */
.blur-fake { filter:blur(5px); user-select:none; pointer-events:none; }

/* Amostra grátis */
.sample-tabs { display:flex; gap:7px; margin:6px 0 22px; flex-wrap:wrap; }
.sample-item { border-bottom:1px solid var(--border-light); }
.sample-item:last-child { border-bottom:none; }
.sample-item summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:14px; padding:15px 4px; }
.sample-item summary::-webkit-details-marker { display:none; }
.sample-item summary strong { font-size:.95rem; font-weight:600; }
.sample-item summary .sub { display:block; font-size:.8rem; color:var(--text-secondary); margin-top:2px; }
.sample-item summary::after { content:"+"; color:var(--text-secondary); font-size:1.1rem; flex-shrink:0; transition:transform .2s; }
.sample-item[open] summary::after { transform:rotate(45deg); }
.sample-item .sample-body { padding:2px 4px 18px; }
.sample-lock { text-align:center; padding:34px 20px; background:linear-gradient(180deg,transparent,rgba(214,168,95,.06)); border:1px dashed rgba(214,168,95,.3); border-radius:var(--radius-sm); margin-top:20px; }

@media (max-width:1050px){.navbar{align-items:flex-start;flex-wrap:wrap}.navbar nav{order:3;width:100%;padding-bottom:2px}.navbar .nav-right .muted{display:none}.continue-card{grid-template-columns:1fr}.continue-cover{min-height:280px}.focus-grid{grid-template-columns:1fr}.environment-card{grid-column:span 6}.price-grid{grid-template-columns:1fr 1fr}.price-card.featured{transform:none}.price-card:last-child{grid-column:1/-1}}
@media (max-width:640px){.container,.workspace-hero .hero-inner{width:min(100% - 28px,1180px)}.navbar{min-height:62px;padding:10px 14px;gap:8px}.navbar .brand{font-size:.9rem}.navbar nav{margin:0 -14px;width:calc(100% + 28px);padding:5px 14px 2px}.navbar nav a{font-size:.78rem;padding:8px 10px}.navbar .nav-right{margin-left:auto}.navbar .nav-right>.btn{min-height:36px;padding:7px 11px}.card{padding:18px;border-radius:16px}.hero{padding-top:64px}.grid-2,.grid-3,.grid-4,.price-grid{grid-template-columns:1fr}.price-card,.price-card:last-child{grid-column:auto;min-height:0}.workspace-hero{min-height:calc(100svh - 102px)}.workspace-hero .hero-inner{padding:70px 0 36px}.workspace-hero h1{font-size:clamp(2.55rem,13vw,4.2rem)}.session-strip{align-items:flex-start;flex-wrap:wrap}.session-tools{width:100%}.session-tools button{flex:1}.workspace-section{padding:48px 0}.section-head{align-items:flex-start;flex-direction:column}.continue-body{padding:24px}.environment-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}.environment-card,.environment-card.wide{flex:0 0 82vw;min-height:300px;scroll-snap-align:start}.sentence-row{flex-direction:column}.focus-panel{min-height:270px}.form-card{margin:28px 14px}.pomo-ring{width:160px;height:160px}.ext-tray{right:10px!important}.lofi-player,.pomo-box{width:calc(100vw - 28px)!important;right:14px!important;bottom:72px!important}.lofi-player iframe{width:100%!important}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

@media (max-width:420px){.plans-page{padding-top:34px!important}.plans-hero h1{font-size:2.25rem}.price-card{padding:22px}.price-flag{font-size:.62rem}.sidebar a{font-size:.88rem}}

/* ============================================================
   Microinteracoes — fade-in em cascata, respiracao, ripple etc.
   Uso discreto (200-600ms), nunca chamativo.
   ============================================================ */
.mi-stagger { opacity:0; transform:translateY(8px); animation:miIn .5s cubic-bezier(.2,.8,.2,1) forwards; }
@keyframes miIn { to { opacity:1; transform:translateY(0); } }

.mi-card { transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.mi-card:hover { transform:translateY(-3px) scale(1.008); box-shadow:0 14px 34px color-mix(in srgb,var(--color-primary) 14%,rgba(0,0,0,.28)); border-color:color-mix(in srgb,var(--color-primary) 72%,transparent); }

.mi-breathe { animation:miBreathe 3.6s ease-in-out infinite; }
@keyframes miBreathe { 0%,100%{transform:scale(1);} 50%{transform:scale(1.012);} }

.mi-ripple { position:relative; overflow:hidden; }
.mi-ripple-el { position:absolute; border-radius:50%; background:rgba(255,255,255,.45); transform:scale(0); animation:miRip .55s ease-out forwards; pointer-events:none; }
@keyframes miRip { to { transform:scale(3); opacity:0; } }

.mi-bar-fill { transition:width 1.3s cubic-bezier(.2,.8,.2,1); }

.mi-pulse { animation:miPulse 1s ease-in-out infinite; }
@keyframes miPulse { 0%,100%{ filter:drop-shadow(0 0 0 var(--color-primary)); } 50%{ filter:drop-shadow(0 0 7px var(--color-primary)); } }

.mi-wavebar { animation:miWave 1s ease-in-out infinite alternate; transform-origin:bottom; }
@keyframes miWave { from{opacity:.55; transform:scaleY(.7);} to{opacity:1; transform:scaleY(1);} }
