/* HispanoQuest BR1 — semantic brand layer. Post-V4D only. */
/* CP55-F02A: core tokens are defined in hispanoquest.tokens.css. */
:root{
 --hq-axis-lengua:var(--hq-terracotta);
 --hq-axis-literatura:var(--hq-brown);
 --hq-axis-comprension:var(--hq-olive);
}


*,*::before,*::after{box-sizing:border-box}
img,svg,canvas,video{max-width:100%}
.hq-card{max-width:100%;min-width:0;overflow-wrap:anywhere}
.hq-btn{max-width:100%;min-width:0;text-align:center;line-height:1.2}
html,body{background:var(--hq-cream);color:var(--hq-text);overflow-x:hidden}
button,[role="button"],a,input,select,textarea{font-family:var(--hq-body)}
button{min-height:44px;min-height:var(--hq-hit-target);max-width:100%;line-height:var(--hq-line-tight)}
button:focus-visible,a:focus-visible,[role="button"]:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:var(--hq-focus-width) solid var(--hq-focus)!important;outline-offset:var(--hq-focus-offset)!important;box-shadow:0 0 0 2px var(--hq-paper),0 0 0 5px var(--hq-focus)!important}
.hq-teen-login-page{background:var(--hq-cream)!important;color:var(--hq-text)!important}
.hq-teen-login-card{background:var(--hq-paper)!important;border-radius:var(--hq-radius-modal)!important;box-shadow:var(--hq-elevation-2)!important}
.hq-teen-login-art{background:url('brand/login-brand-hero-canonical.png') center/cover no-repeat!important;aspect-ratio:570/498!important;height:auto!important;margin:0!important}
.hq-teen-login-actions{background:var(--hq-paper)!important}
.hq-teen-login-primary{background:var(--hq-blue)!important;border-radius:var(--hq-radius-card)!important;box-shadow:var(--hq-elevation-1)!important}
.hq-teen-login-primary:hover{background:var(--hq-blue-hover)!important}
.hq-teen-login-primary:active{background:var(--hq-blue-pressed)!important;transform:scale(.98)!important}
.hq-teen-login-secondary{border:2px solid var(--hq-blue)!important;background:var(--hq-paper)!important;color:var(--hq-blue)!important;border-radius:var(--hq-radius-card)!important}
.hq-teen-login-guest{color:var(--hq-blue)!important}.hq-teen-login-teacher{color:var(--hq-blue)!important}
.hq-teen-login-border{background:var(--hq-blue)!important;border-top:3px solid var(--hq-terracotta)!important;height:8px!important}
.hq-teacher-shell{background:var(--hq-cream)!important}.hq-teacher-aside{background:var(--hq-blue)!important}
.hq-teacher-nav button:hover,.hq-teacher-nav button.active{background:rgba(255,255,255,.12)!important;border-left:3px solid var(--hq-terracotta)!important}
.hq-teacher-panel,.hq-teacher-recent{border-radius:var(--hq-radius-card)!important;box-shadow:var(--hq-elevation-1)!important}
.hq-teacher-side-mascot{background:var(--hq-paper)!important;border-radius:var(--hq-radius-card)!important}.hq-teacher-side-mascot img{width:100%!important;height:100%!important;transform:none!important;object-position:center!important}
.hq-high-contrast body,.hq-high-contrast{background:#1A1A1A!important;color:#F4A100!important}
.hq-high-contrast :focus-visible{outline:3px solid #F4A100!important;outline-offset:3px!important;box-shadow:0 0 0 2px #1A1A1A,0 0 0 5px #F4A100!important}
.hq-high-contrast button,.hq-high-contrast input,.hq-high-contrast select,.hq-high-contrast textarea{background:#1A1A1A!important;color:#F4A100!important;border-color:#F4A100!important}
/* Ñito is a restrained editorial badge; motion never jumps/waves/celebrates. */
.tq-img{animation:none!important;filter:none!important}.tq-shadow{display:none!important}.hq-taquito-bounce{animation:none!important}
@media (max-width:560px){.hq-teen-login-art{height:270px!important}.hq-teen-login-primary,.hq-teen-login-secondary{border-radius:var(--hq-radius-card)!important}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition-duration:.01ms!important}}

/* CP54.5 P0.7 · tabela docente legível no celular */
.hq-students-table th,.hq-students-table td{overflow-wrap:normal;word-break:normal}
@media(max-width:720px){
  #hq-students .hq-card>div[style*="overflow-x"]{overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  .hq-students-table{min-width:980px!important}
  .hq-students-table th:first-child,.hq-students-table td:first-child{position:sticky;left:0;z-index:2;background:#fff;box-shadow:6px 0 10px rgba(19,41,75,.05)}
  .hq-students-table thead th:first-child{background:#F5F1E8;z-index:3}
}


/* ===== CP55.3 · Student quest visual layer ===== */
.hq-world-card{
  --hq-world-accent:var(--hq-blue);
  border-left:6px solid var(--hq-world-accent)!important;
  border-radius:18px!important;
  background:linear-gradient(135deg,color-mix(in srgb,var(--hq-world-accent) 5%,white),#fff 46%)!important;
  box-shadow:0 10px 28px -24px rgba(19,41,75,.48)!important;
  transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease;
}
.hq-world-card:hover{transform:translateY(-2px);box-shadow:0 14px 30px -22px rgba(19,41,75,.52)!important}
.hq-world-kicker{font-family:var(--hq-impact)!important;color:var(--hq-gold-text)!important;font-size:11px!important;letter-spacing:.045em!important}
.hq-world-title{font-family:var(--hq-font-heading)!important;color:var(--hq-blue)!important;font-weight:800!important}
.hq-world-subtitle{font-family:var(--hq-font-body)!important;color:var(--hq-muted)!important}
.hq-world-progress{font-family:var(--hq-font-data)!important;font-variant-numeric:tabular-nums}
.hq-world-hero{background:linear-gradient(140deg,var(--hq-blue-pressed),var(--hq-blue))!important;border-top:5px solid var(--hq-gold);box-shadow:0 14px 34px -26px rgba(19,41,75,.72)}
.hq-world-hero h1{font-family:var(--hq-font-heading)!important}
.hq-world-tabs button{font-family:var(--hq-font-action)!important;border-radius:999px!important;padding:10px 15px!important}
.hq-world-tabs button[aria-selected="true"]{background:var(--hq-blue)!important;color:#fff!important;border-color:var(--hq-blue)!important}
.hq-phase-node .hq-phase-label{font-family:var(--hq-font-heading)!important;font-weight:700!important}
.hq-phase-node .hq-phase-meta{font-family:var(--hq-font-data)!important;font-variant-numeric:tabular-nums}
.hq-phase-button{transition:transform .12s ease,filter .12s ease,box-shadow .12s ease!important}
.hq-phase-button[data-state="current"]{background:var(--hq-terracotta)!important;box-shadow:0 5px 0 var(--hq-terracotta-pressed),0 0 0 6px color-mix(in srgb,var(--hq-terracotta) 10%,transparent)!important}
.hq-phase-button[data-state="current"]:hover{transform:translateX(-50%) translateY(-2px)!important}
.hq-phase-button[data-state="done"]{background:var(--hq-olive)!important;box-shadow:0 5px 0 #3f4c25!important}
.hq-phase-button[data-state="locked"]{background:var(--hq-disabled-text)!important;opacity:1!important;box-shadow:none!important}
.hq-xp-badge{display:inline-flex;align-items:center;gap:4px;margin-top:4px;padding:3px 6px;border-radius:7px;background:#FFF7DC;color:#8A6110;font-size:10px;letter-spacing:.02em}

.hq-quest-card{border-radius:20px!important;border:1px solid #E4DDD3!important;border-top:8px solid var(--hq-blue)!important;box-shadow:0 16px 38px -30px rgba(19,41,75,.5)!important;background:#fff!important}
.hq-quest-progress{display:grid;grid-template-columns:1fr auto;align-items:end;gap:12px;margin-bottom:22px}
.hq-quest-progress-label{font-family:var(--hq-font-data);font-size:12px;font-weight:700;color:var(--hq-olive);letter-spacing:.035em;text-transform:uppercase}
.hq-quest-progress-count{font-family:var(--hq-font-data);font-size:13px;font-weight:700;color:var(--hq-olive);font-variant-numeric:tabular-nums}
.hq-quest-progress-track{grid-column:1/-1;height:10px;border-radius:999px;background:#E9E7DF;overflow:hidden}
.hq-quest-progress-fill{height:100%;border-radius:999px;background:var(--hq-olive);transition:width .18s ease}
.hq-quest-question{font-family:var(--hq-font-heading)!important;color:var(--hq-blue)!important;font-size:clamp(20px,2.7vw,26px)!important;line-height:1.3!important;margin:0 0 20px!important}
.hq-quest-statement,.hq-quest-stimulus{font-family:var(--hq-font-body)!important;color:var(--hq-text)!important;font-size:18px!important;line-height:1.58!important}
.hq-quest-options{display:grid;gap:12px}
.hq-quest-option{font-family:var(--hq-font-body)!important;display:grid!important;grid-template-columns:44px minmax(0,1fr)!important;align-items:center!important;gap:14px!important;text-align:left!important;padding:12px 16px!important;border-radius:14px!important;border:2px solid #D9DEE5!important;background:#fff!important;color:var(--hq-text)!important;font-size:17px!important;line-height:1.42!important;font-weight:600!important;min-height:64px!important}
.hq-quest-option:hover:not(:disabled){border-color:#A8B5C5!important;background:#FBFCFE!important}
.hq-quest-option[aria-pressed="true"]{border-color:var(--hq-blue)!important;background:#F0F5FA!important;box-shadow:0 0 0 2px color-mix(in srgb,var(--hq-blue) 8%,transparent)!important}
.hq-quest-option-marker{font-family:var(--hq-font-heading);font-weight:800;width:42px;height:42px;border-radius:10px;display:grid;place-items:center;background:#EAF0F6;color:var(--hq-blue);font-size:18px}
.hq-quest-option[aria-pressed="true"] .hq-quest-option-marker{background:var(--hq-blue);color:#fff}
.hq-quest-actions{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap;border-top:1px solid #EEE9E2;margin-top:24px;padding-top:20px}
.hq-quest-actions .hq-btn{font-family:var(--hq-font-action)!important;font-weight:900!important;border-radius:13px!important;text-transform:none!important}
.hq-quest-hint{font-family:var(--hq-font-action)!important;background:#FFF8E7!important;color:#805D10!important;border:2px solid var(--hq-gold)!important;border-radius:13px!important;padding:10px 15px!important;font-weight:900!important}
.hq-quest-primary{background:var(--hq-terracotta)!important;color:#fff!important;border-color:var(--hq-terracotta)!important;box-shadow:0 4px 0 var(--hq-terracotta-pressed)!important}
.hq-quest-skip{background:transparent!important;color:#5F6874!important;border:1px solid transparent!important;box-shadow:none!important}
.hq-source-toggle{font-family:var(--hq-font-heading)!important;color:var(--hq-blue)!important}

@media(max-width:720px){
  .hq-world-card{grid-template-columns:44px minmax(0,1fr) auto!important;padding:13px 12px!important}
  .hq-world-tabs{position:sticky;top:64px;z-index:12;background:var(--hq-cream);padding-top:6px!important}
  .hq-quest-card{border-radius:16px!important;padding:18px!important}
  .hq-quest-actions{display:grid;grid-template-columns:1fr 1fr}
  .hq-quest-actions .hq-quest-primary{grid-column:1/-1;width:100%!important}
  .hq-quest-option{grid-template-columns:40px minmax(0,1fr)!important;padding:11px 12px!important;font-size:16.5px!important}
  .hq-quest-option-marker{width:38px;height:38px}
}
@media(max-width:420px){
  .hq-world-card{grid-template-columns:40px minmax(0,1fr)!important}
  .hq-world-card>span:last-child{display:none!important}
  .hq-quest-actions{grid-template-columns:1fr}
  .hq-quest-actions .hq-quest-primary{grid-column:auto}
}


/* CP55.3 P0 · mobile phase labels stay on a readable surface, never squeezed around the node */
@media(max-width:720px){
  .hq-phase-node{height:auto!important;min-height:72px!important;padding-left:82px!important;margin-top:20px!important}
  .hq-phase-node .hq-phase-copy{position:static!important;transform:none!important;width:auto!important;left:auto!important;right:auto!important;text-align:left!important;min-height:64px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;padding-right:6px!important}
  .hq-phase-node .hq-phase-label{color:var(--hq-blue)!important;line-height:1.32!important}
  .hq-phase-node .hq-phase-connector{left:calc(var(--hq-phase-size,64px)/2)!important;transform:none!important}
  .hq-phase-node .hq-phase-button{left:0!important;transform:none!important}
  .hq-phase-node .hq-phase-button[data-state="current"]:hover{transform:translateY(-2px)!important}
}
/* CP55.3 · versão pública: somente login, curta e discreta */
.hq-login-public-version{display:inline-flex;align-items:center;justify-content:center;margin-top:8px;padding:2px 7px;border-radius:999px;border:1px solid rgba(19,41,75,.14);color:#667085;background:rgba(255,255,255,.58);font:700 10px/1.4 "Atkinson Hyperlegible",system-ui,sans-serif;letter-spacing:.02em}

