.door-wall{pointer-events:none;position:absolute;inset:0}.door-stage{width:min(88vw,620px);margin-inline:auto;position:relative}.door-canvas{pointer-events:none;position:absolute;inset:0}.door-poster{aspect-ratio:1;perspective:1400px;--door-open:50deg;width:100%;position:relative}.door-interior{background-color:var(--color-bg-tertiary);box-shadow:inset 0 0 0 1px var(--color-border);border-radius:50%;place-items:center;display:grid;position:absolute;inset:4.5%;overflow:hidden}.door-contents{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;width:68%;display:grid}.door-contents a{background-color:var(--color-plate);box-shadow:var(--edge-machined), 0 0 0 1px var(--color-border);padding:3px;display:block}.door-contents a:focus-visible{outline-offset:2px}.door-contents-small{grid-template-columns:repeat(3,minmax(0,1fr));width:70%}.door-leaf{transform-origin:2.5%;transition:transform 1.2s var(--ease-in-out);pointer-events:none;position:absolute;inset:0;transform:rotateY(0)}.door-poster[data-door-state=ajar] .door-leaf{transform:rotateY(calc(var(--door-angle,var(--door-open)) + var(--door-sway,0deg)))}.door-poster[data-door-state=open] .door-leaf{transform:rotateY(80deg)}.door-poster:has([data-door-contents] a:focus-visible) .door-leaf{transform:rotateY(62deg)}@media (max-width:1023.98px){.door-contents{grid-template-columns:repeat(3,minmax(0,1fr));width:70%}.door-poster{--door-open:46deg}[data-door] .door-poster[data-door-state=closed] .door-leaf{transform:rotateY(var(--door-open))}}@media (min-width:1024px) and (prefers-reduced-motion:reduce){[data-door] .door-poster[data-door-state=closed] .door-leaf{transform:rotateY(var(--door-open))}}.locker{perspective:900px;background-color:var(--color-bg-tertiary);height:176px;box-shadow:var(--edge-machined-pressed), 0 0 0 1px var(--color-border);display:block;position:relative}.locker:focus-visible{outline-offset:3px}.locker-inside{justify-content:flex-end;align-items:flex-end;gap:8px;display:flex;position:absolute;inset:12px}.locker-cover{background-color:var(--color-plate);width:min(30%,92px);box-shadow:0 0 0 1px var(--color-border);transition:transform var(--dur-panel) var(--ease-latch);padding:3px;display:block}.locker-door{background-color:var(--color-plate);box-shadow:var(--edge-machined), 0 0 0 1px var(--color-border);transform-origin:0;transition:transform var(--dur-panel) var(--ease-latch);flex-direction:column;justify-content:space-between;gap:12px;padding:16px 18px;display:flex;position:absolute;inset:0}.locker-vents{flex-direction:column;gap:5px;width:42%;max-width:140px;display:flex}@media (max-width:1023.98px){.locker-vents{display:none}}.locker-vents>span{background-color:var(--color-bg-tertiary);height:3px;box-shadow:var(--edge-machined-pressed);display:block}.locker-handle{background-color:var(--color-border-control);width:6px;height:46px;box-shadow:var(--edge-machined);position:absolute;top:50%;right:14px;transform:translateY(-50%)}.locker[data-ajar] .locker-door{transform:rotateY(18deg)}@media (min-width:1024px){.locker{height:300px}}@media (hover:hover) and (pointer:fine){.locker[data-ajar] .locker-door{transform:none}.locker:is(:hover,:focus-visible) .locker-door{transform:rotateY(28deg)}.locker:is(:hover,:focus-visible) .locker-cover{transform:translateY(-8px)}.locker:is(:hover,:focus-visible) [data-lamp]{background-color:var(--color-lamp-on);box-shadow:none}}@media (prefers-reduced-motion:reduce){.locker .locker-door,.locker[data-ajar] .locker-door{transform:rotateY(18deg)}}.directory-row{align-items:center;gap:14px;min-height:48px;padding-block:8px;display:flex;position:relative}.directory-track{flex:1;align-self:stretch;align-items:center;min-width:12px;display:flex;position:relative}.directory-rule{background-color:var(--color-border);height:1px;transition:background-color var(--dur-micro) var(--ease-std);flex:1}.directory-peek{display:none}@media (min-width:1024px){.directory-row{min-height:56px}}@media (hover:hover) and (pointer:fine){.directory-peek{background-color:var(--color-rig);opacity:0;transition:opacity var(--dur-ui) var(--ease-std), transform var(--dur-ui) var(--ease-latch);gap:4px;margin-top:-20px;padding-left:10px;display:flex;position:absolute;top:50%;right:0;transform:translate(16px)}.directory-row:is(:hover,:focus-visible) .directory-peek{opacity:1;transform:none}.directory-row:is(:hover,:focus-visible) .directory-rule{background-color:var(--color-text)}}.budget-dial{--dial:232px;width:calc(var(--dial) * 1.72);max-width:100%;height:calc(var(--dial) * 1.5);margin-inline:auto;position:relative}.budget-dial-face{width:var(--dial);height:var(--dial);cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.budget-dial[data-dragging] .budget-dial-face{cursor:grabbing}.budget-dial-face:focus-visible{outline-offset:4px}.budget-ring{transform-origin:150px 150px;transform-box:view-box;transition:transform var(--dur-panel) var(--ease-latch)}.budget-numeral{transition:transform var(--dur-panel) var(--ease-latch)}.budget-readout{pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.budget-label{min-height:44px;color:var(--color-text-secondary);font-family:var(--font-mono);white-space:nowrap;cursor:pointer;transition:transform var(--dur-panel) var(--ease-latch), color var(--dur-micro) var(--ease-std), box-shadow var(--dur-micro) var(--ease-std);align-items:center;padding:0 8px;font-size:.8125rem;display:inline-flex;position:absolute;top:50%;left:50%}.budget-label-on{color:var(--color-text);box-shadow:inset 0 -2px 0 var(--color-accent);font-weight:600}.budget-label:disabled{color:var(--color-text-tertiary);cursor:not-allowed;text-decoration:line-through}@media (hover:hover) and (pointer:fine){.budget-label:not(:disabled):hover{color:var(--color-text)}}.budget-dial[data-dragging] :is(.budget-ring,.budget-numeral,.budget-label){transition:none}.budget-item{animation:plate-in var(--dur-ui) var(--ease-latch) calc(var(--i,0) * 40ms) both}@media (min-width:1024px){.budget-dial{--dial:248px;margin-inline:0}}@media (min-width:1440px){.budget-dial{--dial:272px}}@media (min-width:1536px){.budget-dial{--dial:300px}}.th-mini-narrow .th-box{max-width:300px}
