:root{color-scheme:dark;font-family:Microsoft YaHei,PingFang SC,Noto Sans CJK SC,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#03040a;color:#f8fbff;font-synthesis:none;text-rendering:geometricPrecision;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{min-width:320px;background:#03040a}button,input{font:inherit}button{color:inherit}.app-shell{position:relative;isolation:isolate}.world-canvas{position:fixed;inset:0;width:100%;height:100%;display:block;background:#03040a;cursor:crosshair;touch-action:none}.hud-root{position:fixed;inset:0;z-index:3;pointer-events:none}.hud-panel{position:fixed;pointer-events:auto;border:1px solid rgba(231,244,255,.13);border-radius:8px;background:linear-gradient(135deg,#070911d1,#0d0e18a3),#03040ab8;box-shadow:0 16px 48px #0000006b,inset 0 1px #ffffff0f;-webkit-backdrop-filter:blur(14px) saturate(132%);backdrop-filter:blur(14px) saturate(132%)}.hud-top{left:clamp(10px,2vw,24px);top:clamp(10px,2vw,24px);width:min(390px,calc(100vw - 20px));padding:10px}.hud-left{left:clamp(10px,2vw,24px);top:clamp(96px,15vh,136px);width:min(250px,calc(50vw - 18px));max-height:min(530px,calc(100vh - 232px));padding:9px;overflow:auto}.hud-right{right:clamp(10px,2vw,24px);top:clamp(10px,2vw,24px);width:min(270px,calc(50vw - 18px));max-height:min(520px,calc(100vh - 174px));padding:9px;overflow:auto}.hud-scenes{right:clamp(10px,2vw,24px);bottom:clamp(84px,12vh,118px);width:min(560px,calc(100vw - 20px));padding:9px}.hud-bottom{left:50%;bottom:max(10px,env(safe-area-inset-bottom));display:grid;grid-template-columns:auto auto minmax(126px,166px) minmax(126px,166px) repeat(4,auto);align-items:center;gap:7px;width:min(1080px,calc(100vw - 20px));padding:9px;transform:translate(-50%)}.brand{display:flex;align-items:center;gap:10px}.brand-mark{display:grid;width:36px;height:36px;place-items:center;border:1px solid rgba(255,218,116,.48);border-radius:8px;background:linear-gradient(135deg,#ff783433,#7cf6ff1f),#ffffff0a;color:#ffe18a;font-weight:900;text-shadow:0 0 12px rgba(255,170,58,.85),0 0 24px rgba(116,246,255,.34)}.brand h1,.brand p,.hud-label{margin:0}.brand h1{font-size:20px;line-height:1}.brand p{margin-top:4px;color:#e2eef9b3;font-size:12px}.stats-line{min-height:28px;margin-top:9px;overflow:hidden;padding:7px 8px;border:1px solid rgba(255,255,255,.07);border-radius:6px;background:#ffffff0b;color:#edf6ffd6;font-size:12px;line-height:1.1;text-overflow:ellipsis;white-space:nowrap}.stats-line[data-visible=true]{font-family:Cascadia Code,Consolas,SFMono-Regular,ui-monospace,monospace;font-size:11px}.hud-label{margin-bottom:7px;color:#f7fcffeb;font-size:12px;font-weight:780}.material-grid,.spell-grid,.scene-grid{display:grid;gap:6px}.material-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.spell-grid{grid-template-columns:1fr}.scene-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.material-button,.spell-button,.scene-button,.command-button,.segmented button{min-height:34px;border:1px solid rgba(221,244,255,.12);border-radius:6px;background:#06081094;color:#f1f8ffe6;line-height:1.1;cursor:pointer;transition:border-color .14s ease,background .14s ease,color .14s ease,box-shadow .14s ease,transform .14s ease}.material-button:hover,.spell-button:hover,.scene-button:hover,.command-button:hover,.segmented button:hover{border-color:#87f7ff80;background:#16242cb8;transform:translateY(-1px)}.material-button[data-active=true],.spell-button[data-active=true],.scene-button[data-active=true],.command-button[data-active=true],.segmented button[data-active=true]{border-color:#ffdd7ec2;background:linear-gradient(135deg,#ffdd7e2e,#6ff4ff26),#080a12ad;box-shadow:0 0 22px #6ff4ff2b,inset 0 0 18px #ffdd7e12;color:#fff}.material-button{display:grid;grid-template-columns:14px minmax(0,1fr);align-items:center;gap:7px;padding:7px;text-align:left}.material-button span:last-child,.spell-button span:last-child,.scene-button{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.swatch{width:13px;height:13px;border:1px solid rgba(255,255,255,.28);border-radius:3px;background:var(--swatch);box-shadow:0 0 12px color-mix(in srgb,var(--swatch),transparent 35%)}.spell-button{display:grid;grid-template-columns:31px minmax(0,1fr);align-items:center;gap:8px;padding:6px 8px;text-align:left}.spell-glyph{display:grid;width:27px;height:27px;place-items:center;border-radius:6px;background:#ffffff0f;color:var(--spell);font-weight:900;text-shadow:0 0 12px var(--spell)}.scene-button{justify-items:start;min-height:38px;padding:0 9px;text-align:left}.segmented{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(58px,1fr);gap:4px;padding:4px;border:1px solid rgba(255,255,255,.1);border-radius:8px;background:#0000003d}.segmented button{min-height:32px;padding:0 10px}.command-button{min-width:60px;padding:0 11px}.range-control{display:grid;grid-template-columns:auto minmax(74px,1fr) 32px;align-items:center;gap:8px;min-height:38px;padding:0 9px;border:1px solid rgba(221,244,255,.12);border-radius:8px;background:#06081094;color:#ecf6ffdb;font-size:12px}.range-control input{width:100%;accent-color:#83f4ff}.range-control span{color:#ffe08a;font-family:Cascadia Code,Consolas,SFMono-Regular,ui-monospace,monospace;text-align:right}.loading{position:fixed;left:50%;top:50%;z-index:5;display:inline-flex;align-items:center;gap:12px;padding:11px 14px;border:1px solid rgba(255,255,255,.18);border-radius:8px;background:#05060ec7;color:#f4faffe6;transform:translate(-50%,-50%);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.loading[hidden]{display:none}.loading__rune{width:12px;height:12px;border-radius:3px;background:#8bf7ff;box-shadow:0 0 18px #8bf7ffe6,0 0 34px #ffe08a8c;animation:rune-pulse .95s ease-in-out infinite}.fallback{position:fixed;inset:0;z-index:6;display:grid;align-content:center;justify-items:start;gap:12px;padding:clamp(24px,7vw,92px);background:#04050c}.fallback[hidden]{display:none}.fallback__eyebrow,.fallback h1,.fallback p{max-width:620px;margin:0}.fallback__eyebrow{color:#8bf7ff;font-size:12px}.fallback h1{color:#fff;font-size:clamp(32px,7vw,72px);line-height:1}.fallback p{color:#e2f0ffb8;font-size:clamp(15px,2vw,18px);line-height:1.6}@keyframes rune-pulse{0%,to{opacity:.68;transform:rotate(0) scale(.82)}50%{opacity:1;transform:rotate(45deg) scale(1.15)}}@media(max-width:960px){.hud-scenes{display:none}.hud-bottom{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:760px){.hud-top{width:min(330px,calc(100vw - 20px));padding:8px}.brand h1{font-size:18px}.stats-line{font-size:11px}.hud-left,.hud-right{inset:auto auto 178px 10px;width:calc(100vw - 20px);max-height:22vh;padding:7px}body[data-mode=spell] .hud-left,body[data-mode=paint] .hud-right{display:none}.hud-bottom{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:8px}.material-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.spell-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.material-button,.spell-button,.command-button,.segmented button{min-height:34px;font-size:12px}}@media(max-width:480px){.hud-left,.hud-right{bottom:184px;max-height:20vh}.range-control{grid-template-columns:auto minmax(42px,1fr) 28px}}@media(prefers-reduced-motion:reduce){.loading__rune{animation:none}.material-button,.spell-button,.scene-button,.command-button,.segmented button{transition:none}}