/* Presentation layer: no external fonts, services or build step. */
:root { --ground:#f3f5f4; --ink:#193332; --ink-soft:#526762; --radius:10px; --rule:#d9e3de; --shadow:0 3px 16px #19333206; }
.panel { border-radius:var(--radius); }
a:focus-visible, button:focus-visible { outline:3px solid #cf8d39; outline-offset:4px; }
.masthead { padding:1rem 1.6rem; }
.masthead__wordmark { letter-spacing:.08em; }
.eyebrow { font-size:.7rem; font-weight:700; letter-spacing:.16em; line-height:1.6; color:var(--live); }
.session-welcome { padding:clamp(1.6rem,5vw,4rem); border-radius:14px; margin-bottom:1.8rem; background:linear-gradient(115deg,#163f3b,#20594e); color:#fff; position:relative; overflow:hidden; }
.session-welcome::after { content:""; position:absolute; right:-5rem; top:-7rem; width:25rem; height:25rem; border:1px solid #ffffff18; border-radius:50%; box-shadow:0 0 0 4rem #ffffff05,0 0 0 8rem #ffffff04; pointer-events:none; }
.session-welcome .eyebrow { color:#bce7d4; }
.session-welcome h1 { font-size:clamp(1.8rem,4.5vw,3.4rem); line-height:1.14; max-width:22ch; margin:.9rem 0 1.2rem; letter-spacing:-.04em; position:relative; z-index:1; }
.session-welcome>p:last-child { max-width:60ch; color:#d5e7df; position:relative; z-index:1; }
.section-heading { display:flex; justify-content:space-between; align-items:baseline; gap:1rem; flex-wrap:wrap; margin-bottom:1rem; }
.section-heading h2 { font-size:1.05rem; }
.section-heading>span { font-size:.8rem; color:var(--ink-soft); }
.session-total { border:1px solid var(--rule); border-radius:30px; padding:.25rem .7rem; }
.session-library { background:transparent; box-shadow:none; border:0; padding:0; }
.session-library .card { border-radius:12px; overflow:hidden; background:#fff; transition:border-color .15s,box-shadow .15s; }
.session-library .card:hover { border-color:#7ba897; box-shadow:0 8px 26px #163f3b0d; }
.session-library .card__hit { padding:1.5rem; }
.session-library .card__title { font-size:1.2rem; line-height:1.35; }
.session-library .card__problem { color:var(--ink-soft); }
.session-card-footer { display:flex; justify-content:space-between; padding-top:1rem; margin-top:1.3rem; border-top:1px solid var(--rule-soft); color:var(--live); font-weight:600; font-size:.85rem; }
.play-heading { display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; margin:.5rem 0 1.5rem; }
.play-heading h1 { font-size:clamp(1.35rem,3vw,2rem); line-height:1.25; }
.team-pill { border:1px solid #bfcec5; border-radius:30px; background:#fff; padding:.45rem .9rem; font-size:.8rem; }
.play-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(210px,.44fr); gap:2rem; padding:clamp(1.3rem,3vw,2.4rem); border-top:4px solid var(--live); }
.play-hero__body { min-width:0; }
.play-hero .panel__title { font-size:clamp(1.5rem,3vw,2.35rem); line-height:1.2; margin:.5rem 0 1rem; letter-spacing:-.03em; }
#play-guidance { max-width:60ch; color:var(--ink-soft); margin-bottom:1.5rem; }
#play-message { background:#f1f6f3; border-radius:0 8px 8px 0; margin-bottom:1.5rem; }
.play-primary { background:#175448; color:#fff; border-color:#175448; padding:.8rem 1.2rem; border-radius:7px; font-weight:600; }
.play-primary:hover { background:#123e36; color:#fff; }
.play-clock-card { padding:1.6rem; background:#f1f6f3; border:1px solid #dce7df; border-radius:10px; align-self:start; }
#play-clock { display:block; font-size:clamp(1.3rem,2.8vw,2.3rem); line-height:1.3; font-variant-numeric:tabular-nums; letter-spacing:-.03em; overflow-wrap:anywhere; margin:1rem 0; }
#play-receipt { font-size:.8rem; line-height:1.55; border-top:1px solid #d7e2da; padding-top:1rem; color:var(--ink-soft); }
.play-hero__status { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; border-top:1px solid var(--rule-soft); padding-top:1rem; }
.play-hero__status .panel__note { margin:0; font-size:.76rem; }
.play-hero[data-state="paused"] { border-top-color:#bc862d; }
.play-hero[data-state="paused"] .play-clock-card { background:#fbf6ea; border-color:#eadab8; }
.play-hero[data-state="unavailable"],.play-hero[data-state="expired"] { border-top-color:#a96743; }
.play-resources { margin-top:2rem; }
.resource-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.resource-card { display:flex; flex-direction:column; gap:.7rem; background:#fff; border:1px solid var(--rule); border-radius:10px; padding:1.5rem; text-decoration:none; }
.resource-card:hover { border-color:#7ba897; background:#fbfdfb; }
.resource-number { font-size:.66rem; letter-spacing:.12em; font-weight:700; color:var(--ink-soft); }
.resource-card h3 { font-size:1.02rem; }
.resource-card p { color:var(--ink-soft); font-size:.86rem; line-height:1.6; }
.resource-link { margin-top:auto; font-size:.8rem; font-weight:600; color:var(--live); }
@media(max-width:900px) { .play-hero { gap:1.3rem; } .resource-grid { grid-template-columns:1fr; } .resource-card { padding:1.2rem; } }
@media(max-width:600px) { .play-hero { grid-template-columns:1fr; } .play-clock-card { padding:1.1rem; } .play-heading { align-items:start; } .session-welcome { padding:1.5rem; } .masthead { padding:.9rem; } }
@media(prefers-reduced-motion:reduce) { .session-library .card { transition:none; } }
/* Workshop navigation and compact controls. */
.process-toggle { display:none; }
.player-type { display:inline-flex; align-items:center; padding:.2rem .55rem; border:1px solid #a7cfc5; border-radius:6px; background:#e8f4ef; color:#155543; font-size:.7rem; font-weight:750; letter-spacing:.035em; text-transform:uppercase; white-space:normal; }
.teamlink { flex-wrap:wrap; }
.grid:has(> .entry--decision),.grid:has(> .entry--reaction) { grid-template-columns:1fr; gap:.6rem; }
.entry--open { padding:.9rem 1rem; }
.entry--open .lede { font-size:.95rem; margin:.55rem 0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.entry--open .meters { display:none; }
.entry--open .entry__foot { padding-top:.55rem; margin-top:.55rem; }
.record-details > summary { cursor:pointer; font-size:.85rem; color:#175c49; padding:.65rem 0; font-weight:650; }
.rec__grid { padding-top:.8rem; }
.rec { margin-bottom:.75rem; }
.picker { min-width:0; }
.picker__toggle { width:100%; text-align:left; gap:.5rem; min-height:44px; }
.picker__toggle > span:first-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.picker__list { max-height:260px; overflow-y:auto; grid-template-columns:1fr; }
.pick { padding:.55rem .65rem; min-height:42px; }
.pick__note { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.toolbar .picker { min-width:150px; flex:1; max-width:320px; position:relative; }
.toolbar .picker__body { position:absolute; z-index:25; top:100%; left:0; min-width:100%; width:300px; max-width:85vw; background:var(--paper); box-shadow:0 10px 24px #1232; border:1px solid var(--rule); border-radius:8px; }
.formsec { padding:1.2rem; border-radius:12px; }
.field__input { min-height:44px; }
.card { padding:1rem 1.15rem; }
.card__problem { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.panel { border-radius:12px; }
.prose { max-width:78ch; line-height:1.65; }
.report-paper { background:white; border:1px solid var(--rule); border-radius:14px; padding:clamp(1rem,4vw,3rem); max-width:960px; margin:1rem auto; line-height:1.65; overflow-wrap:anywhere; }
.report-paper h1,.report-paper h2,.report-paper h3 { color:#174d40; line-height:1.2; }
.report-paper h2 { margin-top:2rem; padding-bottom:.6rem; border-bottom:1px solid #dbe8e1; }
.report-paper li { margin:.3rem 0; }
.report-paper table { width:100%; border-collapse:collapse; display:block; overflow-x:auto; }
.report-paper td,.report-paper th { border:1px solid #dbe8e1; padding:.55rem; }
.report-editor { min-height:450px; outline-offset:5px; }
.editor-tools { display:flex; flex-wrap:wrap; gap:.4rem; position:sticky; top:0; z-index:3; background:var(--paper); padding:.65rem; border:1px solid var(--rule); border-radius:10px; }
.report-actions { display:flex; gap:.65rem; align-items:center; flex-wrap:wrap; margin:1rem 0; }
.report-meta { color:var(--ink-soft); font-size:.85rem; }
@media(min-width:901px) {
  body:has(.process) .masthead { margin-left:14.5rem; }
  body:has(.process) .frame { margin-left:14.5rem; max-width:none; display:block; }
  .process { position:fixed; inset:0 auto 0 0; width:14.5rem; height:100dvh; z-index:20; padding-top:1.6rem; }
  .process__hit { min-height:54px; }
  .process__track { display:flex; flex-direction:column; justify-content:space-evenly; }
}
@media(max-width:900px) {
  .rec__head { flex-wrap:wrap; gap:.55rem; }
  .rec__title { flex:1 0 100%; }
  .frame { display:block; }
  .process-toggle { display:flex; justify-content:space-between; width:100%; position:sticky; top:0; z-index:21; padding:.9rem 1rem; background:#174d40; color:white; border:0; font:inherit; font-weight:650; cursor:pointer; }
  .process { display:none; position:relative; inset:auto; width:100%; height:auto; padding:.75rem; }
  .process.is-open { display:block; }
  .process__track { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:auto; min-width:0; overflow:visible; gap:.3rem; }
  .process__step::before,.process__done,.process__cap { display:none; }
  .process__hit { min-height:52px; }
  .process__verb { display:none; }
  .shell { padding:1rem; }
}
@media print { .process-toggle,.editor-tools,.report-actions { display:none!important; } body:has(.process) .masthead,body:has(.process) .frame { margin-left:0; } .report-paper { border:0; padding:0; max-width:none; } }
.btn--open { min-height:42px; display:inline-flex; align-items:center; justify-content:center; padding:.65rem 1rem; border-radius:9px; text-decoration:none; white-space:nowrap; font-weight:700; box-shadow:0 3px 8px #173e4020; }
.entry--open .entry__link { position:relative; z-index:2; color:white; }
.tag--market { background:#e9eefb; color:#364c85; border:1px solid #cfdaee; }
.strategy-list { display:grid; gap:.8rem; }
.strategy-card { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:1.5rem; background:#fff; padding:1.4rem; border:1px solid var(--rule); border-radius:14px; }
.strategy-card h2 { font-size:1.2rem; margin:.65rem 0; }
.strategy-card h2 a { color:var(--ink); text-decoration:none; }
.strategy-card p { color:var(--ink-soft); margin:.5rem 0; max-width:85ch; }
.record-meta { display:flex; gap:1rem; flex-wrap:wrap; font-size:.8rem; color:var(--ink-soft); }
.detail-hero { padding:1.8rem 2rem; background:linear-gradient(120deg,#153e36,#23685a); border-radius:16px; color:white; margin-bottom:1.4rem; }
.detail-hero h1 { font-size:clamp(1.6rem,3vw,2.5rem); line-height:1.2; max-width:28ch; }
.detail-hero .eyebrow { color:#c0dcd3; }
.detail-hero .btn { background:#fff; color:#174d40; border-color:#fff; }
.detail-hero .prio { background:#fff; padding:.3rem .5rem; border-radius:5px; }
.detail-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(260px,1fr); gap:1.3rem; }
.detail-layout aside .panel { position:sticky; top:1rem; }
.key-metrics { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin:1.1rem 0; }
.key-metrics > div { padding:1rem; background:#edf5f1; border-radius:10px; }
.key-metrics span,.key-metrics strong { display:block; }
.key-metrics strong { font-size:1.7rem; color:#17614b; }
.linked-records { display:grid; gap:.75rem; }
.linked-record { display:grid; gap:.4rem; padding:1rem; border:1px solid var(--rule); border-radius:10px; text-decoration:none; color:inherit; }
.linked-record:hover { background:#f1f8f5; border-color:#83b5a4; }
.linked-record span { color:var(--ink-soft); font-size:.78rem; }
.linked-record b { color:#17614b; font-size:.8rem; }
.table--action-focus { min-width:1000px; table-layout:auto; }
.table--action-focus th:first-child { width:36%; min-width:310px; }
.action-title { display:block; color:var(--ink); font-size:1.05rem; line-height:1.4; margin-bottom:.5rem; }
.score-explainer { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin:1rem 0; }
.score-explainer > div { padding:1.2rem; border-radius:12px; background:#e9f2ee; }
.score-explainer h2 { font-size:1.1rem; margin:0 0 .6rem; }
.score-explainer p { line-height:1.6; margin:0; }
.learning-editor > summary { width:max-content; max-width:100%; cursor:pointer; }
.learning-editor[open] > summary { margin-bottom:1.2rem; }
.page-loading { position:fixed; z-index:80; inset:0; background:#f3f5f4f5; padding:clamp(1rem,5vw,4rem); overflow:hidden; }
.page-loading[hidden] { display:none; }
.loading-message { color:#466459; font-size:.9rem; margin-bottom:1.5rem; }
.skeleton { background:linear-gradient(100deg,#e0e6e3 20%,#eff3f1 45%,#e0e6e3 70%); background-size:220% 100%; animation:skeleton-shimmer 1.5s ease-in-out infinite; border-radius:12px; margin-bottom:1rem; }
.skeleton--title { height:48px; width:55%; }.skeleton--filters { height:50px; width:85%; }.skeleton--card { height:135px; width:100%; }
@keyframes skeleton-shimmer { from {background-position:100% 0;} to {background-position:-100% 0;} }
@media(prefers-reduced-motion:reduce) { .skeleton {animation:none;} }
@media(max-width:900px) { .detail-layout,.score-explainer {grid-template-columns:1fr;} .strategy-card {grid-template-columns:1fr;gap:.8rem;} .strategy-card .btn--open {justify-self:start;} .detail-hero {padding:1.3rem;} }
/* Editorial report: a cover-like opening, restrained gold details and generous reading rhythm. */
.report-paper { border:0; border-top:7px solid #b99050; border-radius:3px 3px 16px 16px; box-shadow:0 15px 55px #163e3514; padding:clamp(1.4rem,5vw,4rem); font-size:1rem; line-height:1.8; }
.report-paper > h1:first-child { font-family:Georgia,serif; font-size:clamp(2rem,4vw,3.5rem); letter-spacing:-.035em; margin:0 0 .6rem; max-width:20ch; padding-top:.5rem; }
.report-paper > h1:first-child + p { text-transform:uppercase; letter-spacing:.18em; font-size:.73rem; color:#8c6c33; margin-bottom:2rem; }
.report-paper > h2 { font-family:Georgia,serif; font-weight:500; font-size:1.8rem; margin-top:2.8rem; border-bottom:1px solid #d7c6a7; padding-bottom:.7rem; }
.report-paper h3 { font-size:1.1rem; margin-top:1.7rem; }
.report-paper ul,.report-paper ol { padding-left:1.3rem; }
.report-paper li::marker { color:#a58040; }
.report-paper strong { color:#194c3f; }
.report-paper blockquote { margin:1.5rem 0; padding:1.2rem 1.5rem; background:#eef5f0; border-left:4px solid #b99050; font-size:1.1rem; }
.report-paper tr:nth-child(even) { background:#f5f8f6; }
@media print { .page-loading {display:none!important;} .report-paper {box-shadow:none;border-top:4px solid #b99050;} .report-paper h2,.report-paper h3 {break-after:avoid;} .report-paper li,.report-paper tr {break-inside:avoid;} .detail-layout {display:block;} }