:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-family:system-ui,sans-serif;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}*{box-sizing:border-box}body{min-height:100vh;margin:0}:root{--bg:#1e3ca2;--backdrop:#1e3ca2;--surface:#0b1848cc;--surface-strong:#0b1848f2;--text:#fff;--text-dim:#c9d4f5;--line:#ffffff38;--accent:#d9a85b;--accent-hi:#f3d9aa;--accent-fg:#0b1848;--glow:#f3d9aa8c;--radius:10px;--blur:10px;--title-gradient:linear-gradient(90deg, #fff6df, #d9a85b);--font-ui:"Outfit", system-ui, sans-serif;--font-display:"Big Shoulders Display", sans-serif;--ease-spring:cubic-bezier(.34, 1.56, .64, 1)}html,body{background:var(--bg);color:var(--text);font-family:var(--font-ui);transition:background-color .6s,color .4s}::selection{background:var(--accent);color:var(--accent-fg)}*{scrollbar-color:var(--accent) transparent;scrollbar-width:thin}.app{isolation:isolate;flex-direction:column;min-height:100vh;display:flex;position:relative}.app:before{content:"";z-index:-2;background:var(--backdrop);transition:opacity .6s;position:fixed;inset:0}.scene{z-index:-1;pointer-events:none;display:block;position:fixed;inset:0}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.muted{color:var(--text-dim)}.top{flex-wrap:wrap;align-items:center;gap:10px;padding:12px 16px;display:flex}.title{min-width:0;font:400 clamp(26px, 4.2vw, 44px) / 1.1 var(--font-display);letter-spacing:.02em;flex:220px;margin:0}.title__button{all:unset;cursor:text;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius);background:var(--title-gradient);-webkit-text-fill-color:transparent;color:#0000;background-size:300%;-webkit-background-clip:text;background-clip:text;max-width:100%;padding:2px 6px;display:inline-block;overflow:hidden}.title__button:focus-visible{outline:3px solid var(--accent)}.title__button.is-empty{opacity:.55}.title__input{box-sizing:border-box;width:100%;font:inherit;letter-spacing:inherit;color:var(--text);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:2px 6px}@media (prefers-reduced-motion:no-preference){:root[data-title-motion=shimmer] .title__button{animation:7s ease-in-out infinite title-shimmer}:root[data-title-motion=glow] .title__button{filter:drop-shadow(0 0 14px var(--glow));animation:11s ease-in-out infinite title-shimmer}:root[data-title-motion=flicker] .title__button{filter:drop-shadow(0 0 10px var(--glow));animation:6s linear infinite title-shimmer,5.2s step-end infinite title-flicker}}@keyframes title-shimmer{0%,to{background-position:0%}50%{background-position:100%}}@keyframes title-flicker{0%,to{opacity:1}41%{opacity:1}42%{opacity:.35}43%{opacity:1}45%{opacity:.6}46%{opacity:1}88%{opacity:.8}89%{opacity:1}}.top__actions{flex-wrap:wrap;gap:6px;display:flex}button,input,select,textarea{font:inherit;color:inherit}button{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);cursor:pointer;min-height:40px;-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));transition:transform .28s var(--ease-spring), box-shadow .28s ease, background-color .2s ease, border-color .2s ease, filter .2s ease;padding:8px 14px;position:relative}button:disabled{opacity:.5;cursor:default}button.primary{background:linear-gradient(180deg, var(--accent-hi), var(--accent) 55%);color:var(--accent-fg);box-shadow:0 6px 22px -8px var(--glow);border-color:#0000;font-weight:700}button.link{min-height:0;color:inherit;-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border:0;padding:0;text-decoration:underline}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}@media (prefers-reduced-motion:no-preference){:root[data-hover=lift] button:hover:not(:disabled):not(.link){box-shadow:0 10px 28px -10px var(--glow);border-color:var(--accent);transform:translateY(-3px)}:root[data-hover=bloom] button:hover:not(:disabled):not(.link){box-shadow:0 0 0 1px var(--accent), 0 12px 34px -8px var(--glow);transform:translateY(-2px)scale(1.03)}:root[data-hover=ripple] button:hover:not(:disabled):not(.link){border-color:var(--accent);animation:.8s ease-out hover-ripple;transform:translateY(-2px)}:root[data-hover=tilt] button:hover:not(:disabled):not(.link){box-shadow:4px 8px 0 -2px var(--glow);transform:translateY(-2px)rotate(-1.2deg)scale(1.02)}:root[data-hover=glitch] button:hover:not(:disabled):not(.link){box-shadow:2px 0 0 var(--accent), -2px 0 0 var(--glow);border-color:var(--accent);animation:.35s steps(2,end) hover-glitch}:root[data-hover=press] button:hover:not(:disabled):not(.link){border-color:var(--accent);filter:brightness(1.06)}button:active:not(:disabled):not(.link){transition-duration:80ms;transform:translateY(1px)scale(.98)}}@keyframes hover-ripple{0%{box-shadow:0 0 0 0 var(--glow)}to{box-shadow:0 0 0 14px #0000}}@keyframes hover-glitch{0%{transform:translate(0)}25%{transform:translate(-2px,1px)skew(-4deg)}50%{transform:translate(2px,-1px)skew(3deg)}to{transform:translate(0)}}input[type=text],input:not([type]),input[type=number],select,textarea{background:color-mix(in srgb, var(--surface-strong) 70%, transparent);border:1px solid var(--line);border-radius:calc(var(--radius) * .7);color:var(--text);padding:8px;transition:border-color .2s,box-shadow .2s}input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--glow) 50%, transparent);outline:none}input[type=radio],input[type=checkbox]{accent-color:var(--accent)}.main{flex:1;grid-template-columns:1fr;gap:16px;padding:0 16px 24px;display:grid}@media (width>=900px){.main{grid-template-columns:minmax(0,1fr) 380px;align-items:start}}.stageWrap{flex-direction:column;align-items:center;gap:12px;display:flex;position:relative}.stage{aspect-ratio:1;width:min(100%,92vmin,860px);position:relative}.stage__wheel{filter:drop-shadow(0 24px 48px #00000059);width:100%;height:100%;display:block;position:absolute;inset:0}:root[data-mood=light] .stage__wheel{filter:drop-shadow(0 18px 30px #0000001f)}.stage__hub{-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border:0;border-radius:50%;width:18%;height:18%;min-height:0;padding:0;position:absolute;top:41%;left:41%}.stage__hub:hover{box-shadow:none!important;animation:none!important;transform:none!important}.stage__inner{aspect-ratio:1;opacity:0;pointer-events:none;filter:drop-shadow(0 12px 30px #0000008c);width:60%;transition:opacity .35s,transform .35s;position:absolute;top:20%;left:20%;transform:scale(.8)}.stage__inner.is-on{opacity:1;transform:scale(1)}.stage__innerWheel{width:100%;height:100%;display:block}.stage__reel{border-radius:var(--radius);background:var(--surface-strong);border:2px solid var(--accent);width:70%;height:40%;box-shadow:0 18px 60px #0000008c, 0 0 40px -10px var(--glow);opacity:0;pointer-events:none;transition:opacity .35s,transform .35s;position:absolute;top:30%;left:15%;overflow:hidden;transform:scale(.9);-webkit-mask-image:linear-gradient(#0000,#000 25% 75%,#0000);mask-image:linear-gradient(#0000,#000 25% 75%,#0000)}.stage__reel.is-on{opacity:1;transform:scale(1)}.stage__reelRow{text-align:center;height:1.4em;line-height:1.4em;font:400 clamp(20px, 3.6vmin, 32px) / 1.4em var(--font-display);white-space:nowrap;text-overflow:ellipsis;will-change:transform;padding:0 12px;position:absolute;top:calc(50% - .7em);left:0;right:0;overflow:hidden}.stage__reelRow.is-centre{color:var(--accent-hi);text-shadow:0 0 18px var(--glow)}.controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;display:flex}.spin{font:400 22px / 1 var(--font-display);letter-spacing:.06em;min-height:56px;padding:14px 44px}.status{min-height:1.4em;color:var(--text-dim);margin:0}.side{background:var(--surface);border:1px solid var(--line);border-radius:calc(var(--radius) * 1.2);-webkit-backdrop-filter:blur(var(--blur)) saturate(1.2);backdrop-filter:blur(var(--blur)) saturate(1.2);overflow:hidden;box-shadow:0 20px 60px -30px #0009}.tabs{border-bottom:1px solid var(--line);display:flex}.tab{-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border:0;border-radius:0;flex:1}.tab:hover{background:color-mix(in srgb, var(--accent) 12%, transparent);box-shadow:none!important;animation:none!important;transform:none!important}.tab.is-on{background:linear-gradient(180deg, var(--accent-hi), var(--accent));color:var(--accent-fg);font-weight:700}.panel{padding:14px}.panel h2{font:400 22px / 1.2 var(--font-display);letter-spacing:.02em;margin:0 0 10px}.panel__head{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.panel__head h2{flex:1;margin:0}fieldset{border:1px solid var(--line);border-radius:var(--radius);flex-direction:column;gap:8px;margin:0 0 12px;padding:10px 12px;display:flex}legend{padding:0 6px;font-weight:700}label{flex-wrap:wrap;align-items:center;gap:8px;display:flex}input[type=number]{width:5em}.editor__box{resize:vertical;box-sizing:border-box;width:100%;min-height:220px;font-family:ui-monospace,monospace;font-size:14px}.editor__count,.editor__note{margin:6px 0}.editor__confirm{border:1px solid var(--accent);border-radius:var(--radius);flex-wrap:wrap;gap:8px;margin:8px 0;padding:10px;display:flex}.editor__confirm p{width:100%;margin:0}.editor__tools{flex-wrap:wrap;gap:6px;margin-top:8px;display:flex}.editor__remove{gap:6px;display:flex}.editor__remove input{flex:1;min-width:0}.history{max-height:60vh;margin:10px 0 0;padding:0;list-style:none;overflow:auto}.history__item{border-bottom:1px solid var(--line);gap:8px;padding:6px 0;display:flex}.history__item.is-void .history__name{color:var(--text-dim);text-decoration:line-through}.history__name{flex:1}.history__time,.history__tag{color:var(--text-dim);font-size:13px}.themes__family{letter-spacing:.18em;text-transform:uppercase;color:var(--text-dim);margin:4px 0 2px;font-size:12px}.themes{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;display:grid}.swatch{border:1px solid var(--line);border-radius:var(--radius);cursor:pointer;background:var(--surface-strong);transition:transform .25s var(--ease-spring), border-color .2s ease, box-shadow .2s ease;grid-template-rows:64px auto;align-items:stretch;gap:0;display:grid;position:relative;overflow:hidden}.swatch input{opacity:0;pointer-events:none;position:absolute}.swatch:hover{border-color:var(--accent);transform:translateY(-2px)}.swatch:has(input:focus-visible){outline:3px solid var(--accent);outline-offset:2px}.swatch.is-on{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent), 0 10px 30px -12px var(--glow)}.swatch__art{position:relative;overflow:hidden}.swatch__wheel{width:48px;height:48px;box-shadow:0 0 0 3px var(--sw-metal), 0 6px 14px #0006;border-radius:50%;position:absolute;top:8px;right:10px}.swatch__dot{width:14px;height:14px;box-shadow:0 0 10px var(--sw-glow);border-radius:50%;position:absolute;bottom:8px;left:10px}.swatch__name{justify-content:space-between;gap:6px;padding:6px 10px 8px;font-size:14px;font-weight:700;display:flex}.swatch__mood{color:var(--text-dim);font-size:11px;font-weight:400}.theme__about{color:var(--text-dim);margin:8px 0 0;font-size:13px}.reveal{pointer-events:none;z-index:5;place-items:center;display:grid;position:absolute;inset:0}.reveal__card{pointer-events:auto;background:radial-gradient(ellipse at 50% 0%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 70%), var(--surface-strong);border:2px solid var(--accent);border-radius:calc(var(--radius) * 1.6);text-align:center;max-width:min(90%,500px);box-shadow:0 18px 60px #00000080, 0 0 60px -10px var(--glow);-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));animation:reveal-burst .55s var(--ease-spring) both;padding:22px 30px}:root[data-reveal-motion=rise] .reveal__card{animation-name:reveal-rise;animation-timing-function:cubic-bezier(.2,.9,.3,1)}:root[data-reveal-motion=unfold] .reveal__card{animation-name:reveal-unfold;animation-duration:.7s}:root[data-reveal-motion=flip] .reveal__card{animation-name:reveal-flip;animation-duration:.7s}:root[data-reveal-motion=drop] .reveal__card{animation-name:reveal-drop;animation-duration:.75s}@keyframes reveal-burst{0%{opacity:0;transform:scale(.55)}to{opacity:1;transform:scale(1)}}@keyframes reveal-rise{0%{opacity:0;filter:blur(6px);transform:translateY(40px)}to{opacity:1;filter:none;transform:none}}@keyframes reveal-unfold{0%{opacity:0;transform:scaleY(.05)scaleX(.6)}55%{opacity:1;transform:scaleY(1.04)scaleX(1)}to{transform:none}}@keyframes reveal-flip{0%{opacity:0;transform:perspective(700px)rotateX(-85deg)}to{opacity:1;transform:perspective(700px)rotateX(0)}}@keyframes reveal-drop{0%{opacity:0;transform:translateY(-120px)rotate(-4deg)}60%{opacity:1;transform:translateY(10px)rotate(1deg)}80%{transform:translateY(-4px)rotate(0)}to{transform:none}}@media (prefers-reduced-motion:reduce){.reveal__card,:root[data-reveal-motion] .reveal__card{animation:.3s both reveal-fade}}:root[data-reduced="1"] .reveal__card{animation:.3s both reveal-fade!important}@keyframes reveal-fade{0%{opacity:0}to{opacity:1}}.reveal__eyebrow{letter-spacing:.24em;text-transform:uppercase;color:var(--text-dim);margin:0 0 6px;font-size:13px}.reveal__photo{object-fit:cover;border:3px solid var(--accent);width:140px;height:140px;box-shadow:0 0 30px -6px var(--glow);border-radius:50%;margin:6px auto 10px;display:block}.reveal__name{font:400 clamp(34px, 6.5vmin, 60px) / 1.05 var(--font-display);overflow-wrap:anywhere;background:var(--title-gradient);-webkit-text-fill-color:transparent;color:#0000;filter:drop-shadow(0 2px 14px var(--glow));background-size:250%;-webkit-background-clip:text;background-clip:text;margin:0 0 16px}@media (prefers-reduced-motion:no-preference){.reveal__name{animation:4s ease-in-out infinite title-shimmer}}:root[data-mood=light] .reveal__name{filter:none}.reveal__actions{justify-content:center;gap:8px;display:flex}.overlay{z-index:10;background:#0000008c;place-items:center;padding:16px;animation:.2s both reveal-fade;display:grid;position:fixed;inset:0}.overlay__card{background:var(--surface-strong);border:1px solid var(--line);border-radius:calc(var(--radius) * 1.4);flex-direction:column;gap:12px;width:100%;max-width:520px;padding:20px;display:flex;box-shadow:0 30px 80px -20px #0009}.overlay__card h2{font:400 26px / 1.2 var(--font-display);margin:0}.keys{grid-template-columns:auto 1fr;gap:6px 14px;margin:0;display:grid}.keys dt{font-weight:700}.keys dd{margin:0}.share__url{box-sizing:border-box;width:100%}.row{align-items:center;gap:10px;display:flex}
