/* v0.33 — carved stone, stitched folios and restrained bronze. */
dialog{--folio-edge:#a9946a;--folio-ink:#e5d8b9;background:linear-gradient(120deg,#202b2cf5,#0e1820fa),url('materials/cloudstone-floor.jpg') center/650px;border-color:#9a886b;box-shadow:inset 0 0 0 4px #0b131a,inset 0 0 0 5px #a9976640,3px 5px 0 #383a30,5px 8px 0 #050b10,0 30px 100px #000c;color:#d2d8d2}
dialog>.modal-head{background:linear-gradient(105deg,#202c2e,#101d24);border-bottom-color:#aa936855}.modal-head h2{color:#e7d7b7}.modal-head button[data-act=close]{background:#101b22;border-color:#92815f55;min-height:36px}
.hall-mark{width:68px;height:68px;fill:none;stroke:#b6a076;stroke-width:1.2;flex:none;filter:drop-shadow(1px 2px 1px #0008)}
.folio-intro{display:flex;justify-content:space-between;align-items:center;gap:24px;border-bottom:1px solid #a693663b;margin-bottom:26px;padding:5px 0 26px}.folio-intro .eyebrow{font:10px/1.5 var(--ui-font);letter-spacing:3px;color:#b6a17a;margin:0 0 12px}.folio-intro h3{font:400 clamp(23px,2.5vw,31px)/1.5 var(--display-font);letter-spacing:1px;margin:0 0 12px;color:#e4d6b7}.folio-intro p{font-size:12px;color:#a6b5b4;line-height:1.8;margin:0;max-width:560px}
.manual-modal{width:min(1160px,calc(100vw - 40px))}.rules.rulebook{display:grid;grid-template-columns:185px minmax(0,1fr);gap:35px;max-width:none;margin:0;padding:2px 3px 15px;min-height:540px}.rule-nav{border-right:1px solid #a8926045;padding-right:18px;display:flex;flex-direction:column;gap:7px;align-self:start;position:sticky;top:74px}.rule-nav button{display:flex;align-items:center;gap:12px;text-align:left;border:0;border-left:2px solid transparent;border-radius:0;background:none;box-shadow:none;padding:13px 10px;min-height:43px;font:12px/1.5 var(--ui-font);color:#a4b1b0}.rule-nav button span{font:10px Georgia;color:#8e8b72}.rule-nav button[aria-selected=true]{border-left-color:#d0b57c;background:linear-gradient(90deg,#bc9c6021,transparent);color:#ecd8b1}.rule-nav button:hover{background:#bbad8820}.rule-pages{min-width:0}.rules .rule-pages>section{padding:3px 0 20px;border:0;background:none;box-shadow:none;margin:0}.rule-pages>[hidden]{display:none!important}.rule-pages>section:focus-visible{outline:1px solid #a9956b;outline-offset:4px}.rules .rule-pages h3{font-weight:400;line-height:1.55}.rules .rule-pages>section>p{font-size:14px;line-height:2.15;color:#c1cbc7;max-width:720px}.rules .rule-pages>section>h3{padding:15px 0 22px;border-bottom:1px solid #a894673b;margin:0 0 25px;font-size:25px}.rules .rule-pages h4{font:10px/1.5 var(--ui-font);letter-spacing:2px;color:#bca781;margin:24px 0 13px}.rules .rule-pages .folio-intro{margin-bottom:20px}.rules .rule-pages .folio-intro h3{padding:0;border:0;font-size:29px}
.mode-comparison{display:grid;grid-template-columns:1fr 1fr;border-block:1px solid #b39a6155;background:linear-gradient(100deg,#3340394a,#0b1721a0)}.mode-comparison>div{padding:19px 25px}.mode-comparison>div+div{border-left:1px solid #aa966046}.mode-comparison small{display:block;color:#b9b9a5;font-size:11px;margin-bottom:10px}.mode-comparison strong{font:36px/1.1 Georgia;color:#e6d1a5;font-weight:400}.mode-comparison strong span{font:11px var(--ui-font);margin-left:6px;color:#b4b8ab}.mode-comparison p{font-size:11px;margin:10px 0 0;color:#a3b6b1}.combat-reference{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.combat-reference article{border-top:1px solid #b6a37966;padding-top:12px;background:none}.combat-reference article>div{display:flex;gap:10px;align-items:center;min-height:46px}.combat-reference b{font:12px var(--ui-font);color:#eadab8;border:1px solid #ae986859;box-shadow:2px 2px #060e14;padding:8px 7px;background:#273634}.combat-reference .defense-marker{border-style:double;border-width:3px;padding:6px 7px;background:#263442}.combat-reference .hidden-marker{background:repeating-linear-gradient(45deg,#253329,#253329 3px,#29372d 4px)}.combat-reference i{font:italic 11px Georgia;color:#8c9c99}.combat-reference p{font-size:11px;line-height:1.8;color:#aab8b5}
.lesson-modal{width:min(1160px,calc(100vw - 40px))}.lesson-hall .tutorial-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;padding:4px 4px 15px}.tutorial-list .lesson-leaf{padding:0;background:linear-gradient(125deg,#283530,#121d22);border:1px solid #96856566;border-top:1px solid #96856566;box-shadow:3px 4px #383b30,5px 7px #071018,0 15px 22px #0006;display:flex;flex-direction:column;overflow:hidden}.tutorial-list .lesson-leaf::before{display:none}.lesson-picture{height:195px;position:relative;overflow:hidden;border-bottom:1px solid #b6a57944;background:#0d161d}.lesson-picture img{width:100%;height:100%;object-fit:cover;object-position:center top;filter:saturate(.8)}.lesson-picture::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 50%,#142025c7)}.lesson-number{position:absolute;right:18px;bottom:12px;z-index:1;border:1px solid #cbb99275;padding:6px;color:#e6d3a9;background:#1e2b28d9;font:23px var(--display-font);writing-mode:vertical-rl}.lesson-copy{padding:22px;display:flex;flex-direction:column;flex:1}.lesson-copy .lesson-state{font:10px var(--ui-font);letter-spacing:1px;color:#a4b7b0}.lesson-leaf.is-complete .lesson-state{color:#cbb37e}.lesson-copy>strong{display:block;font:400 21px/1.5 var(--display-font);color:#e5d5b2;margin:12px 0}.lesson-copy p{font-size:12px;line-height:1.8;color:#a8b8b5;margin:0 0 25px;flex:1}.lesson-copy button{min-height:41px;width:100%;font-size:12px}
.settings-modal{width:min(1010px,calc(100vw - 40px))}.settings-modal .settings-panel{width:100%;max-width:none;margin:0;padding:4px 8px 16px}.settings-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:45px}.settings-group>h3{font:13px var(--ui-font);letter-spacing:1px;color:#ceb990;margin:0 0 12px}.settings-group label{padding:21px 0;gap:20px;align-items:center;border-bottom:1px solid #a6926340}.settings-group label>span{display:grid;gap:8px}.settings-group label b{font-size:13px;font-weight:500;color:#d4dacf}.settings-group label small{font-size:11px;color:#95aaa7;line-height:1.7;max-width:280px}.settings-group input[type=checkbox]{width:48px;height:26px;min-width:48px}.settings-group input[type=range]{flex:1;min-width:70px;max-width:230px;background:transparent}.settings-group label.volume-row>span{min-width:70px}.volume-row output{color:#cfb986;font:13px Georgia}.settings-group>[data-act=test-audio]{margin:14px 0 4px;min-height:36px;font-size:11px}.progress-vault{position:relative;border:1px solid #9a896452;background:linear-gradient(135deg,#28312bdd,#0e1d25e8),url('materials/cloudstone-floor.jpg') center/cover;box-shadow:inset 0 0 0 4px #101b21,3px 4px #33372d,5px 7px #071016;padding:28px 25px;align-self:start;min-height:335px}.progress-vault .vault-mark{display:block;margin-bottom:18px}.progress-vault .hall-mark{width:50px;height:50px}.progress-vault .eyebrow{font-size:10px;letter-spacing:2px;color:#b7a680}.progress-vault h3{font:23px/1.5 var(--display-font);color:#e1d3b5;margin:12px 0}.progress-vault p{font-size:12px;color:#acbbb4;line-height:1.9}.progress-vault button{width:100%;margin-top:12px}
.grave-modal{width:min(1100px,calc(100vw - 40px))}.grave-total{display:grid;text-align:center;padding:10px 25px;border-left:1px solid #a995644d;flex:none}.grave-total b{font:43px Georgia;color:#d8c293}.grave-total span{font-size:9px;color:#a7b1a7;letter-spacing:1px;margin-top:10px}.grave-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.grave-list article{display:grid;grid-template-columns:90px minmax(0,1fr);gap:20px;border:1px solid #93846250;background:linear-gradient(110deg,#27332f,#122028);padding:12px;box-shadow:0 3px #060e16}.grave-image{position:relative;align-self:start}.grave-list img.grave-art{display:block;width:90px;height:126px;object-fit:cover;border:1px solid #ac967068;box-shadow:2px 3px #071017}.grave-image>span{display:block;padding:6px;text-align:center;color:#c0b28d;font-size:10px;background:#101b23}.grave-copy{min-width:0}.grave-copy>small{display:block;font-size:10px;color:#8fa69e;line-height:1.5;margin:5px 0 10px}.grave-copy>strong{display:block;font:20px/1.4 var(--display-font);color:#dfcfad;margin:0 0 10px}.grave-copy p{font-size:11px;line-height:1.85;color:#b4c1b9;margin:6px 0}.grave-copy .cost-copy{color:#c5b285}.grave-hall .empty-state .hall-mark{width:85px;height:85px;margin:10px auto 20px}.grave-hall .empty-state{padding:30px 20px 55px}
.log-modal{width:min(870px,calc(100vw - 40px))}.full-log{max-height:none!important;padding:5px 0 20px 25px;list-style:none;border-left:1px solid #a28e6250;margin:0 10px}.full-log li{position:relative;line-height:1.9;padding:13px 12px;border-bottom:1px solid #a8935a25;color:#b7c5bd;font-size:13px}.full-log li::before{content:'';position:absolute;left:-29px;top:22px;width:6px;height:6px;background:#9c8b66;border:2px solid #1d2a2c;box-shadow:0 0 0 1px #ae99734d}.full-log li:first-child{color:#e6d5b0;background:linear-gradient(90deg,#b59c6216,transparent)}
.duel3d .winner.result-hall{width:590px;max-width:calc(100vw - 28px);padding:30px 32px;background:linear-gradient(120deg,#2e3935f8,#10202afc),url('materials/cloudstone-floor.jpg') center/700px;border:1px solid #c6ad7a;box-shadow:inset 0 0 0 5px #15252a,inset 0 0 0 6px #b29a6640,0 0 0 100vmax #030b13a6,0 25px 80px #000c;pointer-events:auto}.winner.result-hall::before{display:none}.result-emblem .hall-mark{width:74px;height:74px}.result-hall .eyebrow{font:10px var(--ui-font);letter-spacing:4px;color:#bdab84;margin:12px 0}.winner.result-hall h2{font:400 34px/1.45 var(--display-font);letter-spacing:3px;margin:12px 0;color:#efe1c2}.result-hall>p:not(.eyebrow){font-size:12px;color:#abbcb4;line-height:1.8}.result-hall .result-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-block:1px solid #b09a634c;margin:23px 0;padding:17px 0;background:#0e1c225c}.result-metrics>span{display:grid;gap:8px;font-size:10px;color:#a6b7af}.result-metrics>span+span{border-left:1px solid #a38d613a}.result-hall .result-metrics b{font:28px Georgia;margin:0;color:#e2d0a3}.result-actions,.result-links{display:flex;gap:10px;justify-content:center}.result-hall .result-actions button{flex:1;margin:0;min-height:43px}.result-hall .result-links{margin-top:12px}.result-hall .result-links button,.result-hall>[data-act=playtest]{font-size:11px;padding:7px 13px;min-height:32px;margin:0;border-color:transparent;background:none;color:#aebeb6;box-shadow:none}.result-hall>[data-act=playtest]{margin-top:5px;text-decoration:underline;text-underline-offset:4px}
.feedback-modal{width:min(1040px,calc(100vw - 40px))}.feedback-modal .playtest-form{max-width:none;padding:0 12px}.feedback-modal .playtest-form>.muted{font-size:12px}.feedback-modal .playtest-auto{border:1px solid #ae986252;background:#1c2d30}.feedback-modal .playtest-auto>span{border:0;border-right:1px solid #ae986239;background:none;padding:14px}.feedback-modal .playtest-fields label{color:#aebcb7}.feedback-modal .playtest-fields input,.feedback-modal .playtest-fields select,.feedback-modal .playtest-fields textarea{background:#0c1b23;border-color:#aa95644a}.feedback-modal .playtest-privacy{line-height:1.8;color:#8da69e}
.duel3d .play-controls{border-color:#b7a27688;background:linear-gradient(110deg,#253831f5,#101f29f5);box-shadow:inset 0 1px #e2d1a42b,0 5px 18px #0005}.duel3d .play-summary small{color:#dbc09a;font-size:11px;line-height:1.55}.duel3d .choice-prompt{background:linear-gradient(100deg,#26362ff5,#15252cf5);border-color:#bdab7a}.duel3d .choice-prompt strong{color:#eee0be}.duel3d .choice-prompt p{color:#c8d5c8;font-size:12px;line-height:1.5}.duel3d .choice-prompt em{font-size:10px;color:#aaa98e}.duel3d .response{background:linear-gradient(120deg,#30392ffc,#14252cfb);border:1px solid #c9ad72;box-shadow:inset 0 0 0 3px #101c21,0 12px 40px #000a}.duel3d .response button{font-size:12px;min-height:40px}.duel3d .response p{color:#e2d3b3}.duel3d button:focus-visible,dialog button:focus-visible{outline:2px solid #e2c68d;outline-offset:3px}.duel3d .play-summary .unit-reason{display:block;max-width:260px}
@media(max-width:900px){.rules.rulebook{grid-template-columns:155px minmax(0,1fr);gap:22px}.combat-reference{grid-template-columns:1fr}.combat-reference article{display:grid;grid-template-columns:135px minmax(0,1fr);gap:12px}.settings-layout{gap:24px}.lesson-hall .tutorial-list{gap:15px}.lesson-copy{padding:16px}.lesson-picture{height:150px}.lesson-copy>strong{font-size:18px}.grave-list{grid-template-columns:1fr}}
@media(max-width:600px){dialog.manual-modal,dialog.lesson-modal,dialog.settings-modal,dialog.grave-modal,dialog.log-modal,dialog.feedback-modal{width:calc(100vw - 16px);max-height:calc(100svh - 16px)}.folio-intro{gap:14px;padding:0 0 20px;margin-bottom:20px}.folio-intro .hall-mark{width:44px;height:44px}.folio-intro h3,.rules .rule-pages .folio-intro h3{font-size:23px;line-height:1.6}.folio-intro p{font-size:11px}.rules.rulebook{display:block;min-height:0;padding:0}.rule-nav{position:static;border:0;border-bottom:1px solid #b69b6655;flex-direction:row;overflow-x:auto;gap:5px;padding:0 0 12px;margin:0 0 20px}.rule-nav button{flex:none;max-width:180px;padding:9px 12px;min-height:38px;gap:6px;font-size:11px;border-left:0;border-bottom:2px solid transparent}.rule-nav button[aria-selected=true]{border-bottom-color:#d0b57c;border-left:0}.rule-nav button span{display:none}.mode-comparison>div{padding:16px}.mode-comparison strong{font-size:31px}.rules .rule-pages>section>p{font-size:12px;line-height:2}.rules .rule-pages>section>h3{font-size:21px;padding:0 0 15px}.combat-reference{gap:12px}.combat-reference article{grid-template-columns:115px minmax(0,1fr);gap:10px}.combat-reference p{font-size:10px}.combat-reference article>div{gap:5px}.combat-reference b{font-size:10px}.lesson-hall .tutorial-list{grid-template-columns:1fr;gap:20px}.tutorial-list .lesson-leaf{display:grid;grid-template-columns:100px minmax(0,1fr)}.lesson-picture{height:100%;min-height:195px;border-bottom:0;border-right:1px solid #a5916144}.lesson-number{bottom:10px;right:10px;font-size:18px}.lesson-copy{padding:17px 14px}.lesson-copy>strong{font-size:17px;line-height:1.5;margin:9px 0}.lesson-copy p{font-size:11px;margin:0 0 14px}.lesson-copy button{font-size:11px;min-height:36px}.settings-layout{grid-template-columns:1fr;gap:25px}.settings-modal .settings-panel{padding:0 1px 10px}.settings-group label small{max-width:220px}.settings-group input[type=range]{width:50%;max-width:180px}.progress-vault{min-height:0;padding:22px}.progress-vault .vault-mark{float:right;margin-left:12px}.grave-total{padding:6px 10px}.grave-total b{font-size:34px}.grave-total span{font-size:8px;max-width:65px;line-height:1.6}.grave-list article{grid-template-columns:70px minmax(0,1fr);gap:14px;padding:10px}.grave-list img.grave-art{width:70px;height:100px}.grave-copy>strong{font-size:18px}.grave-copy p{font-size:11px}.grave-copy>small{font-size:9px}.full-log{padding-left:14px;margin:0 4px}.full-log li{font-size:12px;padding:12px 8px}.full-log li::before{left:-18px}.duel3d .winner.result-hall{top:50%;transform:translate(-50%,-50%);padding:22px 20px;max-height:calc(100svh - 90px);overflow:auto}.result-emblem .hall-mark{width:47px;height:47px}.winner.result-hall h2{font-size:28px}.result-hall .result-metrics{margin:18px 0;padding:13px 0}.result-hall .result-metrics b{font-size:24px}.result-hall .result-actions button{font-size:11px;min-height:40px}.feedback-modal .playtest-form{padding:0}.feedback-modal .playtest-auto>span{padding:11px}.duel3d .play-summary small,.duel3d .choice-prompt p{font-size:10px}.duel3d .play-summary .unit-reason{max-width:none}.duel3d .choice-prompt{gap:4px}}
@media(max-height:500px){.duel3d .winner.result-hall{top:50%;transform:translate(-50%,-50%);max-height:calc(100svh - 75px);padding:15px 25px}.result-emblem{display:none}.result-hall .eyebrow{margin:0}.winner.result-hall h2{font-size:24px;margin:5px 0}.result-hall .result-metrics{margin:12px 0;padding:9px 0}.result-hall .result-metrics b{font-size:20px}.result-hall .result-links{margin-top:7px}}
@media(prefers-reduced-motion:reduce){.lesson-leaf,.progress-vault{transition:none}}
/* Grave art participates in the new grid; the old absolute thumbnail must not leak in. */
.grave-list img.grave-art{position:static;left:auto;top:auto}
/* Keep lesson actions visible after selecting a unit opens its detail panel. */
.duel3d .side:has(.tutorial-coach){display:block}
.duel3d .side.has-detail .tutorial-coach{display:block}
.duel3d .side:has(.tutorial-coach)>.inspect{display:none}
.compact3d .side:has(.tutorial-coach){top:auto;bottom:8px;left:8px;right:auto;width:calc(100% - 152px);max-height:130px;padding:0;background:none;border:0;box-shadow:none;z-index:24}
.compact3d .side:has(.tutorial-coach) .detail-close{display:none}
.compact3d .side .tutorial-coach{margin:0;padding:10px 12px}
.portrait3d .side:has(.tutorial-coach){width:calc(100% - 16px);max-height:190px}
.compact3d .side .tutorial-coach strong{font-size:12px}
.compact3d .side .tutorial-coach p{font-size:10px;line-height:1.5;margin:5px 0}
.compact3d .side .tutorial-actions{margin-top:5px}
@media(max-height:600px){.duel3d .winner.result-hall{top:50%;transform:translate(-50%,-50%);max-height:calc(100svh - 110px);overflow:auto;padding:18px 24px}.result-emblem .hall-mark{width:36px;height:36px}.winner.result-hall h2{font-size:27px;margin:10px 0}.result-hall .result-metrics{margin:12px 0;padding:10px 0}.result-hall .result-metrics b{font-size:24px}}
.duel3d .game.guided-lesson .hand,.duel3d .game.guided-lesson .action-dock{display:none!important}
.compact3d:not(.portrait3d) .side:has(.tutorial-coach){left:120px;width:calc(100% - 264px)}
