:root{--plum-900: #150a2e;--plum-800: #1c1033;--plum-700: #2a1a52;--plum-600: #3a2470;--purple: #7c3aed;--purple-bright: #9b5cff;--lav-100: #efe8ff;--ink: #22143f;--c-exercise: #ff6b4a;--c-eat: #ffb020;--c-sleep: #4c8dff;--c-health: #34d399;--c-happy: #fb7185;--c-fatigue: #fbbf24;--gold: #ffd84d;--card: rgba(255, 255, 255, .06);--card-solid: #ffffff;--stroke: rgba(255, 255, 255, .14);--radius: 22px;--radius-sm: 14px;--shadow-pop: 0 18px 40px -12px rgba(0, 0, 0, .55);--font-display: "Jua", "Gothic A1", system-ui, sans-serif;--font-body: "Gothic A1", system-ui, -apple-system, sans-serif;--tier-best: #ffd84d;--tier-good: #7de8a0;--tier-neutral: #b9a7ff;--tier-bad: #ffab6b;--tier-worst: #ff6b6b}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%}body{font-family:var(--font-body);color:var(--lav-100);background:radial-gradient(120% 90% at 15% -10%,#4a2b8f 0%,transparent 55%),radial-gradient(120% 90% at 100% 0%,#b83a86 0%,transparent 45%),linear-gradient(160deg,var(--plum-800) 0%,var(--plum-900) 100%);background-color:var(--plum-900);background-attachment:fixed;-webkit-font-smoothing:antialiased;overflow-x:hidden}#app{min-height:100dvh;display:flex;justify-content:center}.screen{width:100%;max-width:480px;min-height:100dvh;padding:max(20px,env(safe-area-inset-top)) 20px calc(20px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:18px;transition:opacity .22s ease,transform .22s ease}.screen-enter{opacity:0;transform:translateY(14px) scale(.985)}.screen-leave{opacity:0;transform:translateY(-10px) scale(.985)}.kicker{font-family:var(--font-body);font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:.72rem;color:var(--purple-bright);margin:0}.btn{font-family:var(--font-display);font-size:1.15rem;border:none;border-radius:var(--radius);padding:16px 20px;color:#fff;cursor:pointer;transition:transform .12s ease,box-shadow .2s ease,filter .2s ease}.btn:active{transform:translateY(2px) scale(.98)}.btn--primary{background:linear-gradient(135deg,var(--purple-bright),var(--purple));box-shadow:0 10px 24px -8px #7c3aede6,inset 0 1px #ffffff59}.btn--primary:disabled{filter:saturate(.5) brightness(.8);cursor:default}.btn--start{width:100%;font-size:1.35rem;padding:18px;animation:breathe 2.6s ease-in-out infinite}.bits{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:visible}.bits__shadow{position:absolute;left:50%;bottom:6%;width:52%;height:10%;border-radius:50%;background:#00000047;transform:translate(-50%);animation:shadowPulse 2.4s ease-in-out infinite}.bits__bob{position:relative;width:82%;height:82%;transform-origin:50% 65%;animation:bob 2.4s ease-in-out infinite}.bits__img{width:100%;height:100%;object-fit:contain;display:block}.bits--pop{animation:bitsPop .35s cubic-bezier(.34,1.56,.64,1)}.bits--worst .bits__bob{animation:worstShiver .5s ease-in-out infinite}.bits__sparkles{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.spk{transform-box:fill-box;transform-origin:center;animation:twinkle 1.4s ease-in-out infinite}.spk--2{animation-delay:.35s}.spk--3{animation-delay:.7s}.screen--entry{justify-content:center;text-align:center}.entry__hero{display:flex;flex-direction:column;gap:6px}.entry__title{font-family:var(--font-display);font-size:clamp(2.6rem,12vw,3.6rem);line-height:1;margin:2px 0 0;color:#fff;text-shadow:0 4px 0 rgba(124,58,237,.55)}.entry__title span{color:var(--gold)}.entry__sub{margin:0;color:#efe8ffd1;font-size:.98rem}.entry__preview{width:148px;height:148px;margin:6px auto -4px}.entry__trait{margin:4px auto 2px;max-width:320px;text-align:center;font-size:.86rem;line-height:1.4;color:#efe8ffd1;min-height:2.5em}.entry__form{display:flex;flex-direction:column;gap:16px;text-align:left}.field{display:flex;flex-direction:column;gap:8px}.field__label{font-family:var(--font-display);font-size:1rem;color:#efe8ffeb}.field__input{font-family:var(--font-body);font-size:1.1rem;font-weight:500;padding:15px 16px;border-radius:var(--radius-sm);border:2px solid var(--stroke);background:#ffffff14;color:#fff;outline:none;transition:border-color .2s ease,background .2s ease}.field__input::placeholder{color:#efe8ff66}.field__input:focus{border-color:var(--purple-bright);background:#ffffff1f}.field__input--shake{animation:shake .4s ease;border-color:var(--c-worst, #ff6b6b)}.char-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.char-chip{--chip: #7c3aed;position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 6px;border-radius:var(--radius-sm);border:2px solid var(--stroke);background:#ffffff0d;color:#efe8ffd9;font-family:var(--font-body);font-weight:700;cursor:pointer;transition:transform .14s ease,border-color .2s ease,background .2s ease}.char-chip__trait{--trait-color: var(--purple);position:absolute;top:-6px;right:-6px;width:22px;height:22px;display:flex;align-items:center;justify-content:center;font-size:.75rem;line-height:1;border-radius:50%;background:var(--trait-color);border:1.5px solid var(--plum-900);box-shadow:0 2px 6px -2px var(--trait-color)}.char-chip__dot{width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff6,transparent 60%),var(--chip);box-shadow:0 4px 10px -3px var(--chip)}.char-chip__name{font-size:.82rem}.char-chip:active{transform:scale(.95)}.char-chip.is-selected{border-color:var(--chip);background:color-mix(in srgb,var(--chip) 22%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--chip) 35%,transparent)}.entry__hint{min-height:1.1em;margin:2px 0 0;text-align:center;font-size:.85rem;color:#efe8ff8c}.entry__hint--warn{color:#ffb0b0;font-weight:700}.screen--play{gap:14px}.play__top{display:flex;align-items:center;justify-content:space-between}.play__who{display:flex;flex-direction:column}.play__name{font-family:var(--font-display);font-size:1.35rem;color:#fff}.play__tier{font-size:.85rem;font-weight:700;color:var(--tier-neutral)}.play__tier[data-tier=best]{color:var(--tier-best)}.play__tier[data-tier=good]{color:var(--tier-good)}.play__tier[data-tier=neutral]{color:var(--tier-neutral)}.play__tier[data-tier=bad]{color:var(--tier-bad)}.play__tier[data-tier=worst]{color:var(--tier-worst)}.timer{position:relative;width:64px;height:64px;display:grid;place-items:center}.timer__ring{position:absolute;inset:0;transform:rotate(-90deg);width:64px;height:64px}.timer__track{fill:none;stroke:#ffffff1f;stroke-width:4}.timer__fill{fill:none;stroke:var(--c-health);stroke-width:4;stroke-linecap:round;transition:stroke-dashoffset 1s linear,stroke .4s ease}.timer__num{font-family:var(--font-display);font-size:1.5rem;color:#fff;font-variant-numeric:tabular-nums}.timer--warn .timer__fill{stroke:var(--c-worst, #ff6b6b)}.timer--warn .timer__num{color:#ff8a8a;animation:pulse 1s ease-in-out infinite}.stage{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}.stage__bits{width:min(58vw,260px);aspect-ratio:1;position:relative}.stage__quip{font-family:var(--font-display);font-size:1.05rem;color:#fff;background:var(--card);border:1px solid var(--stroke);padding:7px 16px;border-radius:999px;backdrop-filter:blur(6px);min-height:1em}.stage__score{font-size:.95rem;color:#efe8ffbf}.stage__score b{font-family:var(--font-display);font-size:1.3rem;color:var(--gold);margin-left:4px}.float-fb{position:absolute;bottom:40%;font-size:2rem;pointer-events:none;animation:floatUp .8s ease-out forwards}.stats{display:flex;flex-direction:column;gap:9px}.stat{display:grid;grid-template-columns:46px 1fr 38px;align-items:center;gap:10px}.stat__label{font-family:var(--font-display);font-size:.95rem;color:#efe8ffe6}.stat__bar{height:14px;border-radius:999px;background:#ffffff1a;overflow:hidden}.stat__fill{height:100%;border-radius:999px;width:0;transition:width .45s cubic-bezier(.34,1.4,.64,1)}.stat--health .stat__fill{background:linear-gradient(90deg,#22a877,var(--c-health))}.stat--happy .stat__fill{background:linear-gradient(90deg,#e14d6b,var(--c-happy))}.stat--fatigue .stat__fill{background:linear-gradient(90deg,#e69410,var(--c-fatigue))}.stat__fill--over{box-shadow:0 0 10px 2px currentColor;animation:statOverPulse 1.1s ease-in-out infinite}@keyframes statOverPulse{0%,to{filter:brightness(1)}50%{filter:brightness(1.35)}}.stat__num{font-family:var(--font-display);text-align:right;color:#fff;font-variant-numeric:tabular-nums}.stat--bump{animation:bump .4s ease}.actions{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.action{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 6px;border:none;border-radius:var(--radius);color:#fff;font-family:var(--font-display);cursor:pointer;transition:transform .12s ease,box-shadow .2s ease,filter .15s ease;box-shadow:0 10px 20px -10px #000000b3,inset 0 1px #ffffff59}.action__emoji{font-size:2rem;line-height:1}.action__label{font-size:1.05rem}.action--exercise{background:linear-gradient(150deg,#ff8a6a,var(--c-exercise))}.action--eat{background:linear-gradient(150deg,#ffc555,var(--c-eat))}.action--sleep{background:linear-gradient(150deg,#6fa6ff,var(--c-sleep))}.action:active{transform:translateY(3px) scale(.96)}.action--tapped{animation:tapPop .22s ease}.action:disabled{filter:grayscale(.6) brightness(.7);cursor:default}.screen--result{max-width:720px;justify-content:center}.result__grid{display:flex;flex-direction:column;gap:18px}.result__me{text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px;background:var(--card);border:1px solid var(--stroke);border-radius:var(--radius);padding:22px 20px;backdrop-filter:blur(8px)}.result__bits{width:150px;height:150px;animation:dropIn .6s cubic-bezier(.34,1.56,.64,1)}.result__tier{font-family:var(--font-display);font-size:1.1rem;padding:3px 14px;border-radius:999px;color:var(--plum-900);background:var(--tier-neutral)}.result__tier[data-tier=best]{background:var(--tier-best)}.result__tier[data-tier=good]{background:var(--tier-good)}.result__tier[data-tier=neutral]{background:var(--tier-neutral)}.result__tier[data-tier=bad]{background:var(--tier-bad)}.result__tier[data-tier=worst]{background:var(--tier-worst)}.result__name{font-family:var(--font-display);font-size:1.6rem;margin:2px 0 0;color:#fff}.result__score{display:flex;align-items:baseline;gap:6px}.result__score-num{font-family:var(--font-display);font-size:clamp(3.4rem,16vw,5rem);line-height:1;color:var(--gold);text-shadow:0 4px 0 rgba(0,0,0,.25);font-variant-numeric:tabular-nums}.result__score-unit{font-family:var(--font-display);font-size:1.4rem;color:#efe8ffcc}.result__breakdown{display:flex;gap:10px}.pill{font-family:var(--font-display);font-size:.95rem;padding:5px 14px;border-radius:999px;color:var(--plum-900)}.pill--health{background:var(--c-health)}.pill--happy{background:var(--c-happy)}.result__me .btn{margin-top:6px;min-width:200px}.result__board{background:var(--card);border:1px solid var(--stroke);border-radius:var(--radius);padding:18px;backdrop-filter:blur(8px)}.board__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.board__head h3{font-family:var(--font-display);font-size:1.3rem;margin:0;color:#fff}.board__refresh{border:1px solid var(--stroke);background:#ffffff14;color:#fff;width:36px;height:36px;border-radius:50%;font-size:1.1rem;cursor:pointer;transition:transform .3s ease}.board__refresh:active{transform:rotate(180deg)}.board__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.board__loading{text-align:center;color:#efe8ff80;padding:18px}.board__row{--char: var(--purple);display:grid;grid-template-columns:42px 22px 1fr auto;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--radius-sm);background:#ffffff0d;animation:rowIn .4s ease backwards;animation-delay:calc(var(--i) * .05s)}.board__row--top{background:#ffd84d1a}.board__row--me{background:color-mix(in srgb,var(--purple-bright) 26%,transparent);box-shadow:0 0 0 2px var(--purple-bright)}.board__rank{font-family:var(--font-display);font-size:1.2rem;text-align:center;color:#efe8ffd9}.board__dot{width:20px;height:20px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff8,transparent 60%),var(--char)}.board__player{font-family:var(--font-display);font-size:1.15rem;color:#fff;display:flex;align-items:center;gap:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.board__you{font-size:.7rem;background:var(--purple-bright);color:#fff;padding:1px 8px;border-radius:999px}.board__pts{font-family:var(--font-display);font-size:1.35rem;color:var(--gold);font-variant-numeric:tabular-nums}.board__pts small{font-size:.7rem;color:#efe8ff99;margin-left:2px}@media(min-width:720px){.result__grid{flex-direction:row;align-items:stretch}.result__me{flex:0 0 46%;justify-content:center}.result__board{flex:1}.board__player{font-size:1.3rem}}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes shadowPulse{0%,to{transform:scaleX(1);opacity:.28}50%{transform:scaleX(.82);opacity:.2}}@keyframes bitsPop{0%{transform:scale(1)}40%{transform:scale(1.12) rotate(-3deg)}to{transform:scale(1)}}@keyframes worstShiver{0%,to{transform:translate(0) rotate(0)}25%{transform:translate(-2px) rotate(-1.5deg)}75%{transform:translate(2px) rotate(1.5deg)}}@keyframes heartBeat{0%,to{transform:scale(1)}30%{transform:scale(1.25)}45%{transform:scale(1.05)}}@keyframes twinkle{0%,to{transform:scale(.6);opacity:.2}50%{transform:scale(1.1);opacity:1}}@keyframes breathe{0%,to{transform:translateY(0);box-shadow:0 10px 24px -8px #7c3aede6,inset 0 1px #ffffff59}50%{transform:translateY(-3px);box-shadow:0 18px 32px -8px #7c3aed,inset 0 1px #ffffff59}}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-7px)}40%,80%{transform:translate(7px)}}@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.03)}to{transform:scale(1)}}@keyframes tapPop{0%{transform:scale(1)}40%{transform:scale(1.08)}to{transform:scale(1)}}@keyframes floatUp{0%{transform:translateY(0) scale(.6);opacity:0}30%{opacity:1}to{transform:translateY(-90px) scale(1.3);opacity:0}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.18)}}@keyframes dropIn{0%{transform:translateY(-40px) scale(.6);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}@keyframes rowIn{0%{transform:translate(-16px);opacity:0}to{transform:translate(0);opacity:1}}.btn--secondary{background:#ffffff1a;border:1px solid var(--stroke)}.btn--ghost{background:transparent;border:1px solid var(--stroke);color:#efe8ffd9;display:inline-flex;align-items:center;justify-content:center;text-decoration:none}.btn--danger{background:linear-gradient(135deg,#ff6b6b,#d63b3b);box-shadow:0 10px 24px -8px #d63b3bb3}.screen--admin{max-width:560px;gap:16px}.admin__head h1{font-family:var(--font-display);font-size:1.8rem;margin:4px 0;color:#fff}.admin__warn{background:#ff6b6b26;border:1px solid rgba(255,107,107,.4);border-radius:var(--radius-sm);padding:10px 14px;color:#ffd0d0;font-size:.9rem}.admin__card{background:var(--card);border:1px solid var(--stroke);border-radius:var(--radius);padding:18px;display:flex;flex-direction:column;gap:12px}.admin__card h2{font-family:var(--font-display);font-size:1.05rem;margin:0;color:#efe8ffe6}.admin__row{display:flex;gap:10px;flex-wrap:wrap}.admin__row .field,.admin__row .btn{flex:1;min-width:140px}.admin__session-input{max-width:140px}.admin__hint{margin:0;font-size:.85rem;color:#efe8ff99}.admin__status{margin:0;white-space:pre-wrap;font-family:ui-monospace,SF Mono,monospace;font-size:.85rem;color:#efe8ffd9;background:#00000040;border-radius:var(--radius-sm);padding:12px}.admin__msg{min-height:1.2em;text-align:center;font-size:.9rem;color:var(--gold)}.admin__msg--error{color:#ff9b9b}.screen--dashboard{max-width:900px;margin:0 auto;justify-content:flex-start;gap:22px}.dashboard__head{text-align:center}.dashboard__title{font-family:var(--font-display);font-size:clamp(2rem,5vw,3rem);margin:4px 0;color:#fff}.dashboard__session{margin:0;color:#efe8ff99;font-size:1rem}.board__list--dashboard{gap:14px}.board__list--dashboard .board__row{grid-template-columns:64px 32px 1fr auto;padding:20px 24px;font-size:1.3rem;border-radius:var(--radius)}.board__list--dashboard .board__rank{font-size:1.8rem}.board__list--dashboard .board__pts{font-size:1.5rem}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}
