:root{--p31-base: 16px;--p31-bg: oklch(10% .01 240);--p31-surface: oklch(15% .015 240);--p31-surface2: oklch(22% .02 240);--p31-accent: oklch(65% .18 195);--p31-accent-alt: oklch(65% .18 285);--p31-accent-violet: oklch(65% .18 285);--p31-accent-gold: oklch(65% .18 15);--p31-accent-green: oklch(65% .18 105);--p31-accent-red: oklch(65% .18 20);--p31-accent-iris: oklch(65% .18 270);--p31-text: oklch(96% .005 240);--p31-text-secondary: oklch(75% .01 240);--p31-text-tertiary: oklch(55% .01 240);--p31-glass-bg: oklch(100% .01 240 / .04);--p31-glass-border: oklch(100% .01 240 / .08);--p31-glass-border-hover: oklch(100% .01 240 / .15);--p31-glass-shadow: 0 8px 32px rgba(0,0,0,.15);--p31-glass-blur: blur(12px);--p31-glow-cyan: 0 0 20px rgba(0,240,255,.25);--p31-scale-xs: calc(var(--p31-base) * .75);--p31-scale-sm: var(--p31-base);--p31-scale-md: calc(var(--p31-base) * 1.3333);--p31-scale-lg: calc(var(--p31-base) * 1.7777);--p31-scale-xl: calc(var(--p31-base) * 2.3703);--p31-scale-2xl: calc(var(--p31-base) * 3.1604);--p31-scale-3xl: calc(var(--p31-base) * 4.2139);--p31-scale-4xl: calc(var(--p31-base) * 5.6186);--p31-type-caption: clamp(var(--p31-scale-xs), .8vw, var(--p31-scale-sm));--p31-type-body: clamp(calc(var(--p31-base) * .95), 1vw + .5rem, var(--p31-scale-sm));--p31-type-label: var(--p31-scale-sm);--p31-type-h3: clamp(var(--p31-scale-md), 2vw, var(--p31-scale-lg));--p31-type-h2: clamp(var(--p31-scale-lg), 3.5vw, var(--p31-scale-xl));--p31-type-h1: clamp(var(--p31-scale-xl), 5.6vw, var(--p31-scale-2xl));--p31-type-display: clamp(var(--p31-scale-2xl), 7vw, var(--p31-scale-3xl));--p31-font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--p31-font-mono: ui-monospace, SFMono-Regular, "Fira Code", "Fira Mono", "Roboto Mono", "JetBrains Mono", Menlo, Monaco, Consolas, monospace;--p31-font-display: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--p31-duration-fast: .1s;--p31-duration-normal: .3s;--p31-duration-slow: .5s;--p31-easing-smooth: cubic-bezier(.4, 0, .2, 1);--p31-easing-snappy: cubic-bezier(.34, 1.56, .64, 1);--p31-easing-linear: linear;--p31-speed-factor: 1;--p31-starfield-hearth: oklch(55% .15 35);--p31-starfield-teal: oklch(60% .08 185);--p31-starfield-remembrance: oklch(95% .01 80);--p31-starfield-particle-teal: oklch(70% .12 185 / .6);--p31-starfield-particle-coral: oklch(65% .14 40 / .5);--p31-blur-subtle: 8px;--p31-blur-standard: 12px;--p31-blur-strong: 24px;--p31-space-xs: clamp(var(--p31-scale-xs), 1vw, var(--p31-scale-sm));--p31-space-sm: clamp(var(--p31-scale-sm), 1.5vw, var(--p31-scale-md));--p31-space-md: clamp(var(--p31-scale-md), 2.5vw, var(--p31-scale-lg));--p31-space-lg: clamp(var(--p31-scale-lg), 3.5vw, var(--p31-scale-xl));--p31-space-xl: clamp(var(--p31-scale-xl), 5vw, var(--p31-scale-2xl));--p31-space-2xl: clamp(var(--p31-scale-2xl), 6.5vw, var(--p31-scale-3xl));--p31-space-3xl: 64px;--p31-radius-sm: calc(var(--p31-scale-sm) / 2);--p31-radius-md: calc(var(--p31-scale-md) / 2);--p31-radius-lg: calc(var(--p31-scale-lg) / 2);--p31-radius-xl: calc(var(--p31-scale-xl) / 2);--p31-radius-full: 9999px;--p31-touch-min: 48px;--p31-touch-recommended: 56px;--p31-touch-large: 64px;--p31-z-starfield: 0;--p31-z-topbar: 10;--p31-z-toast: 9999;--p31-z-crisis: 99999;--p31-z-skip-link: 100;--p31-space-xs-legacy: 4px;--p31-space-sm-legacy: 8px;--p31-space-md-legacy: 16px;--p31-space-lg-legacy: 24px;--p31-space-xl-legacy: 32px;--p31-space-2xl-legacy: 48px;--p31-space-3xl-legacy: 64px;--p31-duration-fast-legacy: .1s;--p31-duration-normal-legacy: .3s;--p31-duration-slow-legacy: .5s;--p31-ease-out-legacy: cubic-bezier(.4, 0, .2, 1);--p31-ease-in-out-legacy: linear}:root{--site-bg: var(--p31-bg);--site-surface: var(--p31-surface);--site-accent: var(--p31-accent);--site-accent-alt: var(--p31-accent-alt);--site-accent-gold: var(--p31-accent-gold);--site-success: var(--p31-accent-green);--site-error: var(--p31-accent-red);--site-glass: var(--p31-glass-bg);--site-glass-hover: var(--p31-glass-border-hover);--site-border: var(--p31-glass-border);--site-border-strong: var(--p31-glass-border-hover);--site-text: var(--p31-text);--site-text-dim: var(--p31-text-secondary);--site-shadow: 0 20px 60px rgba(0,0,0,.6);--site-glow: radial-gradient(circle at 50% 30%, var(--site-accent) 0%, transparent 60%)}*{box-sizing:border-box}body{background:var(--p31-bg);color:var(--p31-text);font-family:var(--p31-font-sans);-webkit-font-smoothing:antialiased;margin:0}#app{display:grid;grid-template-rows:56px 1fr 56px;grid-template-columns:240px 1fr 240px;grid-template-areas:"topbar topbar topbar" "left main right" "bottombar bottombar bottombar";min-height:100vh}#topbar{grid-area:topbar;background:var(--p31-glass-bg);-webkit-backdrop-filter:var(--p31-glass-blur);backdrop-filter:var(--p31-glass-blur);border-bottom:1px solid var(--p31-glass-border);z-index:var(--p31-z-topbar);display:flex;align-items:center;justify-content:space-between;padding:0 var(--p31-space-md);gap:var(--p31-space-sm);box-shadow:0 2px 20px #0003}.topbar-logo{font-size:16px;font-weight:700;background:linear-gradient(135deg,var(--p31-accent-violet),var(--p31-accent-gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;white-space:nowrap;letter-spacing:1px}.topbar-metrics{display:flex;align-items:center;gap:var(--p31-space-sm);flex:1;justify-content:center;flex-wrap:wrap}.metric-badge{display:flex;align-items:center;gap:4px;padding:4px 10px;background:#ffffff0d;border:1px solid var(--p31-glass-border);border-radius:var(--p31-radius-md);font-size:11px;color:var(--p31-text-secondary);white-space:nowrap}.metric-badge strong{color:var(--p31-text);font-weight:600}.spoon-row{display:flex;gap:4px;align-items:center}.spoon{width:28px;height:28px;border-radius:50%;background:#ffffff14;border:1px solid var(--p31-glass-border);cursor:pointer;touch-action:none;min-height:36px;min-width:36px;display:flex;align-items:center;justify-content:center;transition:all var(--p31-duration-fast) var(--p31-easing-smooth);font-size:11px;color:var(--p31-text-secondary);-webkit-user-select:none;user-select:none}.spoon.active{background:var(--p31-accent);border-color:var(--p31-accent);box-shadow:0 0 12px #43e9ff66;color:#0a0a12}#left-rail{grid-area:left;background:var(--p31-glass-bg);-webkit-backdrop-filter:var(--p31-glass-blur);backdrop-filter:var(--p31-glass-blur);border-right:1px solid var(--p31-glass-border);padding:var(--p31-space-md);overflow-y:auto;display:flex;flex-direction:column;gap:var(--p31-space-md)}.rail-section h3{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--p31-text-secondary);margin-bottom:var(--p31-space-sm)}.rail-button{padding:var(--p31-space-sm) var(--p31-space-md);background:transparent;border:none;color:var(--p31-text);font-size:13px;font-weight:500;cursor:pointer;touch-action:none;min-height:40px;text-align:left;width:100%;transition:all var(--p31-duration-fast) var(--p31-easing-smooth);border-left:3px solid transparent;border-radius:0 var(--p31-radius-sm) var(--p31-radius-sm) 0}.rail-button:hover{background:#ffffff0d}.rail-button.active{background:#ffffff14;border-left-color:var(--p31-accent);color:var(--p31-accent)}#main-content{grid-area:main;overflow-y:auto;overflow-x:hidden;padding:var(--p31-space-md);display:flex;flex-direction:column;gap:var(--p31-space-md)}.page{display:none;flex-direction:column;gap:var(--p31-space-md);animation:fadeIn var(--p31-duration-normal) var(--p31-easing-smooth)}.page.active{display:flex}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.page h2{font-size:18px;font-weight:600}#right-rail{grid-area:right;background:var(--p31-glass-bg);-webkit-backdrop-filter:var(--p31-glass-blur);backdrop-filter:var(--p31-glass-blur);border-left:1px solid var(--p31-glass-border);padding:var(--p31-space-md);overflow-y:auto;display:flex;flex-direction:column;gap:var(--p31-space-md)}#navbar{grid-area:bottombar;background:var(--p31-glass-bg);-webkit-backdrop-filter:var(--p31-glass-blur);backdrop-filter:var(--p31-glass-blur);border-top:1px solid var(--p31-glass-border);z-index:var(--p31-z-topbar);display:flex;justify-content:space-around;align-items:center;padding-bottom:max(0px,env(safe-area-inset-bottom))}.nav-tab{flex:1;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;background:none;border:none;color:var(--p31-text-secondary);font-size:10px;font-weight:500;cursor:pointer;touch-action:none;min-width:40px;min-height:40px;transition:all var(--p31-duration-fast) var(--p31-easing-smooth)}.nav-tab.active{color:var(--p31-accent)}.nav-icon{font-size:16px;pointer-events:none;line-height:1}.glass-card{background:var(--p31-glass-bg);-webkit-backdrop-filter:var(--p31-glass-blur);backdrop-filter:var(--p31-glass-blur);border:1px solid var(--p31-glass-border);border-radius:var(--p31-radius-lg);padding:var(--p31-space-md);transition:all var(--p31-duration-fast) var(--p31-easing-smooth)}.glass-card:hover{border-color:var(--p31-glass-border-hover);background:#ffffff0f}.button{padding:var(--p31-space-sm) var(--p31-space-md);background:var(--p31-accent);border:none;border-radius:var(--p31-radius-md);color:#0a0a12;font-weight:600;font-size:12px;cursor:pointer;touch-action:none;min-height:40px;min-width:40px;display:inline-flex;align-items:center;justify-content:center;transition:all var(--p31-duration-fast) var(--p31-easing-smooth);-webkit-user-select:none;user-select:none}.button:active{opacity:.8;transform:scale(.95)}.button.secondary{background:#ffffff14;color:var(--p31-text)}.stat-card{background:var(--p31-glass-bg);-webkit-backdrop-filter:var(--p31-glass-blur);backdrop-filter:var(--p31-glass-blur);border:1px solid var(--p31-glass-border);border-radius:var(--p31-radius-lg);padding:var(--p31-space-md);display:flex;flex-direction:column;gap:var(--p31-space-xs)}.stat-label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--p31-text-secondary)}.stat-value{font-size:22px;font-weight:700;color:var(--p31-accent);line-height:1}.stat-change{font-size:11px;color:var(--p31-text-muted)}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--p31-space-md)}.bento-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--p31-space-md)}.col-span-full{grid-column:span 12}.col-span-third{grid-column:span 4}.col-span-two-thirds{grid-column:span 8}.col-span-half{grid-column:span 6}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--p31-space-md)}@media(max-width:1200px){.grid-4{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.grid-2,.grid-4{grid-template-columns:1fr}}.toast{position:fixed;bottom:72px;left:var(--p31-space-md);right:var(--p31-space-md);background:var(--p31-glass-bg);-webkit-backdrop-filter:var(--p31-glass-blur);backdrop-filter:var(--p31-glass-blur);border:1px solid var(--p31-glass-border);border-radius:var(--p31-radius-md);padding:var(--p31-space-sm) var(--p31-space-md);font-size:12px;z-index:var(--p31-z-toast);animation:slideUp var(--p31-duration-normal) var(--p31-easing-smooth);pointer-events:none;max-width:400px;margin:0 auto}@keyframes slideUp{0%{transform:translateY(100px);opacity:0}to{transform:translateY(0);opacity:1}}#crisis-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--p31-bg);display:none;align-items:center;justify-content:center;flex-direction:column;gap:var(--p31-space-2xl);z-index:9999}html[data-spoons="0"] #crisis-overlay{display:flex}html[data-spoons="0"] #app>*{display:none}.breathing-circle{width:100px;height:100px;border-radius:50%;background:radial-gradient(circle,var(--p31-accent),transparent);opacity:.6;animation:breathe 4s ease-in-out infinite}@keyframes breathe{0%,to{transform:scale(1);opacity:.4}50%{transform:scale(1.2);opacity:.8}}#a2ui-container{display:flex;flex-direction:column;gap:var(--p31-space-md);padding:var(--p31-space-md);margin:var(--p31-space-md) 0;border-radius:var(--p31-radius-lg);border:1px dashed var(--p31-accent-violet);background:#8656ff08;min-height:60px}#a2ui-container:empty{display:none}.skip-link{position:absolute;top:-40px;left:0;background:var(--p31-accent);color:#0a0a12;padding:var(--p31-space-sm) var(--p31-space-md);text-decoration:none;z-index:100;font-weight:600}.skip-link:focus{top:0}*:focus-visible{outline:2px solid var(--p31-accent);outline-offset:2px}.atom-palette{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--p31-space-sm)}.atom-button{aspect-ratio:1;display:flex;align-items:center;justify-content:center;background:#ffffff14;border:2px solid var(--p31-glass-border);border-radius:var(--p31-radius-md);color:var(--p31-text);font-weight:600;font-size:18px;cursor:pointer;transition:all var(--p31-duration-fast) var(--p31-easing-smooth);touch-action:none;min-height:56px}.atom-button.selected{background:var(--p31-accent-violet);border-color:var(--p31-accent-violet);box-shadow:0 0 16px #8656ff66}.molecule-display{background:#ffffff0a;border:1px dashed var(--p31-glass-border);border-radius:var(--p31-radius-md);padding:var(--p31-space-md);text-align:center;min-height:60px;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;color:var(--p31-accent-gold);font-family:var(--p31-font-mono);word-break:break-all}.game-card{background:var(--p31-glass-bg);-webkit-backdrop-filter:var(--p31-glass-blur);backdrop-filter:var(--p31-glass-blur);border:1px solid var(--p31-glass-border);border-radius:var(--p31-radius-lg);padding:var(--p31-space-md);text-align:center;transition:all var(--p31-duration-fast) var(--p31-easing-smooth);cursor:pointer;touch-action:none;display:flex;flex-direction:column;align-items:center;gap:var(--p31-space-xs);min-height:120px;justify-content:center}.game-card:active{background:#ffffff1f;transform:scale(.95)}.game-icon{font-size:28px}.game-title{font-weight:600;font-size:13px}.search-box{width:100%;padding:var(--p31-space-sm) var(--p31-space-md);background:#ffffff14;border:1px solid var(--p31-glass-border);border-radius:var(--p31-radius-sm);color:var(--p31-text);font-size:13px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.search-box::placeholder{color:var(--p31-text-muted)}.listing{background:var(--p31-glass-bg);-webkit-backdrop-filter:var(--p31-glass-blur);backdrop-filter:var(--p31-glass-blur);border:1px solid var(--p31-glass-border);border-radius:var(--p31-radius-md);padding:var(--p31-space-sm) var(--p31-space-md);transition:all var(--p31-duration-fast) var(--p31-easing-smooth)}.listing-title{font-weight:600;font-size:13px}.listing-price{font-size:16px;font-weight:700;color:var(--p31-accent-gold)}.listing-seller{font-size:11px;color:var(--p31-text-secondary)}.profile-field{background:#ffffff0a;border:1px solid var(--p31-glass-border);border-radius:var(--p31-radius-sm);padding:var(--p31-space-sm) var(--p31-space-md);font-family:var(--p31-font-mono);font-size:11px;word-break:break-all}#tourOverlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:none;align-items:center;justify-content:center;z-index:10000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#tourOverlay.active{display:flex}.tour-card{background:var(--p31-glass-bg);border:1px solid var(--p31-glass-border);border-radius:var(--p31-radius-xl);padding:var(--p31-space-xl);max-width:420px;width:90%;position:relative}.tour-close{position:absolute;top:12px;right:12px;background:none;border:none;color:var(--p31-text-secondary);font-size:18px;cursor:pointer;min-width:36px;min-height:36px;z-index:1}.tour-step h2{font-size:18px;font-weight:600;margin-bottom:var(--p31-space-md);background:linear-gradient(135deg,var(--p31-accent-violet),var(--p31-accent-gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.tour-step p{font-size:13px;color:var(--p31-text-secondary);line-height:1.6;margin-bottom:var(--p31-space-sm)}.tour-footer{display:flex;align-items:center;justify-content:space-between;margin-top:var(--p31-space-lg)}.tour-dots{display:flex;gap:6px}.tour-dot{width:8px;height:8px;border-radius:50%;background:var(--p31-glass-border);transition:all var(--p31-duration-fast) var(--p31-easing-smooth)}.tour-dot.active{background:var(--p31-accent);width:24px;border-radius:4px}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:none;align-items:center;justify-content:center;z-index:10001;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-overlay.active{display:flex}.modal-card{max-width:360px;width:90%;position:relative}.modal-close{position:absolute;top:12px;right:12px;background:none;border:none;color:var(--p31-text-secondary);font-size:18px;cursor:pointer;min-width:36px;min-height:36px;z-index:1}.wallet-option{display:flex!important;align-items:center;gap:8px;justify-content:flex-start!important;padding:var(--p31-space-md)!important;font-size:13px!important}.wallet-option:hover{background:#ffffff1f!important}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:1200px){#app{grid-template-rows:56px 1fr 56px;grid-template-columns:1fr 1fr;grid-template-areas:"topbar topbar" "left main" "bottombar bottombar"}}@media(max-width:768px){#app{grid-template-rows:56px 1fr 56px;grid-template-columns:1fr;grid-template-areas:"topbar" "main" "bottombar"}#left-rail,#right-rail{display:none}}@media(max-width:480px){#app{grid-template-rows:48px 1fr 56px}}@media(max-width:320px){.bento-grid{grid-template-columns:1fr!important}.col-span-full,.col-span-half,.col-span-third,.col-span-two-thirds{grid-column:span 1!important}.bottom-nav{gap:0}.nav-item{max-width:60px;font-size:.5rem}.nav-item svg,.nav-item .nav-icon{width:16px;height:16px}.spoon-row{gap:2px}.spoon,.spoon-btn{width:24px;height:24px;min-width:24px;min-height:24px;font-size:.6rem}.topbar-metrics{gap:4px;flex-wrap:wrap}.metric-badge{font-size:.6rem;padding:2px 6px}.topbar{height:48px;padding:0 8px}.topbar-left{font-size:.8rem}.topbar-right .badge{display:none}.viewport{padding:8px}.glass-card{padding:12px}.card-value{font-size:1.5rem}h1{font-size:1.5rem!important}h2{font-size:1.2rem!important}.mood-grid{grid-template-columns:repeat(3,1fr)!important}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr!important}.stat-grid{grid-template-columns:1fr 1fr!important}.team-card{margin:0!important}.map-wrapper{min-height:200px!important}#left-rail,#right-rail{display:none!important}}