:root{--ink:#1d2433;--ink-soft:#5b6478;--paper:#fff;--panel:#ffffffeb;--line:#1d24331a;--brand:#3d7ff5;--brand-dark:#2c62c9;--accent:#ffd84a;--good:#34c759;--warn:#ffb020;--bad:#ff4d4f;--radius:16px;--shadow:0 8px 24px #1428502e;--font:"Rubik", system-ui, -apple-system, "Segoe UI", sans-serif;--pixel:"Pixelify Sans", "Rubik", system-ui, sans-serif;--safe-bottom:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box}html,body{font-family:var(--font);color:var(--ink);-webkit-tap-highlight-color:transparent;background:#f4f6fb;margin:0;padding:0}body.game{background:#8fd6ff}html:has(body.game){background:#8fd6ff}button{font:inherit;color:inherit;cursor:pointer}.pixel{font-family:var(--font);letter-spacing:.01em;font-weight:800}.logo{font-family:var(--pixel);letter-spacing:.02em;font-weight:700}.big-emoji{font-size:1.5em;line-height:1}body.game,body.game #root{overscroll-behavior:none;height:100%;overflow:hidden}body.game{position:fixed;inset:0}.app{-webkit-user-select:none;user-select:none;position:fixed;inset:0;overflow:hidden}.world-canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.splash{color:#fff;text-shadow:0 3px #0000002e;background:linear-gradient(#7fd0ff,#d9f4ff);place-items:center;font-size:28px;display:grid;position:absolute;inset:0}.topbar{top:calc(env(safe-area-inset-top,0px) + 10px);pointer-events:none;justify-content:space-between;align-items:flex-start;gap:8px;display:flex;position:absolute;left:12px;right:12px}.topbar>*{pointer-events:auto}.chip{background:var(--panel);box-shadow:var(--shadow);text-align:left;border:0;border-radius:14px;flex-direction:column;max-width:min(60vw,360px);padding:8px 14px;display:flex}.island-chip span{white-space:nowrap;text-overflow:ellipsis;font-size:18px;font-weight:700;overflow:hidden}.island-chip small{color:var(--ink-soft);font-size:12px}.top-actions{gap:6px;display:flex}.icon-btn{background:var(--panel);width:44px;height:44px;box-shadow:var(--shadow);border:0;border-radius:14px;place-items:center;font-size:20px;display:grid}.icon-btn.small{width:34px;height:34px;box-shadow:none;background:#1d24330f;font-size:15px}.conn{color:#fff;background:#1d2433cc;border-radius:999px;padding:6px 14px;font-size:14px;position:absolute;top:70px;left:50%;transform:translate(-50%)}.toasts{pointer-events:none;flex-direction:column;align-items:center;gap:6px;width:min(92vw,420px);display:flex;position:absolute;top:74px;left:50%;transform:translate(-50%)}.toast{background:var(--ink);color:#fff;box-shadow:var(--shadow);text-align:center;border-radius:999px;padding:8px 16px;font-weight:500;animation:.25s ease-out pop}@keyframes pop{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.notice{bottom:calc(var(--safe-bottom) + 96px);background:var(--accent);border-radius:var(--radius);width:min(92vw,460px);box-shadow:var(--shadow);align-items:flex-start;gap:10px;padding:12px 14px;font-weight:500;animation:.3s ease-out pop;display:flex;position:absolute;left:50%;transform:translate(-50%)}.notice.raised{bottom:calc(var(--safe-bottom) + 128px)}.btn:disabled{opacity:.45;cursor:default}.notice.static{bottom:calc(var(--safe-bottom) + 24px);justify-content:space-between;align-items:center}.link-btn{background:0 0;border:0;margin-left:auto;font-size:16px}.champion-banner{box-shadow:var(--shadow);background:linear-gradient(135deg,#ffd84a,#ff9f1c);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:700;position:absolute;top:70px;right:12px}.mycard{background:var(--panel);border-radius:var(--radius);width:min(270px,100vw - 24px);box-shadow:var(--shadow);cursor:pointer;padding:10px;position:absolute;top:74px;left:12px}.mycard-head{align-items:center;gap:10px;display:flex}.portrait{width:52px;height:52px;image-rendering:pixelated;object-fit:cover;background:#d9f4ff;border-radius:12px;flex-shrink:0}.who{flex-direction:column;min-width:0;display:flex}.who b{white-space:nowrap;text-overflow:ellipsis;font-size:16px;overflow:hidden}.who small{color:var(--ink-soft)}.status{color:#b4231f;margin-top:2px;font-size:12px;font-weight:500}.needs{gap:5px;margin-top:8px;display:grid}.need{align-items:center;gap:8px;display:flex}.need-icon{text-align:center;width:20px}.need-track{background:#1d24331a;border-radius:999px;flex:1;height:10px;overflow:hidden}.need-fill{border-radius:999px;height:100%;transition:width .5s,background .5s}.actionbar{bottom:calc(var(--safe-bottom) + 10px);background:var(--panel);box-shadow:var(--shadow);border-radius:20px;gap:6px;max-width:calc(100vw - 16px);padding:6px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.action-list{scrollbar-width:none;overscroll-behavior-x:contain;gap:6px;min-width:0;display:flex;overflow-x:auto}.action-list::-webkit-scrollbar{display:none}.action-list.more-right{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),#0000);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),#0000)}.action-list.more-left{-webkit-mask-image:linear-gradient(270deg,#000 calc(100% - 28px),#0000);mask-image:linear-gradient(270deg,#000 calc(100% - 28px),#0000)}.action-list.more-left.more-right{-webkit-mask-image:linear-gradient(90deg,#0000,#000 28px calc(100% - 28px),#0000);mask-image:linear-gradient(90deg,#0000,#000 28px calc(100% - 28px),#0000)}.action{background:#1d24330d;border:0;border-radius:14px;flex-direction:column;flex-shrink:0;align-items:center;gap:3px;min-width:62px;padding:7px 6px 6px;display:flex}.action .label{white-space:nowrap;font-size:11px;font-weight:500}.action.primary{background:var(--brand);color:#fff}.action.highlight{background:#ffe9a6;animation:1.4s infinite pulse}@keyframes pulse{50%{transform:scale(1.06)}}.action:active{transform:scale(.94)}.landing{left:50%;bottom:calc(var(--safe-bottom) + 16px);background:var(--panel);width:min(94vw,440px);box-shadow:var(--shadow);text-align:center;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:22px;padding:18px 18px 14px;position:absolute;transform:translate(-50%)}.landing h1{color:var(--brand);margin:0;font-size:34px}.landing h2{margin:4px 0 8px;font-size:18px}.landing p{color:var(--ink-soft);margin:0 0 12px}.floating-cta{bottom:calc(var(--safe-bottom) + 16px);box-shadow:var(--shadow);position:absolute;left:50%;transform:translate(-50%)}.btn{color:var(--ink);white-space:nowrap;background:#1d243312;border:0;border-radius:14px;justify-content:center;align-items:center;gap:6px;padding:10px 16px;font-weight:500;text-decoration:none;display:inline-flex}.btn.primary{background:var(--brand);color:#fff}.btn.primary:hover{background:var(--brand-dark)}.btn.ghost{color:var(--ink-soft);background:0 0}.btn.danger{color:#b4231f;background:#ffe1e1}.btn.big{width:100%;margin-bottom:10px;padding:13px 22px;font-size:17px}.btn.small{padding:6px 10px;font-size:13px}.hint{color:var(--ink-soft);font-size:13px}.joystick{left:22px;bottom:calc(var(--safe-bottom) + 100px);touch-action:none;background:#ffffff59;border:3px solid #fffc;border-radius:50%;place-items:center;width:120px;height:120px;display:grid;position:absolute}.knob{width:52px;height:52px;box-shadow:var(--shadow);pointer-events:none;background:#fff;border-radius:50%}.interact-btn{right:18px;bottom:calc(var(--safe-bottom) + 108px);background:var(--accent);box-shadow:var(--shadow);border:0;border-radius:18px;align-items:center;gap:8px;max-width:60vw;padding:10px 14px;font-weight:700;animation:.2s ease-out pop;display:flex;position:absolute}.interact-btn kbd{font-family:var(--pixel);background:#0000001f;border-radius:6px;margin-left:6px;padding:1px 6px}.hint-keys{left:50%;bottom:calc(var(--safe-bottom) + 92px);color:#fff;white-space:nowrap;background:#1d2433b3;border-radius:999px;padding:5px 12px;font-size:12px;position:absolute;transform:translate(-50%)}.sheet{background:var(--panel);border-radius:var(--radius);width:min(300px,100vw - 24px);box-shadow:var(--shadow);padding:14px 16px;animation:.2s ease-out pop;position:absolute;top:74px;right:12px}.sheet h3{margin:0 30px 2px 0}.sheet-close{background:#1d24330f;border:0;border-radius:10px;width:30px;height:30px;position:absolute;top:8px;right:8px}.handle{color:var(--brand);font-weight:500;text-decoration:none}.facts{gap:6px;margin:10px 0 0;padding:0;font-size:14px;list-style:none;display:grid}.modal-backdrop{z-index:20;background:#0f193259;justify-content:center;align-items:flex-end;animation:.15s fade;display:flex;position:absolute;inset:0}@keyframes fade{0%{opacity:0}}.modal{background:var(--paper);width:min(100vw,520px);max-height:86vh;padding:16px 16px calc(var(--safe-bottom) + 16px);border-radius:24px 24px 0 0;flex-direction:column;animation:.22s ease-out slideup;display:flex}@media (width>=700px){.modal-backdrop{align-items:center}.modal{border-radius:24px}}@keyframes slideup{0%{opacity:0;transform:translateY(40px)}}.modal-head{justify-content:space-between;align-items:center;gap:10px;display:flex}.modal-head h2{margin:0;font-size:22px}.modal-body{flex-direction:column;gap:10px;padding-top:10px;display:flex;overflow-y:auto}.row{flex-wrap:wrap;gap:8px;display:flex}.row>.btn{flex:1}.emotes .btn{margin:0}.food-grid{grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px;display:grid}.food{background:#1d24330d;border:2px solid #0000;border-radius:16px;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;display:flex}.food .big-emoji{font-size:30px}.food.fav{background:#fff0f5;border-color:#ff7ba3}.food small{color:#d6336c}.island-list{gap:8px;display:grid}.island-row{background:#1d24330a;border-radius:16px;flex-wrap:wrap;align-items:center;gap:10px;padding:10px;display:flex}.island-row.current{outline:2px solid var(--brand)}.island-badge{background:#d9f4ff;border-radius:12px;flex-shrink:0;place-items:center;width:44px;height:44px;font-size:24px;display:grid;overflow:hidden}.island-badge img{object-fit:contain;background:#fff;width:100%;height:100%}.island-info{flex-direction:column;flex:1;min-width:140px;display:flex}.island-info small{color:var(--ink-soft)}.island-actions{gap:6px;display:flex}.champion-card{background:linear-gradient(135deg,#fff3c4,#ffe08a);border-radius:16px;align-items:center;gap:12px;padding:12px;display:flex}.champion-card div{flex-direction:column;display:flex}.leaderboard{gap:6px;margin:0;padding:0;list-style:none;display:grid}.leaderboard li{background:#1d24330a;border-radius:12px;align-items:center;gap:10px;padding:8px 10px;display:flex}.leaderboard .place{text-align:center;width:28px;font-weight:700}.leaderboard .name{flex:1}.leaderboard small{color:var(--ink-soft)}.my-points{text-align:center;font-weight:700}.codebox{border:2px dashed var(--brand);background:#f1f6ff;border-radius:14px;align-items:center;gap:8px;padding:10px 12px;display:flex}.codebox code{font-family:var(--pixel);letter-spacing:.06em;flex:1;font-size:22px}.prize-row{border-bottom:1px solid var(--line);gap:6px;padding:10px 0;display:grid}.prize-title{margin:0;font-size:18px;font-weight:700}.field{gap:6px;display:grid}.field>span{font-weight:500}.link{color:var(--brand)}.danger-zone{border-top:1px solid var(--line);gap:8px;margin-top:10px;padding-top:12px;display:grid}.photo-bar{left:50%;bottom:calc(var(--safe-bottom) + 18px);background:var(--panel);box-shadow:var(--shadow);border-radius:22px;align-items:center;gap:10px;padding:8px;display:flex;position:absolute;transform:translate(-50%)}.photo-bar .shutter{width:auto;margin:0}.photo-preview{object-fit:contain;background:#000;border-radius:14px;width:100%;max-height:52vh}body.admin{background:#f4f6fb}.admin-wrap{max-width:1100px;margin:0 auto;padding:16px}.admin-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;display:flex}.admin-head h1{color:var(--brand);margin:0;font-weight:800}.tabs{flex-wrap:wrap;gap:6px;margin-bottom:14px;display:flex}.tabs button{background:#fff;border:0;border-radius:12px;padding:8px 14px;box-shadow:0 1px 2px #0000000f}.tabs button.active{background:var(--brand);color:#fff}.card{border-radius:var(--radius);background:#fff;margin-bottom:14px;padding:16px;box-shadow:0 1px 3px #14285014}.card h2{margin:0 0 10px;font-size:18px}.stats-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;display:grid}.stat{background:#f4f6fb;border-radius:14px;padding:12px}.stat b{font-variant-numeric:tabular-nums;font-size:26px;display:block}.stat span{color:var(--ink-soft);font-size:13px}.form-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));align-items:end;gap:10px;display:grid}.form-grid label,.stack label{color:var(--ink-soft);gap:4px;font-size:13px;display:grid}input,select,textarea{font:inherit;color:var(--ink);background:#fff;border:1px solid #d5dbe7;border-radius:10px;width:100%;padding:9px 11px}textarea{resize:vertical;min-height:90px}input[type=color]{height:40px;padding:2px}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:14px}th,td{text-align:left;white-space:nowrap;border-bottom:1px solid #eef1f6;padding:8px 10px}th{color:var(--ink-soft);font-weight:500}td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}.swatch{vertical-align:middle;border:1px solid #0000001a;border-radius:4px;width:14px;height:14px;margin-right:6px;display:inline-block}.thumb{object-fit:contain;background:#f4f6fb;border-radius:6px;width:48px;height:32px}.post-text{white-space:pre-wrap;background:#f4f6fb;border-radius:12px;padding:10px;font-size:14px}.bars{align-items:flex-end;gap:3px;height:120px;padding-top:8px;display:flex}.bars div{background:var(--brand);border-radius:4px 4px 0 0;flex:1;min-height:2px}.muted{color:var(--ink-soft)}.login-card{max-width:360px;margin:12vh auto}body.devbot{background:#eef1f6}.devbot-wrap{grid-template-columns:300px 1fr;gap:16px;max-width:980px;margin:0 auto;padding:16px;display:grid}@media (width<=760px){.devbot-wrap{grid-template-columns:1fr}}.phone{box-shadow:var(--shadow);background:#fff;border-radius:24px;flex-direction:column;height:min(78vh,760px);display:flex;overflow:hidden}.phone-head{border-bottom:1px solid var(--line);align-items:center;gap:10px;padding:12px 16px;font-weight:700;display:flex}.chat{flex-direction:column;flex:1;gap:8px;padding:14px;display:flex;overflow-y:auto}.msg{white-space:pre-wrap;word-break:break-word;border-radius:18px;max-width:78%;padding:9px 13px;font-size:15px}.msg.in{background:#efefef;align-self:flex-start}.msg.out{color:#fff;background:linear-gradient(135deg,#7b5cff,#3d7ff5);align-self:flex-end}.msg img{max-width:220px;image-rendering:pixelated;border-radius:14px;display:block}.msg a{color:inherit;word-break:break-all}.quick{flex-wrap:wrap;align-self:flex-start;gap:6px;display:flex}.quick button{color:#3d7ff5;background:#fff;border:1px solid #3d7ff5;border-radius:999px;padding:6px 12px}.composer{border-top:1px solid var(--line);gap:6px;padding:10px;display:flex}.stack{gap:10px;display:grid}.creator-backdrop{z-index:30}.creator{max-height:92vh}.creator h3{margin:2px 0 0;font-size:17px}.creator .btn.big{white-space:normal;text-align:center;margin-bottom:0}.creator .modal-body>b,.editor-fields b{color:var(--ink-soft);margin-top:4px;font-size:13px;font-weight:500}.steps{justify-content:center;gap:6px;padding-top:8px;display:flex}.steps .dot{background:var(--line);border-radius:3px;width:28px;height:6px}.steps .dot.on{background:var(--brand)}.field input{font:inherit;border:2px solid var(--line);color:var(--ink);background:var(--paper);border-radius:12px;outline:none;padding:12px 14px;font-size:17px}.field input:focus{border-color:var(--brand)}.consent{color:var(--ink-soft);align-items:flex-start;gap:10px;font-size:14px;line-height:1.4;display:flex}.consent input{width:20px;height:20px;accent-color:var(--brand);flex:none;margin:0}.consent a{color:var(--brand)}.busy{text-align:center;padding:22px 0;font-weight:500}.error-note{color:#8a5300;background:#fff4e0;border-radius:12px;margin:0;padding:10px 12px;font-size:14px}.variants{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.variant{aspect-ratio:1;background:#e8f6ff;border:3px solid #0000;border-radius:14px;padding:0;overflow:hidden}.variant img,.creator img.preview{image-rendering:pixelated;display:block}.variant img{width:100%;height:100%}.variant.on{border-color:var(--brand);box-shadow:0 0 0 3px #3d7ff540}.editor{grid-template-columns:140px 1fr;align-items:start;gap:12px;display:grid}.editor .preview{border-radius:14px;width:140px;position:sticky;top:0}.editor-fields{gap:6px;display:grid}.chips,.swatches{flex-wrap:wrap;gap:6px;display:flex}.chip-btn{color:var(--ink);font:inherit;background:#1d243312;border:0;border-radius:999px;padding:7px 12px;font-size:14px}.chip-btn.on{background:var(--brand);color:#fff}.chip-btn.pet{padding:6px 12px;font-size:22px}.swatch-btn{border:2px solid #0000001f;border-radius:9px;width:30px;height:30px;padding:0}.swatch-btn.on{outline:3px solid var(--brand);outline-offset:2px}.creator img.preview.done{border-radius:18px;align-self:center;width:180px}.codebox code.link-code{letter-spacing:0;word-break:break-all;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:12px}@media (width<=480px){.editor{grid-template-columns:1fr}.editor .preview{justify-self:center;width:120px;position:static}.topbar{gap:6px;left:8px;right:8px}.chip{max-width:44vw;padding:6px 10px}.island-chip span{font-size:15px}.island-chip small{font-size:11px}.top-actions{gap:4px}.icon-btn{border-radius:12px;width:38px;height:38px;font-size:17px}.mycard{width:min(220px,100vw - 16px);padding:8px;top:62px;left:8px}.portrait{width:40px;height:40px}.who b{font-size:14px}.who small{font-size:11px}.needs{gap:3px}.need-track{height:8px}.sheet{top:auto;bottom:calc(var(--safe-bottom) + 96px);width:auto;left:8px;right:8px}.champion-banner{top:auto;bottom:calc(var(--safe-bottom) + 160px)}.action{min-width:58px}.action .label{font-size:10px}.interact-btn{right:10px}.joystick{left:14px}}.voice-corner{top:calc(env(safe-area-inset-top,0px) + 62px);z-index:15;background:var(--panel);box-shadow:var(--shadow);border-radius:999px;align-items:center;gap:6px;max-width:calc(100vw - 24px);padding:5px 12px 5px 5px;display:flex;position:absolute;right:12px}.round-btn{background:#3d7ff524;border:0;border-radius:50%;flex-shrink:0;place-items:center;width:40px;height:40px;font-size:19px;line-height:1;display:grid;position:relative}.round-btn.off{background:#1d243314}.round-btn.mic.off:after{content:"";background:var(--bad);border-radius:2px;width:26px;height:3px;position:absolute;transform:rotate(-45deg);box-shadow:0 0 0 1.5px #fff}.round-btn.busy:before{content:"";border:3px solid #0000;border-top-color:var(--brand);border-radius:50%;animation:.9s linear infinite spin;position:absolute;inset:-3px}@keyframes spin{to{transform:rotate(360deg)}}.round-btn:active{transform:scale(.93)}.round-btn .badge{background:var(--good);color:#fff;border-radius:999px;place-items:center;min-width:18px;height:18px;padding:0 5px;font-size:11px;font-weight:700;display:grid;position:absolute;top:-4px;right:-4px;box-shadow:0 0 0 2px #fff}.voice-status{color:var(--ink-soft);white-space:nowrap;font-size:12px;font-weight:500}.voice-corner.on .voice-status{color:#15803d}.app.has-voice .sheet,.app.has-voice .champion-banner{top:calc(env(safe-area-inset-top,0px) + 118px)}.presence{color:var(--ink-soft);align-items:center;gap:6px;margin-top:4px;font-size:13px;display:inline-flex}.presence-dot{background:#c3c8d2;border-radius:50%;width:10px;height:10px}.presence.on{color:#15803d;font-weight:600}.presence.on .presence-dot{background:#22c55e;box-shadow:0 0 0 2px #fff,0 0 0 3px #22c55e66}@media (width<=480px){.voice-corner{top:calc(env(safe-area-inset-top,0px) + 58px);gap:4px;padding:4px;right:8px}.voice-status{display:none}.round-btn{width:38px;height:38px;font-size:18px}.app.has-voice .sheet,.app.has-voice .champion-banner{top:auto}}