.phone-app{--phone-nav:4.35rem;background:radial-gradient(80% 42% at 100% -10%, #d946ef2e, transparent 52%), radial-gradient(70% 36% at 0% 18%, #3757ff29, transparent 48%), var(--x-bg-0);height:100dvh;min-height:100dvh;color:var(--x-text-1);font-family:var(--font-outfit), sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;flex-direction:column;display:flex;position:relative;overflow:hidden}.phone-app :focus-visible{box-shadow:var(--x-focus);outline:none}.phone-scroll{flex-direction:column;flex:1;min-height:0;padding:.35rem 1.05rem .8rem;display:flex;overflow:auto}.phone-app[data-decision=true] .phone-scroll{padding-top:5.1rem}.phone-fill{flex-direction:column;flex:1 0 auto;min-height:100%;display:flex}.phone-header{padding:max(.65rem, env(safe-area-inset-top)) 1.05rem .65rem;-webkit-backdrop-filter:blur(16px)saturate(1.2);backdrop-filter:blur(16px)saturate(1.2);background:linear-gradient(#050810b8,#05081047);flex:none;justify-content:space-between;align-items:center;gap:.75rem;display:flex}.phone-header .phone-logo{height:1.45rem}.phone-room-block{text-align:right;min-width:0}.phone-room{letter-spacing:.12em;margin:0;font-size:.92rem;font-weight:650}.phone-link{color:var(--x-text-3);justify-content:flex-end;align-items:center;gap:.35rem;margin:.15rem 0 0;font-size:.72rem;display:flex}.phone-link i,.phone-status i{background:var(--x-success);border-radius:999px;flex:none;width:.42rem;height:.42rem;box-shadow:0 0 0 3px #34d39929}.phone-link[data-link=reconnecting] i,.phone-status[data-state=reconnecting] i{background:var(--x-warning);box-shadow:0 0 0 3px #f6b84a2e}.phone-status[data-state=away] i{background:var(--x-danger);box-shadow:0 0 0 3px #ff536829}.phone-nav{grid-template-columns:repeat(var(--phone-tabs,4), minmax(0, 1fr));padding-bottom:env(safe-area-inset-bottom);-webkit-backdrop-filter:blur(18px)saturate(1.25);backdrop-filter:blur(18px)saturate(1.25);background:#060a12c7;border-top:1px solid #ffffff14;flex:none;display:grid}.phone-nav button{color:#bac4d6b8;min-height:3.35rem;font:inherit;background:0 0;border:0;flex-direction:column;justify-content:center;align-items:center;gap:.18rem;font-size:.62rem;display:flex;position:relative}.phone-nav button[data-active=true]{color:#f4f0ff}.phone-nav button[data-active=true] svg{filter:drop-shadow(0 0 7px #7c3cffcc)}.phone-nav button[data-active=true]:before{content:"";background:linear-gradient(90deg, var(--x-game), #5250ff 55%, var(--x-brand-blue));border-radius:999px;width:1.35rem;height:2px;position:absolute;top:0;box-shadow:0 0 10px #7c3cffcc}.phone-nav svg{width:1.2rem;height:1.2rem}.phone-badge{background:linear-gradient(90deg, var(--x-game), var(--x-brand-violet));color:#fff;border-radius:999px;min-width:.95rem;height:.95rem;padding:0 .2rem;font-size:.6rem;line-height:.95rem;position:absolute;top:.28rem;right:calc(50% - 1.2rem)}.phone-kicker{color:#d6ceffd1;letter-spacing:.16em;text-transform:uppercase;align-items:center;gap:.35rem;margin:0;font-size:.72rem;display:flex}.phone-title{font-family:var(--font-display), sans-serif;letter-spacing:-.03em;margin:0;font-size:1.85rem;font-weight:700;line-height:1.02}.phone-copy{color:var(--x-text-2);margin:0;font-size:.95rem;line-height:1.45}.phone-meta{color:var(--x-text-3);font-size:.75rem}.phone-stack{flex-direction:column;gap:.85rem;display:flex}.phone-cta,.phone-control,.phone-sheet button,.phone-quiet,.phone-danger,.phone-warn,.phone-qr,.phone-setting{min-height:2.75rem;font:inherit;font-weight:650}.phone-cta{color:#fff;background:linear-gradient(100deg,#e218d5 0%,#8f3dff 42%,#3e6bff 78%,#2c8dff);border:0;border-radius:14px;width:100%;box-shadow:inset 0 1px #ffffff61,0 10px 28px #583cff47}.phone-cta:disabled,.phone-control:disabled,.phone-quiet:disabled,.phone-danger:disabled,.phone-warn:disabled,.phone-composer input:disabled,.phone-composer button:disabled{cursor:not-allowed}.phone-cta:disabled{opacity:.45}.phone-cta:active,.phone-control:active:not(:disabled){transform:translateY(1px)}.phone-field{width:100%;min-height:3.35rem;color:var(--x-text-1);font:inherit;text-align:center;letter-spacing:.18em;text-transform:uppercase;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#04081075;border:1px solid #ffffff29;border-radius:14px;font-size:1.05rem}.phone-field-name{letter-spacing:.02em;text-align:left;text-transform:none;padding:0 .9rem}.phone-portal{background:var(--x-bg-0);min-height:100dvh;color:var(--x-text-1);flex-direction:column;display:flex;position:relative;overflow:auto}.phone-portal-top{z-index:1;padding:max(1.35rem, env(safe-area-inset-top)) 1.25rem 0;position:relative}.phone-portal-art{object-fit:cover;object-position:center center;width:100%;height:100%;position:fixed;inset:0}.phone-portal-scrim{background:radial-gradient(#0000 46%,#02060e38 100%);position:fixed;inset:0}.phone-portal-copy{z-index:1;width:min(100%,26rem);min-height:0;padding:1.5rem 1.25rem max(2rem, env(safe-area-inset-bottom));flex-direction:column;flex:1;justify-content:center;gap:.8rem;margin:0 auto;display:flex;position:relative}.phone-portal .phone-logo{height:2.15rem}.phone-portal-centered{text-align:center;align-items:center}@media (max-height:820px){.phone-portal-copy{padding-bottom:10vh}}@media (max-height:700px){.phone-portal-top{padding-top:max(.7rem, env(safe-area-inset-top))}.phone-portal-copy{justify-content:flex-start;gap:.6rem;padding-top:7vh;padding-bottom:1rem}.phone-portal .phone-title{font-size:1.55rem}}.phone-room-code{color:#fff;letter-spacing:.2em;text-shadow:0 1px 10px #000000bf;font-size:.92rem;font-weight:700}.phone-qr{color:#e2e8ffd1;background:0 0;border:0;justify-content:center;align-items:center;gap:.5rem;font-size:.95rem;display:flex}.phone-hero{border-radius:18px;min-height:13.5rem;position:relative;overflow:hidden}.phone-hero img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.phone-hero-scrim{background:linear-gradient(#05070b0d 10%,#05070bd1 100%);position:absolute;inset:0}.phone-hero-copy{z-index:1;flex-direction:column;justify-content:flex-end;gap:.2rem;min-height:13.5rem;padding:1rem;display:flex;position:relative}.phone-count{color:#f7f8fb;align-items:center;gap:.45rem;margin:.35rem 0 0;font-size:1.05rem;font-weight:650;display:flex}.phone-head-count{color:#f4f6fb;margin:0;font-size:1rem;font-weight:650}.phone-people{margin:0;padding:0;list-style:none}.phone-person{border-bottom:1px solid #ffffff14;align-items:center;gap:.75rem;min-height:3.4rem;padding:.55rem .1rem;display:flex}.phone-person p{margin:0}.phone-avatar{background:linear-gradient(160deg, color-mix(in srgb, var(--avatar,#7c3cff) 72%, white), var(--avatar,#7c3cff));color:#fff;border-radius:999px;flex:none;place-items:center;width:2.35rem;height:2.35rem;font-size:.85rem;font-weight:700;display:grid;box-shadow:inset 0 1px #fff6}.phone-status{color:var(--x-text-3);align-items:center;gap:.35rem;margin:.15rem 0 0;font-size:.75rem;display:flex}.phone-wait-line{color:var(--x-text-2);text-align:center;margin-top:auto;padding:1.1rem 0 .35rem}.phone-wait{justify-content:center;gap:.35rem;margin-top:.55rem;display:flex}.phone-wait i{background:#c4b5fd;border-radius:999px;width:.38rem;height:.38rem;animation:1.2s ease-in-out infinite phone-pulse}.phone-wait i:nth-child(2){animation-delay:.15s}.phone-wait i:nth-child(3){animation-delay:.3s}.phone-scene{background:var(--x-bg-0);flex-direction:column;flex:1;min-height:100%;margin:-.35rem -1.05rem 0;display:flex;position:relative;overflow:hidden}.phone-scene-frame{flex:none;height:min(42dvh,20rem);position:relative;overflow:hidden}.phone-scene-art{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.phone-scene-fade{background:linear-gradient(180deg, transparent, var(--x-bg-0));height:42%;position:absolute;bottom:0;left:0;right:0}.phone-scene-copy,.phone-scene-note{z-index:1;position:relative}.phone-scene-copy{flex-direction:column;gap:.35rem;padding:.15rem 1.15rem 0;display:flex}.phone-scene-note{text-align:center;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#070c1685;border:1px solid #ffffff24;border-radius:16px;margin:auto 1rem 1rem;padding:.85rem 1rem}.phone-progress{background:#ffffff38;border-radius:999px;width:100%;height:3px;margin-top:.35rem;overflow:hidden}.phone-progress span{border-radius:inherit;background:linear-gradient(90deg, var(--x-game), #5250ff 50%, #2e7cff);height:100%;display:block;box-shadow:0 0 10px #5250ffb3}.phone-float{z-index:18;top:calc(max(3.2rem, env(safe-area-inset-top)) + .35rem);color:inherit;font:inherit;text-align:left;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#0a0e1cb8;border:1px solid #a78bfa73;border-radius:16px;align-items:center;gap:.7rem;padding:.7rem .8rem;display:flex;position:absolute;left:.75rem;right:.75rem;box-shadow:0 16px 40px #00000059,0 0 24px #7c3cff2e}.phone-float strong,.phone-float span{display:block}.phone-float span span{color:var(--x-text-3);font-size:.78rem;font-weight:450}.phone-toast-scrim{z-index:19;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#02060e47;position:absolute;inset:0}.phone-toast{z-index:22;right:.85rem;bottom:calc(var(--phone-nav) + env(safe-area-inset-bottom) + .75rem);background:linear-gradient(#5830a047,#0a0e1ae0),#080c16e6;border:1px solid #c4b5fd6b;border-radius:20px;flex-direction:column;gap:.55rem;padding:.95rem;display:flex;position:absolute;left:.85rem;box-shadow:0 22px 50px #00000073,0 0 32px #8f3dff38,inset 0 1px #ffffff29}.phone-toast-row{align-items:center;gap:.65rem;display:flex}.phone-toast-row p{margin:0}.phone-toast-row .phone-meta{margin-left:auto}.phone-dismiss{color:var(--x-text-3);font:inherit;background:0 0;border:0;font-size:.8rem}.phone-reconnect{border-color:#f6b84a66}.phone-chat{flex:auto;min-height:0;max-height:100%;margin:0 -1.05rem;padding:0}.phone-scroll:has(.phone-chat){padding-bottom:0;overflow:hidden}.phone-chat-title{padding:.45rem 1.05rem .35rem;font-size:1.65rem;line-height:1.25;overflow:visible}.phone-chat-log{flex-direction:column;flex:1;gap:.35rem;min-height:0;padding:.2rem 1.05rem .6rem;display:flex;overflow:auto}.phone-chat-group{flex-direction:column;align-items:flex-start;gap:.28rem;max-width:100%;display:flex}.phone-chat-group[data-mine=true]{align-items:flex-end}.phone-chat-sender{color:var(--x-text-2);align-items:center;gap:.45rem;font-size:.78rem;display:flex}.phone-chat-sender .sender-mark{width:1.6rem;height:1.6rem;font-size:.7rem}.phone-chat-bubble{background:#121826e0;border-radius:18px;max-width:82%;margin:0;padding:.7rem .85rem;line-height:1.35;box-shadow:inset 0 1px #ffffff0f}.phone-chat-group[data-mine=false] .phone-chat-bubble{border-bottom-left-radius:6px}.phone-chat-group[data-mine=true] .phone-chat-bubble{background:linear-gradient(160deg,#8f3dffe0,#2e7cffe0);border-bottom-right-radius:6px}.phone-chat-reply{flex:none;padding:0 1.05rem .45rem}.phone-chat-reply .controller-shell{gap:.45rem}.phone-chat-reply .message-controller{flex-direction:column;gap:.4rem;display:flex}.phone-chat-reply .message-controller button{min-height:2.75rem;box-shadow:inset 0 1px #ffffff47;color:#fff!important;background:linear-gradient(100deg,#8f3dffeb,#3757ffeb)!important;border:1px solid #c4b5fd8c!important;border-radius:14px!important}.phone-composer{background:#060a12eb;border-top:1px solid #ffffff14;flex:none;align-items:center;gap:.45rem;padding:.55rem .75rem .65rem;display:flex}.phone-composer input{min-height:2.75rem;color:var(--x-text-1);font:inherit;background:#ffffff0a;border:1px solid #ffffff1a;border-radius:999px;flex:1;padding:0 .95rem;font-size:1rem}.phone-composer button{color:#fff;background:linear-gradient(140deg,#8f3dff,#3757ff);border:0;border-radius:999px;flex:none;place-items:center;width:2.75rem;height:2.75rem;display:grid}.phone-composer button:disabled,.phone-composer input:disabled{opacity:.45}.phone-deck{gap:.95rem;position:relative}.phone-deck:before{content:"";pointer-events:none;background:radial-gradient(50% 80% at 50% 0,#7c3cff47,#0000 72%);height:9rem;position:absolute;top:-1.5rem;left:-20%;right:-20%}.phone-deck>*{position:relative}.phone-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem;display:grid}.phone-control{color:#fff;background:linear-gradient(#8f3dff2e,#080e1c8c),#0a0e18cc;border:1px solid #a78bfa6b;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:.4rem;min-height:5.5rem;padding:.7rem .3rem;font-size:.72rem;display:flex;box-shadow:inset 0 1px #ffffff29,0 0 18px #3757ff1f}.phone-control:disabled{color:#bac4d661;box-shadow:none;opacity:1;background:#ffffff08;border-color:#ffffff0f}.phone-control[data-active=true]{border-color:#2e7cffcc;box-shadow:inset 0 0 0 1px #2e7cff73,0 0 18px #2e7cff47}.phone-control svg{width:1.25rem;height:1.25rem}.phone-warn,.phone-danger,.phone-quiet{border-radius:14px;justify-content:center;align-items:center;gap:.45rem;width:100%;padding:.8rem;display:flex}.phone-warn{color:#ffe7b0;background:linear-gradient(#f6b84a2e,#f6b84a14);border:1px solid #f6b84a8c;box-shadow:inset 0 1px #ffe7b040}.phone-danger{color:#ffd5db;background:linear-gradient(#ff536829,#ff53680f);border:1px solid #ff53688c}.phone-quiet{color:var(--x-text-1);background:#ffffff0a;border:1px solid #ffffff1a}.phone-hold{flex-direction:column;gap:.2rem;display:flex}.phone-setting{width:100%;color:inherit;text-align:left;background:0 0;border:0;border-bottom:1px solid #ffffff14;border-radius:0;align-items:center;gap:.75rem;padding:.85rem .15rem;display:flex}.phone-setting strong{letter-spacing:.08em;font-size:1rem;display:block}.phone-setting .phone-meta{margin-left:auto}.phone-identity{align-items:center;gap:.8rem;padding:.4rem 0 .8rem;display:flex}.phone-identity p{margin:0}.phone-sheet-back{z-index:30;background:#02060e9e;align-items:flex-end;display:flex;position:fixed;inset:0}.phone-sheet{width:min(100%,32rem);padding:.55rem 1rem max(1rem, env(safe-area-inset-bottom));background:radial-gradient(80% 40% at 50% 0,#7c3cff2e,#0000 60%),#0a0e18f5;border:1px solid #ffffff1a;border-bottom:0;border-radius:22px 22px 0 0;margin:0 auto;box-shadow:0 -20px 50px #00000059}.phone-sheet-handle{background:#ffffff38;border-radius:999px;width:2.4rem;height:4px;margin:.15rem auto .45rem}.phone-sheet-head{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.phone-sheet h2{font-family:var(--font-display), sans-serif;margin:.2rem 0 .35rem;font-size:1.35rem}.phone-icon-button{width:2.25rem;height:2.25rem;color:var(--x-text-2);background:0 0;border:0;border-radius:999px;place-items:center;display:grid}.phone-scene-row{width:100%;min-height:3.5rem;color:inherit;font:inherit;text-align:left;background:0 0;border:0;border-bottom:1px solid #ffffff14;align-items:center;gap:.85rem;display:flex}.phone-scene-row[data-selected=true],.phone-scene-row[data-current=true]{background:linear-gradient(90deg,#8f3dff47,#2e7cff1f);border-bottom-color:#0000;border-radius:12px;box-shadow:inset 0 0 0 1px #a78bfa59}.phone-index{color:#ddd6fe;width:2rem;font-family:var(--font-display), sans-serif;font-size:1.25rem}.phone-scene-list{max-height:min(52dvh,26rem);overflow:auto}.phone-actions{border-top:1px solid #ffffff14;grid-template-columns:1fr 1.35fr;gap:.55rem;margin-top:.85rem;padding-top:.85rem;display:grid}.phone-host{min-height:8rem}.phone-cue{border-radius:16px;padding:1rem}.phone-cue[data-kind=private],.phone-cue[data-kind=secret]{background:#100c1ceb;border:1px solid #7c3cff73}.phone-cue[data-kind=team],.phone-cue[data-kind=role]{background:#081020eb;border:1px solid #3757ff66}.phone-sr-select{white-space:nowrap;opacity:0;border:0;width:1px;height:1px;margin:-1px;position:absolute;overflow:hidden}.phone-line{color:var(--x-text-2);margin:0}@keyframes phone-pulse{50%{opacity:.35;transform:translateY(2px)}}@media (max-width:360px){.phone-nav button{font-size:.56rem}.phone-title{font-size:1.6rem}}@media (orientation:landscape) and (max-height:520px){.phone-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.phone-control{min-height:4.4rem}.phone-nav button{min-height:2.75rem}.phone-hero,.phone-hero-copy{min-height:8rem}.phone-scene-frame{height:34dvh}}@media (prefers-reduced-motion:reduce){.phone-wait i{animation:none}}@media (prefers-reduced-transparency:reduce){.phone-header,.phone-nav,.phone-toast,.phone-float,.phone-scene-note,.phone-composer{background:var(--x-surface-2);-webkit-backdrop-filter:none;backdrop-filter:none}.phone-toast-scrim{-webkit-backdrop-filter:none;backdrop-filter:none;background:#02060e8c}}