.plate{background:var(--bg);height:100svh;position:relative;overflow:hidden}.plate:before{content:"";opacity:var(--grain);pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.5 0 0 0 0 0.5 0 0 0 0 0.5 0 0 0 1.6 -0.55'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");position:absolute;inset:0}.stage{position:absolute;inset:0}.plate:is([data-view=silo],[data-view=floor],[data-view=walk]):after{content:"";background:linear-gradient(to right, var(--bg) 0%, color-mix(in srgb, var(--bg) 88%, transparent) 55%, transparent 100%);pointer-events:none;width:420px;position:absolute;inset:0 auto 0 0}.title,.rail,.tools,.hint,.stepper{z-index:1}.card{z-index:2}.stage canvas{touch-action:none}.plate:is([data-view=silo],[data-view=floor],[data-view=walk]) .stage:after{content:"";background:linear-gradient(to top, var(--bg) 0%, color-mix(in srgb, var(--bg) 80%, transparent) 45%, transparent 100%);pointer-events:none;height:120px;position:absolute;inset:auto 0 0}.side{pointer-events:none;z-index:1;flex-direction:column;gap:22px;width:min(440px,100% - 56px);display:flex;position:absolute;top:24px;bottom:70px;left:28px}.title{pointer-events:none}.title h1{font:600 30px/1.1 var(--serif);letter-spacing:-.005em;margin:0}.title p{color:var(--ink-dim);margin:8px 0 0;font-size:14px;line-height:1.45}.clock{white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--ink)}.card{background:var(--surface);border:1px solid var(--edge);border-radius:10px;width:300px;padding:18px 20px 20px;position:absolute;top:24px;right:24px}.card-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.card h2{font:600 24px/1.15 var(--serif);margin:0}.close{width:28px;height:28px;color:var(--ink-dim);cursor:pointer;background:0 0;border:0;border-radius:6px;place-items:center;margin-right:-6px;display:grid}.close:hover{color:var(--ink)}.status{color:var(--lamp);margin:4px 0 0;font-size:13px}.status[data-status=Dark]{color:var(--emerg)}.status[data-status=Watching]{color:var(--ink)}.note{margin:10px 0 14px;font-size:14px;line-height:1.45}.card dl{gap:7px;margin:0;font-size:13px;display:grid}.card dl div{justify-content:space-between;gap:16px;display:flex}.card dt{color:var(--ink-dim)}.card dd{text-align:right;font-variant-numeric:tabular-nums;margin:0}.act{border:1px solid var(--edge);cursor:pointer;background:0 0;border-radius:7px;align-items:center;gap:8px;padding:8px 12px;font-size:14px;transition:background-color .16s;display:inline-flex}.act:hover{background:var(--edge)}.act svg{transition:transform .2s cubic-bezier(.3,.7,.2,1.3)}.act:hover svg{transform:translate(2px,-2px)}.tools{align-items:center;gap:2px;display:flex;position:absolute;bottom:22px;left:22px}.tools button{min-width:34px;height:34px;color:var(--ink-dim);cursor:pointer;background:0 0;border:0;border-radius:7px;place-items:center;padding:0 8px;display:grid}.tools button:hover{color:var(--ink);background:var(--edge)}.tools .theme{margin-left:10px;font-size:13px}.hint{color:var(--ink-dim);pointer-events:none;margin:0;font-size:13px;position:absolute;bottom:30px;right:28px}@media (width<=640px){.side{width:calc(100% - 32px);top:16px;bottom:auto;left:16px}.title h1{font-size:24px}.card{width:auto;inset:auto 16px 64px}.tools{bottom:12px;left:10px}.hint{display:none}}.crumb{color:var(--ink-dim);pointer-events:auto;align-items:center;gap:6px;margin:0 0 8px -2px;font-size:14px;text-decoration:none;transition:color .14s;display:inline-flex}.crumb:hover{color:var(--ink)}.crumb svg{transition:transform .2s cubic-bezier(.3,.7,.2,1.3)}.crumb:hover svg{transform:translate(-2px)}.rail{pointer-events:auto;scrollbar-width:none;flex:1;width:fit-content;min-height:0;margin-left:-6px;padding-right:8px;overflow-y:auto}.rail::-webkit-scrollbar{display:none}.rail{padding-block:12px;-webkit-mask-image:linear-gradient(#0000 0,#000 18px calc(100% - 18px),#0000 100%);mask-image:linear-gradient(#0000 0,#000 18px calc(100% - 18px),#0000 100%)}.band+.band{margin-top:12px}.band-name{font:600 15px/1.2 var(--serif);color:var(--ink);margin:0 0 3px 6px}.rail ol{margin:0;padding:0;list-style:none}.lvl{text-align:left;width:100%;color:var(--ink-dim);cursor:pointer;background:0 0;border:0;border-radius:5px;align-items:baseline;gap:10px;padding:1px 6px;font-size:12px;line-height:1.35;transition:color .12s,background-color .12s;display:flex}.lvl:hover{color:var(--ink);background:var(--edge)}.lvl .num{text-align:right;font-variant-numeric:tabular-nums;opacity:.75;width:16px}.lvl[data-named] .lname{color:var(--ink);opacity:.85}.lvl[data-here]{color:var(--ink);font-weight:650}.lvl[data-here] .num,.lvl[data-here] .lname{opacity:1}.acts{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.acts .act{margin-top:0}.act[data-kind=enter]{background:var(--ink);color:var(--bg);border-color:var(--ink)}.act[data-kind=enter]:hover{background:var(--live);border-color:var(--live)}.act[data-kind=enter]:hover svg{transform:translateY(2px)}.stepper{display:none}.plate[data-view=silo] .tools{left:22px}@media (height<=760px){.rail .lvl:not([data-named]):not([data-here]) .num{font-size:10px}.lvl{line-height:1.2}}@media (width<=640px){.rail{display:none}.plate:is([data-view=silo],[data-view=floor],[data-view=walk]):after{background:linear-gradient(to bottom, var(--bg) 0%, color-mix(in srgb, var(--bg) 85%, transparent) 55%, transparent 100%);width:auto;height:260px;inset:0 0 auto}.plate[data-view=silo] .card{bottom:106px}.plate:is([data-view=silo],[data-view=floor],[data-view=walk]) .stage:after{height:170px}.stepper{font-variant-numeric:tabular-nums;align-items:center;gap:4px;font-size:14px;display:flex;position:absolute;bottom:56px;right:10px}.stepper button{width:34px;height:34px;color:var(--ink-dim);cursor:pointer;background:0 0;border:0;border-radius:7px;place-items:center;display:grid}.stepper button:disabled{opacity:.3;cursor:default}.stepper span{text-align:center;min-width:64px}}:root[data-og] .tools,:root[data-og] .hint,:root[data-og] .rail,:root[data-og] .stepper,:root[data-og] .card,:root[data-og] .crumb,:root[data-og] .clock{display:none}:root[data-og] .plate:is([data-view=silo],[data-view=floor],[data-view=walk]):after{width:520px}.cleaning{z-index:2;background:var(--surface);border:1px solid var(--edge);border-radius:10px;gap:10px;max-width:340px;padding:14px 16px 14px 18px;font-size:14px;line-height:1.45;display:grid;position:absolute;top:24px;right:24px}.cleaning p{color:var(--ink-dim);margin:0}.cleaning strong{font:600 17px/1.3 var(--serif);color:var(--ink);margin-bottom:2px;display:block}.cleaning button{border:1px solid var(--edge);cursor:pointer;background:0 0;border-radius:7px;justify-self:start;padding:7px 12px;font-size:14px;transition:background-color .16s}.cleaning button:hover{background:var(--edge)}@media (width<=640px){.cleaning{max-width:none;inset:auto 16px 106px}}.go-walk{background:var(--ink);color:var(--bg);pointer-events:auto;border-radius:7px;align-items:center;gap:9px;margin-top:16px;padding:9px 14px 9px 12px;font-size:14px;text-decoration:none;transition:background-color .16s;display:inline-flex}.go-walk:hover{background:var(--live)}.go-walk svg{transition:transform .26s cubic-bezier(.3,.7,.2,1.3)}.go-walk:hover svg{transform:translateY(2px)}.walkbar{z-index:2;justify-items:center;gap:8px;max-width:calc(100% - 32px);display:grid;position:absolute;bottom:22px;left:50%;transform:translate(-50%)}.walkbar p{background:var(--surface);border:1px solid var(--edge);text-align:center;color:var(--ink);border-radius:8px;margin:0;padding:8px 12px;font-size:14px}.walkbar div{background:var(--surface);border:1px solid var(--edge);border-radius:10px;gap:4px;padding:4px;display:flex}.walkbar button,.walkbar a{height:34px;color:var(--ink);white-space:nowrap;cursor:pointer;background:0 0;border:0;border-radius:7px;align-items:center;padding:0 14px;font-size:14px;text-decoration:none;transition:background-color .14s;display:inline-flex}.walkbar button:hover,.walkbar a:hover{background:var(--edge)}.walkbar button[aria-pressed=true]{background:var(--ink);color:var(--bg)}.walkbar button:disabled{opacity:.4;cursor:default;background:0 0}.walkbar a{font-variant-numeric:tabular-nums}.plate[data-view=walk] .stage canvas{cursor:grab}@media (width<=640px){.walkbar{bottom:104px}.plate[data-view=walk] .card{bottom:160px}}
