:root{
  --ut-paper:#f5efe3;--ut-paper-light:#fbf8f1;--ut-paper-deep:#e8ddca;
  --ut-ink:#152326;--ut-ink-soft:#344346;--ut-muted:#687173;
  --ut-forest:#063f39;--ut-forest-deep:#022d29;--ut-forest-soft:#dbe9e4;
  --ut-orange:#d85b18;--ut-orange-dark:#a83e0e;--ut-orange-soft:#f1d2bd;
  --ut-line:#c9bda9;--ut-shadow:0 18px 50px rgba(21,35,38,.10);
}
body{
  background:
    linear-gradient(rgba(21,35,38,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(21,35,38,.025) 1px,transparent 1px),
    var(--ut-paper);
  background-size:38px 38px;
  color:var(--ut-ink);
}
h1,h2,h3{font-family:"Source Serif 4",Georgia,"Times New Roman",serif}
.site-header{
  min-height:78px;
  padding:.75rem max(1rem,calc((100vw - var(--max))/2));
  color:var(--ut-paper-light);
  background:linear-gradient(90deg,var(--ut-forest-deep),var(--ut-forest));
  border-bottom:4px solid var(--ut-orange);
  overflow:hidden;
}
.site-header::after{content:"";position:absolute;inset:0 0 0 auto;width:min(44vw,620px);background:url('/assets/brand/stripe-field-dark.svg') center/cover no-repeat;opacity:.22;pointer-events:none}
.site-header>*{position:relative;z-index:1}
.brand{color:white}.brand img{width:50px;height:50px}.brand strong{font-size:1.08rem}.brand small{color:#d8e2de}
.site-header nav button,.site-header nav a{color:var(--ut-paper-light)}
.site-header nav button:hover,.site-header nav a:hover,.site-header nav button:focus-visible,.site-header nav a:focus-visible{border-color:var(--ut-orange)}
main{max-width:1240px}
.hero{
  position:relative;
  margin-top:clamp(1.4rem,3vw,2.8rem);
  padding:clamp(2rem,5vw,5rem);
  background:var(--ut-paper-light);
  border:1px solid var(--ut-line);
  border-top:8px solid var(--ut-orange);
  box-shadow:var(--ut-shadow);
  overflow:hidden;
}
.hero::after{content:"";position:absolute;right:-2%;top:-16%;width:48%;height:130%;background:url('/assets/brand/tiger-eye-hero.webp') center/cover no-repeat;opacity:.12;mask-image:linear-gradient(90deg,transparent,#000 32%);pointer-events:none}
.hero>*,.hero .exam-facts{position:relative;z-index:1}
h1{font-size:clamp(3.2rem,7.2vw,6.8rem);line-height:.92;max-width:830px}
.lede{color:var(--ut-ink-soft)}
.primary{background:var(--ut-forest);border-color:var(--ut-forest);border-radius:4px}
.primary:hover,.primary:focus-visible{background:var(--ut-forest-deep);border-color:var(--ut-orange)}
.secondary{background:var(--ut-paper-light);border-color:var(--ut-forest);border-radius:4px;color:var(--ut-forest-deep)}
.secondary:hover,.secondary:focus-visible{background:var(--ut-forest);color:white}
.exam-facts{background:linear-gradient(155deg,var(--ut-forest-deep),var(--ut-forest));border-top:9px solid var(--ut-orange);box-shadow:0 14px 35px rgba(2,45,41,.2)}
.mode-section{padding:clamp(3rem,7vw,6rem) 0}
.section-head{position:relative;border-bottom:4px solid var(--ut-ink);grid-template-columns:190px 1fr}
.section-head::after{content:"";position:absolute;left:0;bottom:-4px;width:110px;height:4px;background:var(--ut-orange)}
.section-head h2{font-size:clamp(2.5rem,5vw,4.8rem)}
.mode{grid-template-columns:78px minmax(0,1fr) 100px;min-height:112px;border-bottom-color:var(--ut-line);transition:background .18s ease,padding .18s ease}
.mode:hover{background:rgba(251,248,241,.76);padding-left:.8rem;padding-right:.8rem}
.mode-code{color:var(--ut-orange-dark)}
.mode h3{font-size:1.55rem}.mode p{color:var(--ut-ink-soft)}
.mode button{background:var(--ut-forest);border-color:var(--ut-forest);border-radius:4px}.mode button:hover,.mode button:focus-visible{background:var(--ut-forest-deep);border-color:var(--ut-orange)}
.principle-strip{background:linear-gradient(120deg,var(--ut-forest-deep),var(--ut-forest));border-top:8px solid var(--ut-orange);position:relative;overflow:hidden}
.principle-strip::after{content:"";position:absolute;right:-3%;bottom:-25%;width:260px;height:260px;background:url('/assets/brand/stripe-medallion.svg') center/contain no-repeat;opacity:.1}
.principle-strip>*{position:relative;z-index:1}
.limits h2{border-bottom-color:var(--ut-line)}

/* Live SJT */
.game-view{max-width:none;padding-top:0}
.game-head{
  position:relative;
  margin-left:calc((1240px - 100vw)/2);
  margin-right:calc((1240px - 100vw)/2);
  padding:1rem max(1rem,calc((100vw - 1240px)/2));
  color:white;
  background:linear-gradient(90deg,var(--ut-forest-deep),var(--ut-forest));
  border-bottom:0;
  overflow:hidden;
}
.game-head::after{content:"";position:absolute;right:0;top:0;width:35%;height:100%;background:url('/assets/brand/tiger-eye-hero.webp') center 48%/cover no-repeat;opacity:.28;mask-image:linear-gradient(90deg,transparent,#000 35%)}
.game-head>*{position:relative;z-index:1}
.game-head .eyebrow{color:#f4a276}.game-head h2{color:white}
.game-stats span{border-color:rgba(255,255,255,.55);background:rgba(2,45,41,.64)}.game-stats button{color:white}
.game-grid{gap:0;margin-top:2rem;box-shadow:var(--ut-shadow)}
.scenario-panel{background:linear-gradient(155deg,var(--ut-forest-deep),var(--ut-forest));top:96px;border-top:8px solid var(--ut-orange);min-height:580px}
.question-panel{background:var(--ut-paper-light);border-color:var(--ut-line);border-top:8px solid var(--ut-orange);min-height:580px}
.question-panel h3{font-size:clamp(1.65rem,3.2vw,2.7rem)}
.rating-option{border-color:var(--ut-line);padding:.95rem .7rem}.rating-option:has(input:checked){background:var(--ut-forest-soft);outline:1px solid var(--ut-forest)}
.clue-box,.feedback{background:var(--ut-paper);border-left-color:var(--ut-orange)}
.result-view>h1{font-size:clamp(3rem,7vw,6rem)}
.score-line{background:var(--ut-paper-light);border-color:var(--ut-ink);box-shadow:var(--ut-shadow)}
.score-line div{border-color:var(--ut-line)}.score-line span{color:var(--ut-orange-dark)}
.result-view section h2{border-color:var(--ut-line)}
.theme-row{background:var(--ut-paper-light);border-color:var(--ut-line)}
dialog{background:var(--ut-paper-light);border:1px solid var(--ut-ink);border-top:8px solid var(--ut-orange);border-radius:0;box-shadow:0 35px 90px rgba(2,45,41,.32)}
dialog::backdrop{background:rgba(2,45,41,.76)}

@media(max-width:1260px){.game-head{margin-left:-1rem;margin-right:-1rem;padding-left:1rem;padding-right:1rem}}
@media(max-width:820px){.hero{grid-template-columns:1fr}.hero::after{width:85%;height:48%;top:auto;bottom:-18%;opacity:.07}.game-head{margin-left:-1rem;margin-right:-1rem}.game-grid{gap:1rem;box-shadow:none}.scenario-panel{min-height:auto}.question-panel{min-height:auto}.section-head{grid-template-columns:1fr}}
@media(max-width:560px){.site-header{min-height:66px}.brand img{width:42px;height:42px}.hero{padding:1.4rem}.hero h1{font-size:clamp(2.8rem,14vw,4.4rem)}.mode{grid-template-columns:54px 1fr}.mode button{grid-column:2}.game-head{padding:.8rem;align-items:flex-start}.game-stats{width:100%}.game-grid{padding-top:1rem}.question-panel,.scenario-panel{padding:1rem}.game-actions{display:grid;grid-template-columns:1fr 1fr}.game-actions .primary{grid-column:1/3}}

/* v1.5.1 question-purpose labels */
.training-type{display:inline-block;width:max-content;border:1px solid currentColor;padding:.2rem .45rem;font-size:.68rem;line-height:1;text-transform:uppercase;letter-spacing:.08em;color:#d85b18;background:rgba(255,250,240,.68)}
.training-type[data-level="bridge"]{color:#063f39;background:rgba(219,233,228,.78)}
.training-type[data-level="ucat_style"]{color:#fffaf0;background:#063f39;border-color:#063f39}.mode .training-type{margin-bottom:.4rem}.game-kicker{display:flex;gap:.65rem;align-items:center;flex-wrap:wrap}.game-kicker .eyebrow{margin:0}

/* v1.5.3 flag and review */
.practice-style{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-top:1rem}.practice-style span{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em}.practice-style button{border:1px solid var(--line,#b9ad99);background:transparent;padding:.55rem .8rem}.practice-style button.active{background:var(--forest,#063f39);color:#fff}
.flagged{background:var(--orange,#d85b18)!important;color:#fff!important;border-color:var(--orange,#d85b18)!important}.exam-only[hidden]{display:none!important}
.review-view{max-width:1000px;margin:0 auto;padding:clamp(1.2rem,3vw,3rem)}.review-counts{display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid var(--line,#b9ad99);margin:1.2rem 0}.review-counts div{padding:1rem;border-right:1px solid var(--line,#b9ad99)}.review-counts div:last-child{border-right:0}.review-counts span{display:block;font-size:.75rem;text-transform:uppercase;letter-spacing:.08em}.review-counts strong{font-size:1.5rem}.review-filters{display:flex;gap:.5rem;flex-wrap:wrap}.review-filters .active{background:var(--forest,#063f39);color:#fff}.review-question-grid,.navigator-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(58px,1fr));gap:.6rem;margin:1rem 0}.review-question,.navigator-question{min-height:58px;border:1px solid var(--line,#b9ad99);background:#fff;font-weight:800;position:relative}.review-question[data-state~="answered"],.navigator-question[data-state~="answered"]{box-shadow:inset 0 -5px 0 #2d6b57}.review-question[data-state~="incomplete"],.navigator-question[data-state~="incomplete"]{box-shadow:inset 0 -5px 0 #a94335}.review-question[data-state~="flagged"],.navigator-question[data-state~="flagged"]{border-color:#d85b18;background:#f7e2d4}.review-question[data-state~="flagged"]::after,.navigator-question[data-state~="flagged"]::after{content:'⚑';position:absolute;right:.3rem;top:.12rem;color:#d85b18}.review-question[data-state~="current"],.navigator-question[data-state~="current"]{outline:3px solid #17201f}.rating-option.exam-selected{outline:3px solid #d85b18}.result-flag-note{border-left:4px solid #d85b18;padding-left:1rem}
@media(max-width:700px){.review-counts{grid-template-columns:repeat(2,1fr)}.review-counts div:nth-child(2){border-right:0}.game-actions{flex-wrap:wrap}.game-actions button{flex:1 1 auto}}