:root{--walnut: #1c130e;--walnut-2: #2a1c14;--walnut-3: #3a281c;--brass: #d4b36a;--brass-dim: #8a6e38;--wax: #8a1e18;--wax-bright: #c43a28;--ink: #f3e6c8;--muted: #b39a78;--shadow: #070504;--panel: rgba(20, 12, 8, .92)}*{box-sizing:border-box;margin:0;padding:0}html,body,#app{width:100%;height:100%;overflow:hidden;background:#070504;color:var(--ink);font-family:Noto Sans SC,PingFang SC,sans-serif}#world{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;cursor:crosshair;background:#0b1020}#frame{pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;box-shadow:inset 0 0 0 10px #120c08,inset 0 0 0 12px #c9a25a,inset 0 0 0 16px #1a120c,inset 0 40px 80px #00000059;z-index:2}#topbar{position:absolute;top:18px;left:22px;right:22px;z-index:5;display:flex;align-items:stretch;gap:12px;pointer-events:none}#topbar>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:10px;background:linear-gradient(180deg,#3a281c,#1a110c);border:1px solid #c9a25a;box-shadow:0 4px #070504,inset 0 1px #5a4030;padding:8px 12px 8px 8px;min-width:148px}.brand-mark{width:36px;height:36px;display:grid;place-items:center;background:radial-gradient(circle at 30% 30%,#d44a38,#7a1812 70%);color:#f8e0b0;font-family:Cinzel,serif;font-weight:700;font-size:18px;border:1px solid #f0c070;box-shadow:inset 0 0 8px #00000073}.brand-title{font-weight:700;letter-spacing:.18em;font-size:14px}.brand-sub{font-family:Silkscreen,monospace;font-size:8px;color:var(--brass);letter-spacing:.12em}.plaque{flex:1;display:flex;align-items:center;gap:18px;padding:0 18px;background:linear-gradient(180deg,#4a3424,#24160f 40%,#1a100c);border:1px solid #c9a25a;box-shadow:0 4px #070504,inset 0 1px #6a4c34;font-size:13px;min-height:52px}.stat{display:flex;flex-direction:column;gap:2px}.stat b{font-family:Silkscreen,monospace;font-size:14px;color:#f8e8c0}.stat span{color:var(--muted);font-size:11px}.clock-group{display:flex;align-items:center;gap:8px;background:linear-gradient(180deg,#3a281c,#1a110c);border:1px solid #c9a25a;padding:8px;box-shadow:0 4px #070504}.brass-btn,.speed-btn,.ghost-btn,.wax-btn,.power,.tab,.brush-btn,.law-btn{font-family:inherit;cursor:pointer;border:1px solid #6a5030;background:linear-gradient(180deg,#4a3424,#24160f);color:var(--ink)}.brass-btn,.speed-btn{padding:8px 12px;min-width:52px;box-shadow:inset 0 1px #6a4c34}.brass-btn:hover,.speed-btn:hover,.power:hover,.tab:hover,.brush-btn:hover{filter:brightness(1.12)}.brass-btn.on,.speed-btn.on{background:linear-gradient(180deg,#c9a25a,#8a6a30);color:#1a1008;border-color:#f0d080}.speed-row{display:flex;gap:4px}#log{position:absolute;left:22px;top:86px;width:240px;max-height:34vh;overflow:hidden;z-index:4;pointer-events:auto;background:#0c0806b3;border:1px solid rgba(201,162,90,.45);box-shadow:0 5px #070504bf}.log-head{display:flex;justify-content:space-between;align-items:center;padding:6px 8px;color:var(--brass);font-size:11px;border-bottom:1px solid rgba(201,162,90,.25)}.log-head span{color:var(--muted);font-size:9px}.log-filters{display:flex;gap:4px;padding:4px 6px;border-bottom:1px solid rgba(201,162,90,.2)}.log-filters button{flex:1;padding:3px 4px;border:1px solid #4a3424;background:#1a100c;color:var(--muted);font:inherit;font-size:10px;cursor:pointer}.log-filters button.on{color:#1a1008;background:var(--brass);border-color:#f0d080}#log-list{max-height:calc(34vh - 58px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--brass-dim) transparent}.log-item{font-size:12px;color:#ead6a8;background:#100a06b8;border-left:2px solid var(--brass);padding:4px 8px;animation:fadein .3s ease;border-bottom:1px solid rgba(255,255,255,.035)}.log-item.war{border-color:#d44a38}.log-item.fall{border-color:#888;color:#c0b090}.log-item.boom{border-color:#f0a020}.log-item.grow{border-color:#65bd72}.log-item.era{border-color:#f0d050;color:#fff0a8;background:#4e370cdb}#inspect{position:absolute;right:22px;top:86px;width:250px;z-index:5;background:linear-gradient(180deg,#2c1e14,#140e0a);border:1px solid #c9a25a;box-shadow:0 8px #070504,0 18px 40px #00000073;padding:12px 14px 14px}#inspect h3{font-size:16px;margin-bottom:4px}#inspect .meta{color:var(--muted);font-size:12px;margin-bottom:10px}.bar{height:8px;background:#1a120c;border:1px solid #4a3424;margin:4px 0 10px}.bar>i{display:block;height:100%;background:linear-gradient(90deg,#48b050,#d4c050)}.kv{display:grid;grid-template-columns:52px 1fr;gap:4px 8px;font-size:12px}.kv span{color:var(--muted)}.tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:10px}.tag{font-size:11px;border:1px solid #6a5030;padding:2px 6px;color:#f0d080}#minimap-wrap{position:absolute;right:22px;bottom:168px;z-index:5;border:1px solid #c9a25a;background:#0a0806;box-shadow:0 6px #070504;padding:4px}#minimap{display:block;width:180px;height:120px;image-rendering:pixelated;cursor:pointer}.mini-label{text-align:center;font-size:10px;color:var(--brass);letter-spacing:.2em;padding:2px 0 0}#hint{position:absolute;left:50%;bottom:158px;transform:translate(-50%);z-index:4;font-size:12px;color:#f0d8a8;background:#0c0806b3;border:1px solid #6a5030;padding:4px 12px;pointer-events:none;white-space:nowrap}#powerbar{position:absolute;left:18px;right:18px;bottom:14px;z-index:6;background:linear-gradient(180deg,#4a3224,#24160f 18%,#160e0a);border:1px solid #c9a25a;box-shadow:0 8px #070504,inset 0 1px #6a4c34;padding:8px 10px 10px}#tabs,#brush-row,#powers{display:flex;gap:6px;align-items:center}#tabs{margin:6px 0}.tab,.brush-btn,.law-btn{padding:5px 10px;font-size:12px}.tab.on,.brush-btn.on,.power.on{background:linear-gradient(180deg,#c43a28,#7a1812);border-color:#f0c070;box-shadow:0 0 0 1px #f0c070 inset}#powers{overflow-x:auto;padding-bottom:4px;scrollbar-width:thin;scrollbar-color:#8a6e38 transparent}.power{flex:0 0 auto;width:58px;height:58px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:10px;position:relative}.power canvas{width:28px;height:28px;image-rendering:pixelated}#power-caption{margin-top:4px;font-size:12px;color:var(--muted)}#power-caption b{color:var(--brass);font-weight:700}#title-screen{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;transition:opacity .55s ease}#title-screen.hide{pointer-events:none;opacity:0}.curtain{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at 50% 40%,#28140c33,#040201c7 70%),#06040259}.title-card{position:relative;width:min(520px,calc(100% - 32px));background:linear-gradient(180deg,#3a281c,#140e0a);border:1px solid #c9a25a;box-shadow:0 18px #070504,0 40px 80px #0000008c;padding:28px 28px 22px;text-align:center}.seal{width:56px;height:56px;margin:0 auto 12px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 30% 30%,#d44a38,#6a1210);border:2px solid #f0c070;font-family:Cinzel,serif;font-size:24px}.title-card h1{font-family:Cinzel,Noto Sans SC,serif;font-size:42px;letter-spacing:.28em;text-indent:.28em}.lede{margin:10px 0 16px;color:#ead6a8;line-height:1.7;font-size:14px}.how{list-style:none;text-align:left;font-size:13px;color:var(--muted);display:grid;gap:6px;margin-bottom:18px}.how li:before{content:"✦ ";color:var(--brass)}.title-actions{display:flex;gap:10px;justify-content:center}.wax-btn{background:linear-gradient(180deg,#d44a38,#8a1e18);border-color:#f0c070;color:#fff4d8;padding:10px 22px;font-size:15px;letter-spacing:.12em}.ghost-btn{padding:10px 16px;color:var(--ink)}.fine{margin-top:14px;font-size:11px;color:#8a7358}@keyframes fadein{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}@media(max-width:820px){.brand-sub,#log{display:none}.plaque{gap:10px;font-size:12px;overflow:auto}#minimap-wrap{display:none}#inspect{width:calc(100% - 44px)}#hint{display:none}#powerbar{left:8px;right:8px;bottom:8px}.power{width:52px;height:52px}#frame{box-shadow:inset 0 0 0 6px #120c08,inset 0 0 0 7px #c9a25a}}