*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0}body{overscroll-behavior:none;background:#000;font-family:system-ui,-apple-system,sans-serif;overflow:hidden}.app{position:fixed;inset:0}.canvas-shell{cursor:none;width:100%;height:100%;position:absolute;inset:0}.demo-canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.css-stage{cursor:none;touch-action:none;width:100%;height:100%;position:absolute;inset:0}.reveal-layer{-webkit-mask-composite:source-over;-webkit-mask-composite:source-over;mask-composite:add}.css-lens-full{-webkit-backdrop-filter:saturate(1.15)brightness(1.03)url(#liquid-glass);backdrop-filter:saturate(1.15)brightness(1.03)url(#liquid-glass);-webkit-mask-composite:source-over;filter:drop-shadow(0 0 1px #ffffff73);pointer-events:none;width:100%;height:100%;position:absolute;inset:0;-webkit-mask-composite:source-over;mask-composite:add}.svg-filters{pointer-events:none;width:0;height:0;position:absolute}.layer{background-position:50%;background-repeat:no-repeat;background-size:cover;width:100%;height:100%;position:absolute;inset:0}.nav-zone{cursor:default;z-index:10;align-items:center;width:130px;display:flex;position:absolute;top:0;bottom:0}.nav-zone-left{justify-content:flex-start;padding-left:18px;left:0}.nav-zone-right{justify-content:flex-end;padding-right:18px;right:0}.nav{color:#ffffffd9;cursor:pointer;-webkit-backdrop-filter:blur(12px)saturate(140%);backdrop-filter:blur(12px)saturate(140%);background:#00000059;border:1px solid #ffffff24;border-radius:50%;place-items:center;width:56px;height:56px;font-size:30px;line-height:1;transition:background .2s,transform .15s;display:grid}.nav:hover{background:#0000008c}.nav:active{transform:scale(.93)}.label{color:#ffffffd9;letter-spacing:.02em;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:10;text-align:center;background:#00000059;border:1px solid #ffffff1f;border-radius:999px;max-width:90vw;margin:0;padding:8px 18px;font-size:13px;position:absolute;top:22px;left:50%;transform:translate(-50%)}.hint{color:#ffffffbf;letter-spacing:.01em;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:10;text-align:center;background:#0006;border:1px solid #ffffff1f;border-radius:999px;max-width:90vw;margin:0;padding:9px 18px;font-size:13px;position:absolute;bottom:28px;left:50%;transform:translate(-50%)}@media (width<=640px){.nav-zone{width:86px}.nav{width:46px;height:46px;font-size:26px}.label{padding:7px 14px;font-size:12px;top:14px}.hint{padding:8px 14px;font-size:12px;bottom:18px}.engine-badge{font-size:11px;bottom:52px;left:12px}}.engine-badge{letter-spacing:.02em;color:#ffffffd9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:11;-webkit-user-select:none;user-select:none;background:#0006;border:1px solid #ffffff1f;border-radius:999px;align-items:center;gap:8px;max-width:calc(100vw - 44px);padding:6px 8px 6px 12px;font-size:12px;display:flex;position:absolute;bottom:24px;left:22px}.engine-badge .dot{border-radius:50%;width:8px;height:8px}.engine-badge.liquid .dot{background:#4ff0d6;box-shadow:0 0 8px #4ff0d6}.engine-badge.css .dot{background:#ffb454;box-shadow:0 0 8px #ffb454}.badge-x{color:#ffffff80;cursor:pointer;background:0 0;border:0;border-radius:50%;place-items:center;width:18px;height:18px;font-size:15px;line-height:1;display:grid}.badge-x:hover{color:#fffffff2;background:#ffffff1a}.badge-cta{color:#0a0c0f;cursor:pointer;white-space:nowrap;background:#4ff0d6;border:0;border-radius:999px;margin-left:4px;padding:3px 9px;font-size:11px;font-weight:600}.badge-cta:hover{background:#7af5e2}.help-overlay{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:50;background:#0000008c;place-items:center;padding:24px;display:grid;position:fixed;inset:0;overflow-y:auto}.help-panel{color:#e6ebf2;background:#12161ceb;border:1px solid #ffffff1f;border-radius:18px;width:100%;max-width:460px;max-height:calc(100dvh - 48px);padding:26px 28px;line-height:1.55;overflow-y:auto;box-shadow:0 24px 70px #0009}.help-panel h2{margin:0 0 12px;font-size:19px}.help-panel p{color:#e6ebf2cc;margin:0 0 14px;font-size:14px}.help-panel ol{margin:0 0 20px;padding-left:20px;font-size:14px}.help-panel li{margin-bottom:8px}.help-panel code{word-break:break-all;background:#0c0e12;border-radius:5px;padding:2px 6px;font-size:12.5px}.help-actions{gap:10px;display:flex}.help-actions button{cursor:pointer;border:1px solid #0000;border-radius:10px;flex:1;padding:10px 14px;font-size:14px}.help-actions .primary{color:#0a0c0f;background:#4ff0d6;font-weight:600}.help-actions .primary:hover{background:#7af5e2}.help-actions .ghost{color:#e6ebf2;background:0 0;border-color:#ffffff2e}.help-actions .ghost:hover{background:#ffffff14}.fallback{color:#dcdcdc;max-width:640px;margin:18vh auto 0;padding:0 28px;line-height:1.6}.fallback code{background:#1c1c1c;border-radius:5px;padding:2px 7px;font-size:.92em}