.tap-target{min-width:44px;min-height:44px}.game-rail{grid-template-columns:repeat(4,minmax(0,1fr));min-height:48px;max-height:52px;display:grid}.game-rail__item,.bottom-nav__item,.service-card{color:inherit;font:inherit;background:0 0;border:0;padding:0}.game-rail__item .glass-surface,.bottom-nav__item .glass-surface,.service-card .glass-surface{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.game-rail__item svg{width:18px;height:18px}.service-grid{grid-template-rows:repeat(7,clamp(22px,3.7dvh,34px));grid-template-columns:repeat(12,minmax(0,1fr));display:grid}.service-card--wide{grid-area:span 2/span 7}.service-card--compact{grid-area:span 2/span 5}.service-card--tall{grid-area:span 3/span 5}.service-card--medium{grid-area:span 3/span 7}.service-card:first-child{grid-area:1/1/span 2/span 7}.service-card:nth-child(2){grid-area:1/8/span 2/span 5}.service-card:nth-child(3){grid-area:3/1/span 3/span 5}.service-card:nth-child(4){grid-area:6/1/span 2/span 5}.service-card:nth-child(5){grid-area:6/6/span 2/span 7}.service-card:nth-child(6){grid-area:3/6/span 3/span 7}@media (max-height:560px){.service-grid{grid-template-rows:repeat(2,44px)}.service-card:first-child{grid-area:1/1/auto/span 5}.service-card:nth-child(2){grid-area:1/6/auto/span 3}.service-card:nth-child(3){grid-area:1/9/auto/span 4}.service-card:nth-child(4){grid-area:2/1/auto/span 3}.service-card:nth-child(5){grid-area:2/4/auto/span 5}.service-card:nth-child(6){grid-area:2/9/auto/span 4}}.bottom-nav{grid-template-columns:repeat(5,minmax(0,1fr));display:grid}.experimental-placeholder{width:min(82vw,360px);color:inherit;-webkit-backdrop-filter:blur(24px)saturate(112%);backdrop-filter:blur(24px)saturate(112%);background:#161f1ec7;border:1px solid #d6e2dd2e;border-radius:24px;margin:auto;padding:24px;position:fixed;inset:0;box-shadow:0 24px 64px #0000007a,inset 0 1px #ffffff12}.experimental-placeholder[open]{gap:12px;display:grid}.experimental-placeholder:not([open]){display:none}.experimental-placeholder::backdrop{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#020707b8}.experimental-placeholder h2,.experimental-placeholder p{margin:0}.experimental-placeholder__close{color:inherit;font:inherit;background:#dde7e21a;border:1px solid #d6e2dd33;border-radius:999px;justify-self:end;padding:0 18px}.experimental-placeholder__close:focus-visible{outline-offset:3px;outline:2px solid #eee2c2d1}.glass-surface{isolation:isolate;border:1px solid var(--glass-border);border-radius:inherit;background:var(--glass-fill);box-shadow:var(--glass-inner-highlight), var(--glass-shadow);position:relative;overflow:hidden}.glass-surface--real{-webkit-backdrop-filter:blur(var(--blur-real)) saturate(1.12);backdrop-filter:blur(var(--blur-real)) saturate(1.12)}.glass-surface--simulated{background:linear-gradient(145deg, #ffffff12, transparent 48%), var(--glass-fill-strong)}.glass-surface--preblur:before{z-index:-1;content:"";filter:blur(var(--blur-real)) saturate(.9);opacity:.5;background:url(/lancelot-gamepal-ui-playground/assets/character-source.png) 50% 34%/cover;position:absolute;inset:-28px;transform:scale(1.08)}.glass-surface--off{background:var(--glass-fill-strong)}.glass-surface--selected{border-color:var(--glass-border-selected);box-shadow:var(--glass-inner-highlight), var(--glass-shadow), var(--selected-glow)}.experiment-panel__scrim{z-index:var(--panel-z);background:#02070775;place-items:end center;display:grid;position:fixed;inset:0}.experiment-panel{width:min(520px,100%);height:min(82dvh, calc(var(--app-height) - max(8px, var(--safe-top))));max-height:var(--app-height);border-radius:var(--radius-lg) var(--radius-lg) 0 0;background:#0c1211eb;overflow:hidden}.home-screen__experiment-toggle{border:1px solid var(--glass-border);border-radius:var(--radius-sm);color:var(--color-text);font:inherit;background:#ffffff0d;margin-left:auto}.home-screen__experiment-toggle:disabled{opacity:.56}.home-screen__experiment-toggle+.home-screen__experiment-toggle{margin-left:0}.experiment-panel__content{grid-template-rows:auto auto minmax(0,1fr) auto;height:100%;min-height:0;display:grid}.experiment-panel__heading{border-bottom:1px solid var(--glass-border);background:#0a0f0fd1;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px 10px;display:flex}.experiment-panel__heading h2,.experiment-panel__heading p,.experiment-panel__suite h3,.experiment-panel__suite p,.experiment-panel__single-run h3,.experiment-panel__single-run p{margin:0}.experiment-panel__heading h2{color:var(--color-text);font-family:var(--font-brand);letter-spacing:.04em;font-size:18px}.experiment-panel__heading p{color:var(--color-text-muted);margin-top:2px;font-size:11px}.experiment-panel__close,.experiment-panel__action{border:1px solid var(--glass-border);border-radius:var(--radius-sm);color:var(--color-text);cursor:pointer;background:#ffffff0f;font-size:12px}.experiment-panel__close:disabled,.experiment-panel__action:disabled{cursor:not-allowed;opacity:.48}.experiment-panel__suite{border:1px solid var(--glass-border);border-radius:var(--radius-md);background:linear-gradient(145deg,#2035319e,#0d1312d1);gap:9px;margin:10px 14px 0;padding:11px 12px;display:grid}.experiment-panel__suite-heading,.experiment-panel__suite-status{justify-content:space-between;align-items:center;gap:10px;display:flex}.experiment-panel__suite-heading h3,.experiment-panel__single-run h3{color:var(--color-text);font-size:13px}.experiment-panel__suite-heading p,.experiment-panel__single-run p{color:var(--color-text-muted);font-family:var(--font-mono);margin-top:2px;font-size:10px}.experiment-panel__progress{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:0;padding:0;list-style:none;display:grid}.experiment-panel__progress li{min-width:0;color:var(--color-text-muted);text-align:center;font-size:9px}.experiment-panel__progress li:before{border:1px solid var(--glass-border);content:"";background:#ffffff0d;border-radius:999px;height:4px;margin-bottom:4px;display:block}.experiment-panel__progress li[data-state=active]{color:var(--color-accent-strong)}.experiment-panel__progress li[data-state=active]:before{border-color:var(--glass-border-selected);background:var(--color-accent)}.experiment-panel__progress li[data-state=completed]{color:var(--color-success)}.experiment-panel__progress li[data-state=completed]:before{background:var(--color-success);border-color:#a9dda9a6}.experiment-panel__suite-status strong{min-width:0;color:var(--color-text);text-overflow:ellipsis;white-space:nowrap;font-size:11px;overflow:hidden}.experiment-panel__suite-status>div{flex:none;gap:6px;display:flex}.experiment-panel__suite-status .experiment-panel__action{min-height:36px;padding-inline:10px}.experiment-panel__results{border-collapse:collapse;width:100%;color:var(--color-text-muted);font-family:var(--font-mono);text-align:right;font-size:9px}.experiment-panel__results th,.experiment-panel__results td{border-top:1px solid var(--glass-border);padding:4px 3px}.experiment-panel__results th:first-child{color:var(--color-text);font-family:var(--font-ui);text-align:left;font-weight:400}.experiment-panel__body{overscroll-behavior:contain;scrollbar-gutter:stable;gap:13px;min-height:0;padding:14px;display:grid;overflow-y:auto}.experiment-panel__group{border:0;gap:8px;min-width:0;margin:0;padding:0;display:grid}.experiment-panel__group legend{color:var(--color-text);margin:0;font-size:12px;font-weight:700}.experiment-panel__options,.experiment-panel__toggles{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.experiment-panel__option,.experiment-panel__toggle{border-radius:var(--radius-sm);min-height:44px;color:var(--color-text);cursor:pointer;align-items:center;gap:8px;padding:8px 10px;font-size:12px;display:flex}:is(.experiment-panel__option:has(input:disabled),.experiment-panel__toggle:has(input:disabled)){cursor:not-allowed;opacity:.48}.experiment-panel__option input,.experiment-panel__toggle input{accent-color:var(--color-accent-strong);flex:none}.experiment-panel__toggle{border:1px solid var(--glass-border);background:var(--glass-fill)}.experiment-panel__single-run{justify-content:space-between;align-items:center;gap:10px;padding-top:2px;display:flex}.experiment-panel__single-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:min(250px,68%);display:grid}.experiment-panel__footer{padding:10px 14px max(10px, var(--safe-bottom));border-top:1px solid var(--glass-border);background:#090e0eeb;gap:6px;display:grid}.experiment-panel__report-actions{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;display:grid}.experiment-panel__footer output{color:var(--color-accent-strong);text-align:center;font-size:11px}@media (max-width:360px){.experiment-panel__options,.experiment-panel__toggles{grid-template-columns:1fr}.experiment-panel__single-run{flex-direction:column;align-items:stretch}.experiment-panel__single-actions{width:100%}}@media (max-height:560px){.experiment-panel{height:calc(var(--app-height) - max(4px, var(--safe-top)));max-height:calc(var(--app-height) - max(4px, var(--safe-top)))}.experiment-panel__heading{padding:5px 12px 4px}.experiment-panel__heading p{display:none}.experiment-panel__suite{gap:3px;margin:4px 10px 0;padding:4px 8px}.experiment-panel__suite-heading p,.experiment-panel__progress span{display:none}.experiment-panel__progress{gap:4px}.experiment-panel__progress li:before{margin-bottom:0}.experiment-panel__results th,.experiment-panel__results td{padding:1px 3px}.experiment-panel__body{gap:8px;padding:8px 10px}.experiment-panel__footer{padding:5px 10px max(5px, var(--safe-bottom));gap:3px}.experiment-panel__report-actions{gap:4px}}@media (min-width:720px){.experiment-panel__scrim{padding-bottom:16px}.experiment-panel{border-radius:var(--radius-lg)}}.performance-hud{z-index:var(--hud-z);top:calc(var(--safe-top) + 60px);right:calc(var(--safe-right) + 12px);border-radius:var(--radius-sm);min-width:44px;min-height:44px;color:var(--color-text-muted);cursor:pointer;font-family:var(--font-mono);background:0 0;border:0;padding:0;font-size:11px;position:fixed}.performance-hud:disabled{cursor:not-allowed;opacity:.66}.performance-hud__surface{border-radius:inherit;min-height:44px;padding:9px 11px}.performance-hud--compact .performance-hud__surface{white-space:nowrap;align-items:center;gap:8px;display:flex}.performance-hud--expanded .performance-hud__surface{width:min(220px, calc(100vw - var(--safe-left) - var(--safe-right) - 24px));grid-template-columns:repeat(2,auto);gap:5px 10px;display:grid}.performance-hud__metric{align-items:baseline;gap:5px;display:flex}.performance-hud--compact .performance-hud__metric+.performance-hud__metric:before{color:var(--glass-border-selected);content:"·"}.performance-hud--expanded .performance-hud__metric{display:contents}.performance-hud__metric strong{color:var(--color-text);text-align:right;font-weight:600}.particle-field{z-index:-2;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.home-screen{--home-header-block:calc(var(--safe-top) + 54px);--home-content-reserve:calc(172px + clamp(154px, 25.9dvh, 238px));min-height:var(--app-height);isolation:isolate;background:radial-gradient(circle at 50% 26%, #2746404d, transparent 46%), linear-gradient(180deg, #101817 0%, var(--color-ink) 72%, #060909 100%);position:relative;overflow-x:clip}.home-screen:before{z-index:-1;content:"";pointer-events:none;background:linear-gradient(#05090924 0%,#05090905 34%,#05090994 72%,#050909e0 100%);position:absolute;inset:0}.home-screen__character{z-index:-2;filter:saturate(.74)contrast(1.04);transform:translate3d(calc(var(--parallax-x,0) * 1px), calc(var(--parallax-y,0) * 1px), 0);transition:transform var(--duration-fast) var(--ease-out);background-image:url(/lancelot-gamepal-ui-playground/assets/character-source.png);background-position:50% 30%;background-repeat:no-repeat;background-size:cover;position:absolute;inset:0}.home-screen__header{z-index:1;padding:calc(var(--safe-top) + 10px) calc(var(--safe-right) + 18px) 0 calc(var(--safe-left) + 18px);letter-spacing:.08em;align-items:center;gap:10px;display:flex;position:relative}.home-screen__mark{border:1px solid var(--glass-border-selected);width:30px;height:30px;color:var(--color-accent-strong);font-family:var(--font-brand);border-radius:9px;place-items:center;font-size:18px;display:grid}.home-screen__brand{font-family:var(--font-brand);font-size:18px}.home-screen__content{z-index:1;padding:clamp(0px, min(calc(42dvh - var(--home-header-block)), calc(var(--app-height) - var(--home-header-block) - var(--safe-bottom) - var(--home-content-reserve))), 338px) calc(var(--safe-right) + 14px) calc(88px + var(--safe-bottom)) calc(var(--safe-left) + 14px);gap:10px;display:grid;position:relative}.home-screen .game-rail{gap:7px}.home-screen .game-rail__item{border-radius:var(--radius-sm);font-size:clamp(10px,2.8vw,13px)}.home-screen .game-rail__item .glass-surface{gap:6px;padding-inline:6px}.home-screen .service-grid{gap:7px}.home-screen .service-card{border-radius:var(--radius-md);font-size:clamp(13px,3.6vw,16px)}.home-screen[data-card-float=true] .service-card{animation:home-card-float var(--card-float-duration,4.5s) var(--ease-out) infinite alternate}.home-screen .service-card:active{transform:scale(.98)}@keyframes home-card-float{0%{translate:0}to{translate:0 calc(-1 * var(--card-float-distance,3px))}}.home-screen .bottom-nav{z-index:var(--hud-z);min-height:calc(72px + var(--safe-bottom));padding:10px calc(var(--safe-right) + 12px) var(--safe-bottom) calc(var(--safe-left) + 12px);background:linear-gradient(#0000,#05090985 34%);gap:7px;position:fixed;bottom:0;left:0;right:0}.home-screen .bottom-nav__item{border-radius:var(--radius-sm);font-size:12px}@media (max-height:560px){.home-screen{--home-content-reserve:220px}.home-screen__content,.home-screen .service-grid{gap:6px}}@media (min-width:720px){.home-screen__header{padding-right:max(5vw, calc(var(--safe-right) + 28px));padding-left:max(5vw, calc(var(--safe-left) + 28px))}.home-screen__content{width:min(720px,100%);padding-right:max(24px, var(--safe-right));padding-left:max(24px, var(--safe-left));margin-inline:auto}.home-screen .bottom-nav{width:min(720px,100%);left:auto;right:50%;transform:translate(50%)}}@media (prefers-reduced-motion:reduce){.home-screen__character{filter:saturate(.7)}}@font-face{font-family:LSVIS TD Demo;src:url(/lancelot-gamepal-ui-playground/assets/fonts/lsvis-td.woff2)format("woff2");font-display:swap;font-style:normal;font-weight:400}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--font-brand:"LSVIS TD Demo", "Microsoft YaHei UI", sans-serif;--font-ui:"LSVIS TD Demo", "Microsoft YaHei UI", sans-serif;--font-mono:"Cascadia Mono", "SFMono-Regular", Consolas, monospace;--color-ink:#090d0d;--color-graphite:#111817;--color-teal-shadow:#142321;--color-text:#f3eee5;--color-text-muted:#a8aca7;--color-accent:#edc390;--color-accent-strong:#ffd7a5;--color-success:#a9dda9;--color-danger:#e8a39b;--glass-fill:#1218178c;--glass-fill-strong:#0d1212bf;--glass-border:#ebeee629;--glass-border-selected:#f8cf9eb3;--glass-inner-highlight:inset 0 1px 0 #ffffff14;--glass-shadow:0 18px 50px #0000004d;--selected-glow:0 0 18px #eebd8438;--blur-real:18px;--noise-opacity:.045;--radius-sm:12px;--radius-md:18px;--radius-lg:24px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--duration-fast:.14s;--duration-medium:.28s;--duration-slow:.7s;--ease-out:cubic-bezier(.2, .8, .2, 1);--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--app-height:100dvh;--hud-z:40;--panel-z:60}*{box-sizing:border-box}html{background:var(--color-ink);-webkit-text-size-adjust:100%;min-width:320px;min-height:100%;overflow-x:hidden}body{background:var(--color-ink);min-width:320px;min-height:100%;color:var(--color-text);font-family:var(--font-ui);overscroll-behavior-y:none;-webkit-font-smoothing:antialiased;margin:0;overflow-x:hidden}button,input,select,textarea{color:inherit;font:inherit}button{border:0}button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--color-accent-strong);outline-offset:3px}#root{min-height:100svh;min-height:var(--app-height)}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}