:root{--bg:#b9553a;--ink:#fff8f1;--ink-soft:#fff8f1d1;--cream:#f4ece2;--cocoa:#2b1e18;--glass:#ffffff1f;--glass-hover:#fff3;--shade:#280e0438;--line:#ffffff3d;--radius:22px;--ease-out:cubic-bezier(.2, .8, .2, 1);--font:"Onest", "Helvetica Neue", Arial, sans-serif;--display:"Unbounded", "Arial Black", sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{overscroll-behavior:none;background:var(--bg);height:100%;color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;margin:0;overflow:hidden}button{font:inherit;color:inherit;touch-action:manipulation}button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.stage{background-color:var(--bg);position:fixed;inset:0}.stage:before{content:"";pointer-events:none;background:radial-gradient(110% 70% at 50% 80%,#ffffff1f,#0000 62%),radial-gradient(140% 120% at 50% 45%,#0000 55%,#280a0033);position:absolute;inset:0}#scene{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}#scene.is-pointing{cursor:pointer}#scene.can-spin{cursor:grab}#scene.is-dragging{cursor:grabbing}.tag{background:var(--cream);color:var(--cocoa);white-space:nowrap;pointer-events:none;opacity:0;border-radius:999px;padding:6px 12px;font-size:14px;transition:opacity .15s;position:absolute;top:0;left:0;box-shadow:0 6px 18px #280a002e}.tag.is-visible{opacity:1}.tag strong{font-weight:600}.topbar{padding:max(24px, env(safe-area-inset-top)) max(28px, env(safe-area-inset-right)) 24px max(28px, env(safe-area-inset-left));pointer-events:none;justify-content:space-between;align-items:flex-start;gap:16px;display:flex;position:fixed;top:0;left:0;right:0}.topbar>*{pointer-events:auto}.marca{color:var(--ink);align-items:center;gap:10px;text-decoration:none;display:inline-flex}.marca-cara{background:var(--cream);border-radius:13px;justify-content:center;align-items:center;gap:5px;width:34px;height:30px;display:inline-flex;box-shadow:inset 0 -3px #00000014}.marca-cara i{background:var(--cocoa);border-radius:4px;width:4px;height:9px}.marca-nombre{font:700 1.25rem/1 var(--display);letter-spacing:-.02em}.brand p{color:var(--ink-soft);margin:8px 0 0;font-size:15px}.brand p a{color:var(--ink)}.team-actions{gap:8px;display:flex}.pill{border:1px solid var(--line);background:var(--glass);cursor:pointer;-webkit-backdrop-filter:blur(12px);border-radius:999px;height:40px;padding:0 18px;font-size:15px;font-weight:500;transition:background-color .15s,transform .12s}.pill:hover{background:var(--glass-hover)}.pill:active,.chip:active,.gesture:active,.mood:active,.icon:active{transform:scale(.97)}.pill-small{height:34px;padding:0 14px;font-size:14px}.hint{left:50%;bottom:calc(84px + env(safe-area-inset-bottom));color:var(--ink-soft);white-space:nowrap;pointer-events:none;margin:0;font-size:14px;transition:opacity .2s;position:fixed;transform:translate(-50%)}.roster{left:50%;bottom:calc(20px + env(safe-area-inset-bottom));border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(14px);scrollbar-width:none;border-radius:999px;gap:4px;max-width:calc(100% - 32px);padding:5px;transition:opacity .2s;display:flex;position:fixed;overflow-x:auto;transform:translate(-50%)}.roster::-webkit-scrollbar{display:none}.chip{white-space:nowrap;cursor:pointer;background:0 0;border:0;border-radius:999px;flex-shrink:0;align-items:center;gap:8px;height:42px;padding:0 16px 0 7px;font-size:15px;font-weight:500;transition:background-color .15s,color .15s,transform .12s;display:flex}.chip:hover{background:var(--glass-hover)}.chip small{color:var(--ink-soft);font-size:13px;font-weight:400}.chip[aria-current=true]{background:var(--cream);color:var(--cocoa)}.chip[aria-current=true] small{color:#2b1e18a6}.swatch{background:var(--swatch);border-radius:50%;width:28px;height:28px;box-shadow:inset 0 0 0 2px #ffffffb3}.panel{border:1px solid var(--line);border-radius:var(--radius);background:var(--shade);-webkit-backdrop-filter:blur(18px)saturate(1.15);opacity:0;pointer-events:none;width:340px;max-height:calc(100% - 140px);transition:opacity .2s ease, transform .32s var(--ease-out);padding:18px 22px 20px;position:fixed;top:50%;right:24px;overflow-y:auto;transform:translate(24px,-50%);box-shadow:0 24px 60px #1e080033}.panel.is-open{opacity:1;pointer-events:auto;transform:translateY(-50%)}.panel-top{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.stepper{gap:6px;display:flex}.icon{border:1px solid var(--line);background:var(--glass);cursor:pointer;border-radius:50%;width:34px;height:34px;font-size:20px;line-height:1;transition:background-color .15s,transform .12s}.icon:hover{background:var(--glass-hover)}.eyebrow{color:var(--ink-soft);letter-spacing:.06em;text-transform:uppercase;margin:0;font-size:13px;font-weight:500}.panel h2{font-family:var(--display);letter-spacing:-.03em;margin:2px 0 6px;font-size:34px;font-weight:800;line-height:1.05}.desc{color:var(--ink-soft);text-wrap:pretty;margin:0;font-size:16px;line-height:1.45}.panel h3{color:var(--ink-soft);letter-spacing:.06em;text-transform:uppercase;margin:20px 0 10px;font-size:13px;font-weight:500}.moods{flex-wrap:wrap;gap:6px;display:flex}.mood{border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:999px;height:34px;padding:0 14px;font-size:14px;transition:background-color .15s,color .15s,transform .12s}.mood:hover{background:var(--glass)}.mood[aria-checked=true]{background:var(--cream);color:var(--cocoa);border-color:#0000}.gestures{grid-template-columns:1fr 1fr;gap:8px;display:grid}.gesture{border:1px solid var(--line);background:var(--glass);cursor:pointer;border-radius:14px;height:42px;font-size:15px;font-weight:500;transition:background-color .15s,transform .12s}.gesture:hover{background:var(--glass-hover)}.gesture.signature{background:var(--cream);color:var(--cocoa);border-color:#0000;grid-column:1/-1;font-weight:600}.gesture.signature:hover{background:#fff}.tip{color:var(--ink-soft);margin:16px 0 0;font-size:13px}body.is-focused .hint{opacity:0}@media (width<=760px){.topbar{padding:max(14px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 14px max(16px, env(safe-area-inset-left))}body.is-focused .team-actions{display:none}.marca-nombre{font-size:1.1rem}.brand p{font-size:14px}.team-actions{flex-direction:column;align-items:flex-end;gap:6px}.pill{height:36px;padding:0 14px;font-size:14px}.hint{bottom:calc(80px + env(safe-area-inset-bottom))}.panel{top:auto;right:max(12px, env(safe-area-inset-right));bottom:calc(12px + env(safe-area-inset-bottom));left:max(12px, env(safe-area-inset-left));width:auto;max-height:50%;padding:12px 14px 14px;transform:translateY(24px)}.panel.is-open{transform:none}.panel-top{margin-bottom:10px}.panel h2{font-size:28px}.desc{-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:14px;line-height:1.4;display:-webkit-box;overflow:hidden}.panel h3{display:none}.moods,.gestures{scrollbar-width:none;flex-wrap:nowrap;gap:6px;margin:10px -14px 0;padding:0 14px;display:flex;overflow-x:auto}.moods::-webkit-scrollbar{display:none}.gestures::-webkit-scrollbar{display:none}.mood{flex:none;height:32px;padding:0 12px;font-size:13px}.gesture{border-radius:999px;flex:none;height:40px;padding:0 16px;font-size:14px}.gesture.signature{order:-1}.tip{display:none}body.is-focused .roster{opacity:0;pointer-events:none}}@media (prefers-reduced-motion:reduce){.panel,.tag,.hint,.roster{transition-duration:1ms}}