/* 百工灯火：参考UI的宣纸、墨青、暖木；所有状态文字由DOM绘制。 */
@import url('./presentation.css');
.lantern-game,.lantern-modal,.lantern-preview{--ink:#183f43;--paper:#f5ecd8;--red:#9e3729;--rule:#b79662;box-sizing:border-box;font-family:"KaiTi","STKaiti","SimSun",serif;color:var(--ink)}
.lantern-game *,.lantern-modal *,.lantern-preview *{box-sizing:border-box}
.lantern-game{position:fixed;inset:0;margin:0;width:100%;max-width:none;height:100dvh;max-height:none;padding:0;border:0;background:#4f3425;overflow:visible}
.lantern-game:not([open]),.lantern-modal:not([open]),.lantern-game [hidden]{display:none!important}
.lantern-is-open{overflow:clip}
.lantern-game::backdrop{background:#201e20}
.lantern-window{height:100%;padding:16px 3%;display:grid;grid-template-rows:54px 38px minmax(0,1fr) 64px 18px;gap:10px;background:#52371f url("./art/zaozhuang/workbench.png") center/cover no-repeat}
.lantern-header{display:flex;justify-content:space-between;align-items:center;gap:12px}
.lantern-header>div:first-child{background:#173e43e8;color:#faf0d7;padding:7px 18px;display:flex;align-items:baseline;gap:18px}
.lantern-header b{font-size:30px;letter-spacing:.14em}.lantern-header span{font-size:22px}
.lantern-top{display:flex;gap:8px}
.lantern-game button,.lantern-modal button,.lantern-preview button{font:600 18px/1.25 "KaiTi","SimSun",serif;letter-spacing:.04em;color:var(--ink);background:var(--paper);border:1px solid var(--rule);outline:1px solid #bea471;outline-offset:-5px;border-radius:3px;padding:10px 16px;min-height:44px;cursor:pointer;touch-action:manipulation}
.lantern-game button:disabled{opacity:.5;cursor:not-allowed}
.lantern-game button:focus-visible,.lantern-modal button:focus-visible{outline:3px solid #72cccf;outline-offset:2px}
.lantern-game button:active{transform:scale(.98)}
.lantern-fill span{left:0;max-width:100%;border:0;background:#548e80}
.lantern-game .lantern-steps{gap:16px}
.lantern-game button.lantern-primary,.lantern-modal button.lantern-primary{color:#fff4de;background:var(--red);outline-color:#d7a66b}
.lantern-game button[aria-pressed=true]{border:2px solid #6ec3c9;box-shadow:0 0 8px #8cddd577}
.lantern-steps{justify-self:end;display:flex;gap:24px;padding:5px 20px;background:var(--paper);border:1px solid var(--rule);font-size:21px}
.lantern-steps span{color:#766f5c;white-space:nowrap}.lantern-steps .current{color:var(--red);font-weight:bold}.lantern-steps .done{color:#327476}
.lantern-main{min-height:0;display:grid;grid-template-columns:minmax(0,2.4fr) minmax(0,1fr);gap:24px}
.lantern-play{display:grid;grid-template-rows:44px minmax(0,1fr) auto minmax(54px,auto);gap:8px;min-height:0;min-width:0}
.lantern-title{display:flex;align-items:center;justify-content:space-between;gap:8px}
.lantern-game h1,.lantern-game h2,.lantern-modal h2{margin:0}
.lantern-game h1{font-size:29px;background:#20494ae8;color:#fff2d7;padding:4px 16px;line-height:1.2}
.lantern-clock{background:var(--paper);color:var(--red);font-size:24px;font-variant-numeric:tabular-nums;padding:4px 12px;white-space:nowrap}
.lantern-clock:empty{display:none}
.lantern-canvas-wrap{position:relative;min-height:0;min-width:0;border-radius:8px;background:#3a291433;box-shadow:inset 0 -4px 40px #281a1244}
.lantern-game canvas{display:block;object-fit:contain;width:100%;height:100%;touch-action:none}
.lantern-tools{display:flex;flex-wrap:wrap;gap:7px;justify-content:center}
.lantern-tools:empty{display:none}
.lantern-tools button{font-size:17px;padding:8px 13px;min-width:0}
.lantern-tools [data-note]{flex:1;min-height:60px;background:#21464f;color:#fff0d7}
.lantern-tools [data-note="1"]{background:#8d392d}.lantern-tools [data-note="2"]{background:#987137}
.lantern-feedback{background:var(--paper);margin:0;padding:6px 12px;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;font:16px/1.35 "Microsoft YaHei",sans-serif;border-left:4px solid #528a85}
/* 常驻操作提示占一整行，刚刚发生的反馈跟在下面；两者都比右侧小字更靠近画布。 */
.lantern-feedback .lantern-todo{flex:1 1 100%;font:600 16px/1.35 "Microsoft YaHei",sans-serif;color:#173e43}
.lantern-feedback .lantern-msg{font:13px/1.35 "Microsoft YaHei",sans-serif;color:#6b5f49}
.lantern-feedback .lantern-msg:empty{display:none}
.lantern-feedback[data-kind=error]{border-color:#9e3729}
.lantern-feedback[data-kind=error] .lantern-msg{color:#932d22;font-weight:600}
.lantern-feedback[data-kind=good] .lantern-msg{color:#2b6b5f}
.lantern-paper{display:flex;flex-direction:column;gap:20px;justify-content:center;min-height:0;min-width:0;padding:28px;background:#f5ecd8f5;border:1px solid var(--rule);outline:1px solid var(--rule);outline-offset:-9px;box-shadow:0 4px 18px #241d1944}
.lantern-paper h2{font-size:32px;color:var(--ink);border-bottom:1px solid #c9b997;padding-bottom:14px}
.lantern-conditions{display:grid;gap:14px;font-size:21px}.lantern-conditions p{margin:0;line-height:1.4}
.lantern-detail{font:16px/1.6 "Microsoft YaHei",sans-serif;margin:0;color:#655a46}
.lantern-controls{display:flex;flex-wrap:wrap;gap:10px}.lantern-controls button{flex:1 1 40%;white-space:normal}
.lantern-controls button.lantern-primary{flex-basis:100%;font-size:23px}
.lantern-meter:empty{display:none}.lantern-meter label{display:block;font-size:22px}.lantern-meter small{display:block;font-size:16px;margin-top:7px;color:#6c5d42}
.lantern-gauge{height:22px;position:relative;margin:14px 4px 0;background:linear-gradient(90deg,#d19458,#eedca9,#c88363);border:1px solid #9c7853;border-radius:12px}
.lantern-gauge span{position:absolute;height:100%;background:#80b3a4;border-inline:1px dashed #285754}
.lantern-gauge i{position:absolute;top:-6px;height:30px;width:4px;background:#263e3d;transform:translateX(-50%);border:1px solid #fff7dd}
.lantern-game footer{display:flex;align-items:stretch;gap:16px;min-width:0}
.lantern-speech{margin:0;background:var(--paper);border:1px solid var(--rule);padding:10px 20px;display:flex;gap:20px;align-items:center;flex:1;min-width:0}
.lantern-speech b{background:#20494a;color:#fff3db;padding:6px 14px;font-size:23px;white-space:nowrap}
.lantern-speech span{font-size:21px;line-height:1.3}
.lantern-foot-actions{display:flex;align-items:center}
.lantern-save{margin:0;color:#fff0d9;font:13px/1.3 "Microsoft YaHei",sans-serif;text-shadow:0 1px 3px #1f241d}
.lantern-modal{max-width:none;width:min(580px,94vw);max-height:none;padding:0;background:var(--paper);border:2px solid var(--rule);box-shadow:0 20px 70px #18171b66}
.lantern-modal::backdrop{background:#1d2429bb}
.lantern-modal section{padding:30px;display:grid;gap:22px}
.lantern-modal h2{font-size:30px}.lantern-modal-copy{font:18px/1.8 "Microsoft YaHei",sans-serif}.lantern-modal-copy p{margin:8px 0}.lantern-modal-copy ol{margin:0;padding-left:24px}.lantern-modal li{margin:8px 0}
.lantern-modal-actions{display:flex;justify-content:end;gap:12px}.lantern-modal-actions button{white-space:normal}
.lantern-preview{margin:0;min-height:100dvh;background:#1f3b40 url("./art/zaozhuang/workbench.png") center/cover fixed}
.lantern-preview>main{background:#f5ecd8f0;max-width:640px;margin:10vh auto;padding:32px}.lantern-preview a{color:#1d6265}
.lantern-game.has-tour,.lantern-game.has-tour::backdrop{background:transparent;backdrop-filter:none}
.lantern-game.has-tour .lantern-window{background:transparent}
.lantern-game.has-tour .lantern-main{grid-template-columns:1fr minmax(220px,26%)}.lantern-game.has-tour .lantern-canvas-wrap{background:none;box-shadow:none}
.lantern-game.has-tour .lantern-paper{opacity:.92}
.lantern-game[data-stage=cinema] .lantern-paper{position:absolute;right:3%;bottom:110px;width:220px;padding:12px;outline-offset:-5px}
.lantern-game[data-stage=cinema] .lantern-paper h2,.lantern-game[data-stage=cinema] .lantern-conditions,.lantern-game[data-stage=cinema] .lantern-detail{display:none}
.lantern-game[data-stage=cinema] .lantern-controls{display:flex;max-width:none;grid-column:auto;grid-row:auto}
.lantern-game[data-stage=cinema] .lantern-feedback{visibility:hidden}
body.lantern-cinema #app-header,body.lantern-cinema .map-tools,body.lantern-cinema #city-card,body.lantern-cinema .map-label,body.lantern-cinema #ending{visibility:hidden}
@media(max-height:760px) and (min-width:761px){
 .lantern-window{padding:10px 2%;grid-template-rows:44px 30px minmax(0,1fr) 52px 16px;gap:7px}
 .lantern-header b{font-size:25px}.lantern-header span{font-size:18px}.lantern-steps{font-size:18px}
 .lantern-paper{padding:20px;gap:12px}.lantern-paper h2{font-size:27px;padding-bottom:8px}.lantern-conditions{font-size:18px;gap:9px}
 .lantern-detail{font-size:14px}.lantern-controls{gap:7px}.lantern-controls button.lantern-primary{font-size:20px}
 .lantern-speech b,.lantern-speech span{font-size:18px}.lantern-play{grid-template-rows:36px minmax(0,1fr) auto minmax(46px,auto)}
 .lantern-title h1{font-size:24px}.lantern-clock{font-size:20px}.lantern-meter label{font-size:18px}
}
@media(max-width:760px){
 .lantern-game .lantern-steps{gap:3px;font-size:12px}
 .lantern-window{padding:8px 10px;grid-template-rows:48px 28px minmax(0,1fr) 52px 16px;gap:6px}
 .lantern-header{gap:5px}.lantern-header>div:first-child{display:block;padding:4px 8px}.lantern-header b{font-size:19px;letter-spacing:.05em}.lantern-header span{display:block;font-size:14px}
 .lantern-top{gap:4px}.lantern-top button{font-size:14px;padding:5px 8px;min-height:40px}
 .lantern-steps{width:100%;justify-content:space-around;gap:4px;padding:4px 2px;font-size:15px}
 .lantern-main{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;gap:6px}
 .lantern-play{grid-template-rows:30px minmax(0,1fr) auto minmax(44px,auto);gap:5px}
 .lantern-title h1{font-size:22px;padding:3px 9px}.lantern-clock{font-size:18px;padding:3px 8px}
 .lantern-tools{gap:4px}.lantern-tools button{font-size:14px;min-height:36px;padding:5px 8px}
 .lantern-tools [data-note]{min-height:44px}
 .lantern-feedback{font-size:12px;line-height:1.35;padding:4px 8px;gap:1px 8px}
 .lantern-feedback .lantern-todo{font-size:12.5px;line-height:1.35}
 .lantern-feedback .lantern-msg{font-size:11px;line-height:1.3}
 .lantern-paper{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 10px;padding:10px 12px;outline-offset:-4px}
 .lantern-paper h2{display:none}
 .lantern-conditions{display:flex;flex-wrap:wrap;gap:3px 10px;grid-column:1/-1;font-size:14px}
 .lantern-conditions p{line-height:1.3}
 .lantern-detail{font-size:12px;line-height:1.4;grid-column:1;align-self:center}
 .lantern-controls{gap:4px;align-self:center;grid-column:2;grid-row:2/4;max-width:165px;justify-content:end}
 .lantern-controls button{font-size:13px;padding:5px 8px;min-height:36px;flex-basis:45%}
 .lantern-controls button.lantern-primary{font-size:15px}
 .lantern-meter{grid-column:1;grid-row:2;min-width:0}
 .lantern-meter:not(:empty)+.lantern-detail{grid-row:3}
 .lantern-meter label{font-size:14px}.lantern-gauge{height:12px;margin-top:5px}.lantern-gauge i{height:19px;top:-4px}
 .lantern-meter small{font-size:10px;margin-top:3px}
 .lantern-game footer{gap:5px}.lantern-speech{gap:7px;padding:5px 8px}
 .lantern-speech b{font-size:15px;padding:4px 6px}.lantern-speech span{font-size:14px}
 .lantern-foot-actions button{font-size:12px;padding:4px 7px;min-height:38px}
 .lantern-save{font-size:11px}
 .lantern-modal section{padding:20px;gap:16px}.lantern-modal h2{font-size:23px}.lantern-modal-copy{font-size:16px}.lantern-modal button{font-size:16px}
 .lantern-game.has-tour .lantern-main{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}
 .lantern-game[data-stage=intro] .lantern-paper,.lantern-game[data-stage=result] .lantern-paper,.lantern-game[data-stage=claimed] .lantern-paper,.lantern-game[data-stage=ending] .lantern-paper{min-height:120px}
}
@media(max-width:360px){
 .lantern-game .lantern-steps{font-size:11px;gap:2px}
 .lantern-window{padding-inline:6px}
 .lantern-header b{font-size:17px}.lantern-header span{font-size:12px}.lantern-top button{font-size:12px;padding:4px 6px}
 .lantern-steps{font-size:13px}.lantern-controls{max-width:140px}.lantern-tools button{font-size:12px;padding:5px 6px}
 .lantern-conditions{font-size:12px}.lantern-speech span{font-size:12px}.lantern-feedback{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.lantern-game *{animation:none!important;transition:none!important}}

