:root{--bg:#f7f4ed;--paper:#fffdfa;--ink:#304844;--muted:#69807b;--green:#4f877c;--line:#dbe7e3;--orange:#df946b;--soft:#eef6f3;--peach:#fff0e7}
      *{box-sizing:border-box}body{margin:0;padding:7px;background:radial-gradient(circle at 12% 0,#fff9ef 0,transparent 34%),var(--bg);color:var(--ink);font-family:"Yu Gothic","Hiragino Kaku Gothic ProN",sans-serif}.shell{width:min(1120px,100%);margin:auto;padding-bottom:20px}.nav{display:flex;justify-content:center;gap:7px;margin-bottom:6px;flex-wrap:wrap}.nav a{padding:6px 12px;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--green);font-size:10px;text-decoration:none}.head{padding:14px 18px 13px;border:1px solid var(--line);border-radius:19px;background:linear-gradient(135deg,#fffdfa,#f1f8f5);text-align:center}.kicker{color:var(--green);font-size:10px;letter-spacing:.15em}.head h1{margin:4px 0;font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(23px,3.5vw,32px);font-weight:500}.focus{padding:0 7px;border-radius:7px;background:var(--peach);color:#ad6243}.head p{margin:0;color:var(--muted);font-size:11px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 238px;gap:8px;margin-top:8px}.panel,.collection{border:1px solid var(--line);border-radius:17px;background:var(--paper);overflow:hidden}.panel{padding:10px}.topline{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:5px}.case-name{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:17px;font-weight:700}.tag{padding:5px 8px;border-radius:999px;background:var(--soft);color:var(--green);font-size:9px}.guide{text-align:center;color:var(--muted);font-size:9px;margin-bottom:5px}.controls{display:flex;justify-content:center;gap:9px;padding:8px;border:1px solid var(--line);border-radius:12px;background:#f6faf8}.btn{min-width:122px;min-height:40px;padding:8px 15px;border:1px solid #c8ddd7;border-radius:11px;background:#eef7f4;color:var(--green);font:700 12px inherit;cursor:pointer}.btn.main{border-color:#efb091;background:#fff0e7;color:#b76543}.btn:disabled{cursor:not-allowed;opacity:.42}.stage{position:relative;height:min(59vh,580px);min-height:430px;margin-top:7px;border-radius:13px;background:radial-gradient(circle at 50% 45%,#fbfffd 0,#edf7f4 74%);overflow:hidden}.stage canvas{display:block;width:100%;height:100%;touch-action:none}.badge,.prompt{position:absolute;padding:5px 9px;border:1px solid #d4e4df;border-radius:999px;background:rgba(255,253,250,.92);font-size:9px}.badge{left:9px;top:9px;color:var(--green)}.prompt{left:50%;bottom:9px;translate:-50% 0;color:var(--muted);white-space:nowrap}.status,.answer{margin-top:6px;padding:9px 12px;border-radius:11px;text-align:center;font-size:10px;line-height:1.55}.status{background:var(--soft);color:var(--muted)}.status b{color:var(--orange)}.answer{display:none;background:var(--peach);color:#8f5b45}.answer.show{display:block}.answer strong{display:block;color:#b76543;font-size:14px}.collection{padding:9px}.collection h2{margin:0 0 7px;text-align:center;font-size:13px}.cases{display:grid;grid-template-columns:1fr;gap:5px}.case{position:relative;min-height:62px;padding:8px 31px 8px 9px;border:1px solid var(--line);border-radius:11px;background:#fff;color:var(--ink);text-align:left;cursor:pointer}.case.on{border-color:#ee9a73;background:#fff2e9;box-shadow:inset 3px 0 #df946b}.case b,.case small{display:block}.case b{font-size:11px}.case small{margin-top:3px;color:var(--muted);font-size:8px;line-height:1.35}.case .no{position:absolute;right:8px;top:8px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--soft);color:var(--green);font-size:9px}.rule{margin-top:7px;padding:9px;border-radius:11px;background:#eef7f4;color:var(--muted);font-size:9px;line-height:1.55}.rule b{color:#b76543}.legend{display:flex;justify-content:center;gap:11px;margin-top:6px;color:var(--muted);font-size:8px}.legend i{display:inline-block;width:8px;height:8px;margin-right:3px;border-radius:50%;vertical-align:-1px}.legend .p{background:#df946b}.legend .e{background:#789b94}
      @media(max-width:760px){.workspace{grid-template-columns:1fr}.workspace .collection{order:-1}.cases{grid-template-columns:repeat(2,1fr)}.stage{min-height:390px;height:53vh}}
      @media(max-width:480px){body{padding:4px}.head{padding:12px 8px}.panel{padding:6px}.case{min-height:58px}.stage{min-height:350px}.btn{min-width:112px}.case-name{font-size:15px}}