small{font-size:.8rem}
:root{--paper:#ece9df;--sheet:#f8f6ee;--ink:#191d20;--muted:#4e585f;--line:#aeb5b5;--red:#a6252a;--cyan:#006474;--yellow:#9b7b00;font:15px/1.5 "IBM Plex Mono","SFMono-Regular",Consolas,monospace;color:var(--ink);background:var(--paper);color-scheme:light}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html[data-large=yes]{font-size:18px}
body{margin:0;min-width:280px;background-color:var(--paper);background-image:linear-gradient(#85919416 1px,transparent 1px),linear-gradient(90deg,#85919416 1px,transparent 1px);background-size:28px 28px}
button,a,input{font:inherit}
button{color:inherit}
.skip{position:fixed;top:-5rem;left:1rem;background:var(--red);color:white;padding:.7rem 1rem;z-index:30}
.skip:focus{top:1rem}
header{height:70px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(.8rem,4vw,4rem);background:#ece9dfea;border-bottom:2px solid var(--ink);position:sticky;top:0;z-index:15;backdrop-filter:blur(12px)}
.brand{display:flex;align-items:center;gap:.7rem;border:0;background:none;letter-spacing:.1em;cursor:pointer}
.loom-mark{width:37px;height:37px;border:2px solid var(--ink);display:flex;justify-content:space-evenly;align-items:stretch;padding:4px;transform:rotate(3deg)}
.loom-mark i{border-left:2px solid var(--red)}
.loom-mark i:nth-child(2){border-color:var(--cyan)}
header>div{display:flex;align-items:center;gap:1rem;color:var(--muted);font-size:.8rem}
header>div button,.text-button{border:0;background:none;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.primary{border:2px solid var(--ink);background:var(--red);color:white;padding:.75rem 1rem;font-weight:900;cursor:pointer;box-shadow:4px 4px 0 var(--ink)}
.secondary{border:1px solid var(--ink);background:var(--sheet);padding:.65rem .85rem;cursor:pointer}
.primary:hover,.secondary:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--ink)}
button:focus-visible,a:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
button:disabled{opacity:.38;cursor:not-allowed;transform:none;box-shadow:none}
.eyebrow{font-size:.8rem;color:var(--cyan);font-weight:900;letter-spacing:.15em;text-transform:uppercase}
.hero{min-height:calc(100vh - 70px);display:grid;grid-template-columns:70px 1fr minmax(320px,.7fr);align-items:center;gap:5vw;padding:clamp(3rem,7vw,7rem) clamp(1rem,7vw,7rem)}
.hero-rule{order:-1;height:70vh;display:flex;justify-content:space-around}
.hero-rule span{display:block;border-left:2px solid var(--ink)}
.hero-rule span:nth-child(2){border-color:var(--red)}
.hero-rule span:nth-child(3){border-color:var(--cyan)}
.hero-copy h1{font:900 clamp(3.7rem,7.7vw,8rem)/.88 system-ui,sans-serif;letter-spacing:-.07em;margin:.5rem 0 1.7rem;max-width:12ch}
.hero-copy h1 em{font-family:Georgia,serif;font-weight:400;color:var(--red)}
.hero-copy>p:not(.eyebrow){font-family:system-ui,sans-serif;font-size:clamp(1rem,1.4vw,1.25rem);color:var(--muted);max-width:52rem}
.hero-actions{display:flex;gap:.7rem;flex-wrap:wrap;margin:2rem 0}
.hero-copy>small{color:var(--muted)}
.hero-case{position:relative;aspect-ratio:1;background:var(--sheet);border:2px solid var(--ink);box-shadow:15px 15px 0 var(--cyan);display:grid;place-items:center;transform:rotate(2deg)}
.thread-grid{position:absolute;inset:10%;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);border:1px solid var(--line)}
.thread-grid i{border:1px solid var(--line)}
.thread-grid i.cross:before,.thread-grid i.cross:after{content:"";position:absolute;width:10%;border-top:3px solid var(--ink);transform:rotate(45deg)}
.thread-grid i.cross:after{transform:rotate(-45deg)}
.red-thread{position:absolute;width:80%;height:60%;border:5px solid var(--red);border-left:0;clip-path:polygon(0 5%,100% 5%,100% 10%,10% 10%,10% 90%,100% 90%,100% 95%,0 95%)}
.hero-case>strong{font-size:5rem;z-index:2;background:var(--sheet);padding:.2rem}
.hero-case>span{position:absolute;bottom:13%;text-transform:uppercase;font-weight:900;font-size:.8rem}
.casework-dashboard{display:grid;grid-template-columns:1.2fr 1fr;gap:.7rem;padding:2rem clamp(1rem,7vw,7rem);border-top:2px solid var(--ink);background:var(--paper)}.casework-dashboard>div{border:1px solid var(--ink);background:var(--sheet);padding:.9rem}.casework-dashboard>div>span{display:block;font-size:.8rem;color:var(--cyan);font-weight:900;letter-spacing:.12em;text-transform:uppercase;margin-bottom:.65rem}.daily-drawer{display:grid;grid-template-columns:repeat(7,1fr);gap:.35rem}.daily-drawer button{border:1px solid var(--line);background:var(--paper);min-height:49px;padding:.3rem;display:grid;place-items:center}.daily-drawer button b{font-size:.8rem}.daily-drawer button span{color:var(--red);font-weight:900}.daily-drawer .complete{background:var(--cyan);color:white}.daily-drawer .complete span{color:white}.distinction-list{display:flex;gap:.35rem;flex-wrap:wrap}.distinction-list span{border:1px solid var(--line);padding:.35rem .5rem;font-size:.8rem;color:var(--muted)}.distinction-list .earned{background:var(--red);color:white;border-color:var(--red)}
.archive-zone{display:block;margin:-.4rem 0 .6rem;color:var(--muted);font-size:.8rem}.resume-case{margin:0 clamp(1rem,7vw,7rem) 2rem;border:2px solid var(--cyan);background:var(--sheet);padding:1rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;box-shadow:6px 6px 0 var(--cyan)}.resume-case>div:first-child{display:grid}.resume-case span{font-size:.8rem;color:var(--cyan);font-weight:900}.resume-case strong{font:900 1.15rem system-ui}.resume-case small{color:var(--muted)}.resume-case>div:last-child{display:flex;gap:.5rem}
.files{padding:6rem clamp(1rem,7vw,7rem);background:var(--sheet);border-top:2px solid var(--ink)}
.files-head{display:grid;grid-template-columns:1fr 1fr;align-items:end;margin-bottom:2rem}
.files-head h2{font:900 clamp(2.5rem,4vw,4.5rem)/1 system-ui;margin:.3rem 0;letter-spacing:-.05em}
.files-head>p{color:var(--muted)}
.file-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.65rem}
.chapter-tabs{display:flex;gap:.4rem;flex-wrap:wrap;margin:-1rem 0 1rem}.chapter-tabs span{border:1px solid var(--line);padding:.35rem .55rem;color:var(--cyan);font-size:.8rem;font-weight:900;text-transform:uppercase}
.file-card{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;text-align:left;background:var(--paper);border:1px solid var(--ink);padding:1rem;cursor:pointer}
.file-card:hover{box-shadow:inset 7px 0 var(--red)}
.file-card>span{font-size:1.8rem;color:var(--red);font-weight:900}
.file-card small{font-size:.8rem;color:var(--cyan);font-weight:900}
.file-card strong{display:block;font:800 1.2rem system-ui}
.file-card p{font-family:system-ui,sans-serif;font-size:.8rem;color:var(--muted);margin:.25rem 0}
.file-card em{font-size:.8rem;color:var(--red);font-style:normal}
.case{max-width:1900px;margin:auto;padding:1.5rem clamp(.5rem,2vw,2rem) 5rem}
.case-head{display:grid;grid-template-columns:auto 1fr auto;gap:1.4rem;align-items:start;margin-bottom:1rem}
.case-head h1{font:900 clamp(2.5rem,4vw,4.7rem)/1 system-ui;margin:.1rem 0;letter-spacing:-.055em}
.case-head p{color:var(--muted);margin:.3rem 0}
.unique-seal{width:90px;height:90px;border:3px double var(--cyan);border-radius:50%;display:grid;place-items:center;align-content:center;transform:rotate(6deg);text-align:center}
.unique-seal strong{font-size:1.6rem}
.unique-seal span{font-size:.8rem;text-transform:uppercase}
.desk{display:grid;grid-template-columns:minmax(240px,.55fr) minmax(500px,1.15fr) minmax(250px,.58fr);gap:.65rem;align-items:start}
.records,.matrix-work,.testimony{background:var(--sheet);border:1px solid var(--ink);padding:.8rem}
.records,.testimony{position:sticky;top:82px;max-height:calc(100vh - 94px);overflow:auto}
.panel-head{display:flex;align-items:center;gap:.65rem;border-bottom:2px solid var(--ink);padding-bottom:.6rem}
.panel-head>span{display:grid;place-items:center;width:36px;height:36px;background:var(--ink);color:white;font-size:1.2rem}
.panel-head small{font-size:.8rem;color:var(--cyan)}
.panel-head h2{font:800 1.1rem system-ui;margin:.1rem 0}
.records>p,.testimony>p{font-family:system-ui,sans-serif;color:var(--muted);font-size:.8rem}
.records ol{padding:0;list-style:none}
.records li{display:grid;grid-template-columns:auto 1fr;gap:.55rem;padding:.58rem 0;border-top:1px solid var(--line);font-family:system-ui,sans-serif;font-size:.8rem}
.records li b{color:var(--red);font-family:monospace}
.records li{display:block;padding:0}.records li button{width:100%;display:grid;grid-template-columns:auto 1fr;gap:.55rem;text-align:left;border:0;background:transparent;padding:.58rem;cursor:pointer}.records li button span{display:grid}.records li button small{font-size:.8rem;color:var(--cyan);font-weight:900;text-transform:uppercase}.records li.pinned button{background:#d9eced;box-shadow:inset 5px 0 var(--cyan)}.records li.focused button{outline:3px solid var(--yellow);outline-offset:-3px}.case-notebook{margin-top:.8rem;border-top:2px solid var(--ink);padding-top:.7rem}.case-notebook>div{display:flex;justify-content:space-between;font-size:.8rem;color:var(--cyan)}.case-notebook textarea{width:100%;resize:vertical;border:1px solid var(--line);background:var(--paper);padding:.6rem;margin-top:.45rem;font: .8rem/1.5 system-ui,sans-serif;color:var(--ink)}.case-notebook>small{display:block;font-size:.8rem;color:var(--muted);text-align:right}
.solver-proof{background:#d9eced;padding:.6rem;font-size:.8rem;color:#15545c}
.pencil{display:flex;align-items:center;gap:.45rem;margin-bottom:.7rem}
.pencil>span{font-size:.8rem;font-weight:900;margin-right:auto}
.pencil button{border:1px solid var(--ink);background:transparent;padding:.45rem .65rem;cursor:pointer}
.pencil button.active{background:var(--ink);color:white}
.pencil small{max-width:180px;font-size:.8rem;color:var(--muted)}
.logic-health{display:flex;justify-content:space-between;gap:.7rem;align-items:center;border:1px solid var(--cyan);background:#d9eced;padding:.5rem .65rem;margin-bottom:.7rem}.logic-health span{font-size:.8rem;color:var(--cyan);font-weight:900;text-transform:uppercase}.logic-health b{font-size:.8rem;text-align:right}.logic-health.conflict{border-color:var(--red);background:#f3dddd}.logic-health.conflict span,.logic-health.conflict b{color:var(--red)}
.matrix-panel{border:1px solid var(--ink);margin-bottom:.7rem}
.matrix-title{display:flex;justify-content:space-between;padding:.5rem;background:var(--ink);color:white}
.matrix-title span{font-weight:900}
.matrix-title small{font-size:.8rem;color:#c5d1d5}
.logic-grid{display:grid;grid-template-columns:minmax(86px,1fr) repeat(var(--size),minmax(44px,.7fr));background:var(--ink);gap:1px}
.corner,.column-label,.row-label,.cell{background:var(--sheet);min-width:0}
.column-label{height:82px;position:relative;overflow:hidden}
.column-label span{position:absolute;left:50%;bottom:5px;transform-origin:left bottom;transform:rotate(-52deg);white-space:nowrap;font-size:.8rem}
.row-label{display:flex;align-items:center;padding:.45rem;font-size:.8rem;font-weight:900}
.cell{border:0;min-height:52px;cursor:pointer;font-size:1.35rem;font-weight:900}
.cell:hover{background:#e0eef0}
.cell.no{color:var(--muted)}
.cell.yes{background:var(--cyan);color:white}
.matrix-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem}
.matrix-actions button{min-width:0;font-size:.8rem}
.account-list{display:grid;gap:.45rem}
.account{display:grid;grid-template-columns:auto 1fr;gap:.5rem;text-align:left;border:1px solid var(--line);background:var(--paper);padding:.6rem;cursor:pointer}
.account>span{grid-row:1/3;display:grid;place-items:center;width:38px;height:38px;background:var(--ink);color:white;border-radius:50%}
.account q{font-family:Georgia,serif;font-size:.8rem}
.account small{color:var(--muted)}
.account.selected{border:2px solid var(--red);box-shadow:inset 5px 0 var(--red)}
.submit-box{border-top:2px solid var(--ink);margin-top:.8rem;padding-top:.8rem}
.submit-box>div{display:flex;justify-content:space-between}
.submit-box span{font-size:.8rem;color:var(--muted)}
.submit-box .primary{width:100%;margin-top:.6rem}
.submit-box p{min-height:3em;font-size:.8rem;color:var(--red)}
.resolution{margin-top:2rem;border:2px solid var(--ink);background:var(--sheet);padding:clamp(1rem,3vw,3rem);box-shadow:10px 10px 0 var(--cyan)}
.resolution-head{display:flex;justify-content:space-between;gap:2rem;align-items:center}
.resolution-head h2{font:900 3.5rem system-ui;margin:.2rem 0}
.resolution-head p{max-width:60rem;font-family:system-ui,sans-serif}
.resolution-actions{display:grid;gap:.5rem;min-width:220px}.resolution-actions button{width:100%}.casework-summary{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem}.casework-summary span{border:1px solid var(--line);padding:.4rem .55rem;font-size:.8rem}.achievement-unlocks{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.8rem}.achievement-unlocks span{background:var(--cyan);color:#fff;padding:.4rem .55rem;font-size:.8rem;font-weight:900;text-transform:uppercase}
.woven-timeline{display:grid;grid-template-columns:repeat(4,1fr);margin:2rem 0}
.woven-timeline article{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;align-items:center}
.woven-timeline article>span{grid-column:1/-1;font-weight:900;color:var(--cyan)}
.woven-timeline article>i{width:100%;border-top:5px solid var(--red);position:relative}
.woven-timeline article>i:after{content:"";position:absolute;right:0;top:-9px;width:12px;height:12px;border-radius:50%;background:var(--ink)}
.woven-timeline article>div{padding:.7rem;display:grid}
.woven-timeline small{color:var(--muted)}
.woven-timeline b{font-size:.8rem;color:var(--red)}
.account-audit{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}
.account-audit>div{display:flex;align-items:center;gap:.6rem;border:1px solid var(--line);padding:.6rem}
.account-audit span{font-size:1.3rem;color:var(--cyan)}
.account-audit p{font-family:Georgia,serif}
.account-audit .frayed{border-color:var(--red)}
.account-audit .frayed span{color:var(--red)}
footer{display:flex;justify-content:space-between;padding:1.2rem clamp(1rem,4vw,4rem);border-top:2px solid var(--ink);font-size:.8rem}
footer nav{display:flex;gap:1rem}
footer a{color:var(--cyan)}
.legal{max-width:780px;margin:5rem auto;padding:0 1rem;background:var(--sheet);border:1px solid var(--ink);box-shadow:8px 8px 0 var(--cyan)}
.legal h1{font:900 4rem/1 system-ui}
.legal a{color:var(--cyan)}
.legal li{margin:.8rem 0}
.guide-page{max-width:980px;padding:clamp(2rem,6vw,5rem);margin-block:4rem}.guide-brand{text-decoration:none;color:var(--ink)}.guide-page>h1{font:900 clamp(3rem,7vw,6rem)/.9 system-ui;margin:.5rem 0 1.5rem;letter-spacing:-.06em}.guide-lede{font:1.08rem/1.6 system-ui,sans-serif;color:var(--muted);max-width:70ch}.guide-page>section{display:grid;grid-template-columns:150px 1fr;column-gap:1.2rem;border-top:1px solid var(--line);padding:1.4rem 0}.guide-page>section>span{grid-row:1/3;font-size:.8rem;color:var(--cyan);font-weight:900;text-transform:uppercase}.guide-page>section h2{font:900 1.35rem system-ui;margin:0}.guide-page>section p{font-family:system-ui,sans-serif;color:var(--muted);margin:.35rem 0}.guide-page>.guide-questions{display:grid;grid-template-columns:repeat(2,1fr);gap:.55rem}.guide-questions>h2{grid-column:1/-1}.guide-questions article{border:1px solid var(--line);padding:.85rem}.guide-questions h3{font:800 .95rem system-ui;margin:0}.guide-questions article p{font-size:.8rem}.guide-links{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.5rem}.guide-links a{min-height:46px;display:inline-flex;align-items:center;border:1px solid var(--ink);padding:0 .8rem;text-decoration:none}.guide-links a:first-child{background:var(--red);color:white;font-weight:900}
dialog{border:2px solid var(--ink);background:var(--sheet);max-width:430px;width:calc(100% - 2rem);padding:0;box-shadow:10px 10px 0 var(--red)}
dialog::backdrop{background:#1a1d20aa;backdrop-filter:blur(4px)}
dialog form{display:grid;gap:1rem;padding:1.2rem}
dialog label{display:flex;gap:.7rem}
.settings-status{min-height:2.8em;margin:0;color:var(--red);font-size:.8rem}
.dialog-head{display:flex;justify-content:space-between}
.dialog-head h2{margin:0}
.dialog-head button{border:0;background:none;font-size:2rem}
.danger{border:1px solid var(--red);color:var(--red);background:none;padding:.7rem}
html[data-contrast=yes]{--muted:#3e474d;--line:#727b7d}
html[data-motion=yes] *{scroll-behavior:auto!important;transition:none!important}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}
}

button{min-width:44px;min-height:44px}
header a,footer a{display:inline-flex;align-items:center;min-width:44px;min-height:44px}
dialog label,details>summary,.file-button{min-height:44px}
@media(max-width:1150px){.desk{grid-template-columns:1fr 1.4fr}
.records,.testimony{position:relative;top:auto;max-height:none}
.testimony{grid-column:1/-1}
.account-list{grid-template-columns:repeat(2,1fr)}
.matrix-actions{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:800px){.hero{grid-template-columns:25px 1fr}
.hero-case{grid-column:2;width:min(80vw,430px)}
.files-head{grid-template-columns:1fr}
.file-grid{grid-template-columns:1fr}
.desk{grid-template-columns:1fr}
.records,.testimony{grid-column:auto}
.case-head{grid-template-columns:1fr auto}
.case-head>button{grid-column:1/-1;justify-self:start}
.woven-timeline{grid-template-columns:repeat(2,1fr)}
.account-audit{grid-template-columns:1fr}
.casework-dashboard{grid-template-columns:1fr}
}
@media(max-width:560px){header{padding-inline:.5rem}
.brand b{font-size:.8rem}
header>div span{display:none}
.hero{padding:3rem .8rem;gap:.7rem}
.hero-copy h1{font-size:3.7rem}
.hero-rule{height:50vh}
.hero-case{width:90%;margin:auto}
.file-card{grid-template-columns:auto 1fr}
.file-card em{grid-column:2}
.case{padding-inline:.25rem}
.case-head h1{font-size:2.6rem}
.unique-seal{width:68px;height:68px}
.records,.matrix-work,.testimony{padding:.45rem}
.pencil{flex-wrap:wrap}
.pencil small{max-width:none;width:100%}
.logic-grid{grid-template-columns:minmax(65px,1fr) repeat(var(--size),minmax(38px,.7fr))}
.column-label{height:76px}
.column-label span{font-size:.8rem}
.row-label{font-size:.8rem}
.cell{min-height:46px}
.matrix-actions{grid-template-columns:1fr}
.daily-drawer{grid-template-columns:repeat(4,1fr)}
.account-list{grid-template-columns:1fr}
.resume-case{align-items:stretch;flex-direction:column;margin-inline:.8rem}.resume-case>div:last-child{display:grid;grid-template-columns:1fr 1fr}
.resolution-head{display:block}
.resolution-actions{margin-top:1rem}
.woven-timeline{grid-template-columns:1fr}
footer{display:grid;gap:.5rem}
.guide-page{margin:1rem .45rem;padding:1rem}.guide-page>section{grid-template-columns:1fr}.guide-page>section>span{grid-row:auto}.guide-page>.guide-questions{grid-template-columns:1fr}.guide-questions>h2{grid-column:auto}
}

/* Below 700px the shared player-experience sheet lays the hero out as blocks, so
   the decorative rail would push the heading most of a screen down. Collapse it
   to a short horizontal rule and let the copy lead. */
@media(max-width:700px){.hero-rule{height:auto;display:block;width:96px;border-top:2px solid var(--red);margin:1.4rem 0 .2rem}
.hero-rule span{display:none}
}

@media(pointer:coarse){button{min-height:44px}}

.dialog-head button{min-width:44px;min-height:44px;padding:0;display:grid;place-items:center}
@media(max-width:360px){
.case-head{grid-template-columns:minmax(0,1fr)}
.case-head>button,.case-head>div,.unique-seal{grid-column:1;min-width:0}
.unique-seal{justify-self:start}
}
footer{display:grid;grid-template-columns:minmax(0,1fr);justify-content:stretch;gap:18px}
.footer-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 14px;align-items:baseline}
.footer-row>span{display:flex;flex-wrap:wrap;gap:4px 14px;min-width:0}
.footer-row>span>a{margin-left:0}
.footer-row>nav{display:flex;flex-wrap:wrap;gap:4px 14px;min-width:0}
.more-games{display:block;min-width:0}
.more-games h2{font-size:1rem;margin:0 0 4px;font-weight:800}
.more-games>p{margin:0 0 10px;max-width:72ch}
.more-games ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:2px 18px}
.more-games li{display:grid;align-content:center;min-height:44px;padding:4px 0}
.more-games li a{margin-left:0;font-weight:800;text-decoration:none}
.more-games li a:hover,.more-games li a:focus-visible{text-decoration:underline}
.more-games li small{opacity:.85}
.static-intro{max-width:70ch;padding:clamp(1.4rem,4vw,3rem) clamp(1rem,4vw,4rem)}
.static-intro h1{font-size:clamp(1.6rem,4vw,2.6rem);line-height:1.15;margin:0 0 1rem}
.static-intro p{margin:0 0 .9rem}
.first-run{border:2px solid var(--cyan);border-left-width:6px;background:var(--sheet);padding:1rem 1.1rem;margin:0 clamp(1rem,4vw,4rem) 1.4rem;max-width:72ch}
.first-run b{display:block;color:var(--red);margin-bottom:.4rem}
.first-run ol{margin:0 0 .6rem;padding-left:1.3rem}
.first-run li{margin:.25rem 0}
.first-run p{margin:0}
.best-line{margin:.6rem 0 0;font-weight:700}
.casework-record{border:1px solid var(--line);background:var(--sheet);padding:12px 16px;margin:0 0 22px}
.casework-record>summary{min-height:44px;display:flex;align-items:center;gap:10px;cursor:pointer;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:0.8rem}
.casework-record>summary span{font-weight:400;letter-spacing:0;text-transform:none;color:var(--muted)}
.casework-record ol{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}
.casework-record li{display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:12px;align-items:center;padding:9px 10px;border:1px solid var(--line);min-width:0}
.casework-record li>span{font-size:1.1rem;text-align:center}
.casework-record li b,.casework-record li small{display:block;overflow-wrap:anywhere}
.casework-record li small{color:var(--muted);font-size:0.8rem}
.casework-record li em{font-style:normal;font-weight:700;text-align:right;white-space:nowrap}
.casework-record li em small{font-weight:400}
.record-empty{margin:12px 0 0;color:var(--muted)}
.shortcuts-dialog dl{display:grid;gap:2px;margin:14px 0 12px}
.shortcuts-dialog dl div{display:grid;grid-template-columns:minmax(120px,.55fr) minmax(0,1fr);gap:12px;align-items:baseline;padding:8px 0;border-bottom:1px solid var(--line)}
.shortcuts-dialog dt{font-weight:700;color:var(--cyan)}
.shortcuts-dialog dd{margin:0;color:var(--muted)}
@media(max-width:640px){.casework-record li{grid-template-columns:28px minmax(0,1fr)}.casework-record li em{grid-column:1/-1;text-align:left}}

.update-prompt{position:fixed;z-index:40;right:16px;bottom:16px;max-width:min(340px,calc(100vw - 32px));display:flex;flex-direction:column;gap:10px;padding:14px 16px;border:1px solid var(--line);border-radius:2px;background:var(--sheet);color:var(--ink);box-shadow:0 14px 40px rgba(0,0,0,.3)}
.update-prompt-text{margin:0;font-size:.875rem;line-height:1.45}
.update-prompt-actions{display:flex;flex-wrap:wrap;gap:8px}
.update-prompt button{min-width:44px;min-height:44px;padding:0 16px;border-radius:2px;font:inherit;font-size:.875rem;cursor:pointer}
.update-prompt-reload{border:1px solid transparent;background:var(--cyan);color:#f8f6ee;font-weight:700}
.update-prompt-dismiss{border:1px solid var(--line);background:transparent;color:inherit}
@media(prefers-reduced-motion:no-preference){.update-prompt{animation:update-prompt-in .18s ease-out}
@keyframes update-prompt-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
}
@media(max-width:560px){.update-prompt{left:12px;right:12px;bottom:84px;max-width:none}}

.mark-legend{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 10px;padding:8px 10px;border:1px solid var(--line);font-size:0.8rem}
.mark-legend>span:first-child{font-weight:800;letter-spacing:.12em;font-size:0.8rem}
.mark-legend b{font-style:normal;margin-right:4px}
.why-panel{margin:10px 0 0;padding:9px 11px;border-left:3px solid var(--red);background:rgba(166,37,42,.07);font-size:0.85rem;min-height:44px}
.drawer-sort{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:12px 0;font-size:0.85rem}
.drawer-sort select{min-height:44px;padding:0 10px;font:inherit}
.difficulty-tag{font-weight:800}
.daily-drawer button small{display:block;font-size:0.8rem}
.score-par{margin:2px 0 0;font-size:0.8rem;text-transform:uppercase;letter-spacing:.08em}
.next-step{margin:6px 0 0;font-size:0.9rem;max-width:70ch}
.share-preview{margin-top:12px;padding:10px 12px;border:1px solid var(--line)}
.share-preview span{display:block;font-size:0.8rem;text-transform:uppercase;letter-spacing:.12em}
.share-preview p{margin:4px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:0.85rem}
#share-button[data-copied=yes]{background:#2f4b31;color:#f4f1e8}

/* Play screen in one view: a compact case line; the two grids side by side (desktop) or stacked (phone) with the
   pencil above them; the records and the accounts in their own scrolling panels beside (desktop) or after
   (phone) the grids. */
.case{padding-top:.5rem!important;padding-bottom:1.5rem!important}
.case-head{margin-bottom:.5rem;align-items:center;gap:1rem}
.case-head h1{font-size:clamp(1.6rem,2.8vw,2.4rem)}
.case-head>*{min-width:0}
.unique-seal{width:64px;height:64px}
.unique-seal strong{font-size:1.1rem}
.unique-seal span{font-size:.5625rem}
.brief-more{display:none}
.pencil{margin-bottom:.4rem}
.pencil button{min-height:44px}
.mark-legend,.logic-health{margin-bottom:.4rem!important;padding-block:.3rem!important}
.matrix-title{padding:.3rem .5rem}
.column-label{height:58px}
.column-label span{transform:rotate(-40deg);font-size:.75rem}
.cell{min-height:44px}
.row-label{padding:.2rem .45rem}
.matrix-actions button{min-height:44px}
@media(min-width:1151px){
.desk{grid-template-columns:minmax(220px,.5fr) minmax(560px,1.3fr) minmax(240px,.55fr)}
.records,.testimony{top:auto;max-height:var(--ux-fit-h,calc(100vh - 94px))}
.matrix-work{display:grid;grid-template-columns:1fr 1fr;column-gap:.6rem;align-items:start;padding:.6rem}
.matrix-work>*{grid-column:1/-1}
.matrix-work>.matrix-panel{grid-column:auto;margin-bottom:.5rem}
.matrix-work>.mark-legend{grid-column:1}
.matrix-work>.logic-health{grid-column:2}
.matrix-actions{grid-template-columns:repeat(4,1fr)}
.logic-grid{grid-template-columns:minmax(60px,1fr) repeat(var(--size),minmax(44px,1fr))}
.pencil small{font-size:.75rem}
.testimony>p{font-size:.75rem;margin:.3rem 0}
.account-list>*{min-height:48px;padding-block:.3rem!important}
.submit-box{margin-top:.4rem;padding-top:.4rem}
.submit-box p{min-height:0}
}
@media(max-width:1150px){
.desk{display:flex!important;flex-direction:column}
.matrix-work{order:1}
.records{order:2}
.testimony{order:3}
}
@media(max-width:800px){
.case-head{grid-template-columns:auto 1fr!important;gap:.25rem .6rem;position:relative}
.case-head>button{grid-column:1!important;grid-row:1}
.case-head>.unique-seal{grid-column:2;grid-row:1;justify-self:end;width:auto;height:auto;border-radius:.5rem;transform:none;display:flex;gap:.3rem;align-items:baseline;padding:.15rem .5rem}
.case-head>div:not(.unique-seal){grid-column:1/-1;grid-row:2}
.case-head .eyebrow{display:none}
.case-head h1{font-size:1.35rem}
.case-head .case-brief{font-size:.75rem;line-height:1.35;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;margin:0}
.case.brief-open .case-head .case-brief{display:block}
.brief-more{display:inline-flex;position:absolute;top:0;left:150px;align-items:center;min-height:44px;padding:0 .2rem;border:0;background:none;font:700 .75rem/1 inherit;text-decoration:underline;text-underline-offset:3px;color:inherit;cursor:pointer}
.matrix-work{padding:.4rem}
.pencil{flex-wrap:nowrap}
.pencil small{display:none}
.mark-legend{display:none!important}
.logic-health{display:none!important}
.matrix-panel{margin-bottom:.4rem}
.logic-grid{grid-template-columns:minmax(70px,1fr) repeat(var(--size),minmax(44px,1fr))}
.column-label{height:48px}
.column-label span{font-size:.6875rem;transform:rotate(-30deg)}
.matrix-actions{grid-template-columns:repeat(4,1fr)!important}
.matrix-actions button{font-size:.6875rem;padding:.2rem}
}