@import "https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&display=swap";:root{color:#f8f5ed;font-synthesis:none;background:#0b1020;font-family:DM Sans,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}button:focus-visible,textarea:focus-visible{outline-offset:3px;outline:2px solid #ffe07a}.gachaspin-app{isolation:isolate;background:radial-gradient(circle at 48% 44%,#2b4470 0,#172541 25%,#0c1428 58%,#070b17 100%);min-height:100svh;position:relative;overflow:hidden}.gachaspin-app:before{content:"";z-index:-1;opacity:.38;background-image:linear-gradient(#ffffff06 1px,#0000 1px),linear-gradient(90deg,#ffffff06 1px,#0000 1px);background-size:44px 44px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(circle at 48% 52%,#000,#0000 72%);mask-image:radial-gradient(circle at 48% 52%,#000,#0000 72%)}.g-header{border-bottom:1px solid #e7f0ff1c;grid-template-columns:1fr auto 1fr;align-items:center;width:min(1380px,100% - 72px);height:76px;margin:auto;display:grid}.g-logo{color:#f7f5ee;letter-spacing:.12em;align-items:center;gap:9px;width:max-content;font-family:DM Mono,monospace;font-size:11px;font-weight:500;text-decoration:none;display:inline-flex}.g-logo span{color:#14203c;letter-spacing:0;background:#ffcf3d;border-radius:50%;place-items:center;width:24px;height:24px;font-family:Fraunces,serif;font-size:17px;font-weight:700;display:grid;box-shadow:0 0 18px #ffcf3d4d}.g-header>p{color:#6c7896;letter-spacing:.16em;margin:0;font-family:DM Mono,monospace;font-size:9px}.g-status{color:#8293b8;letter-spacing:.1em;justify-self:end;align-items:center;gap:16px;font-family:DM Mono,monospace;font-size:9px;display:flex}.status-badge{align-items:center;gap:8px;display:flex}.status-badge i{background:#68e2a1;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 4px #68e2a11a,0 0 12px #68e2a1}.record-btn{color:#9facca;letter-spacing:.1em;cursor:pointer;background:#040a1866;border:1px solid #d6e2ff1c;border-radius:6px;align-items:center;gap:6px;padding:6px 10px;font-family:DM Mono,monospace;font-size:9px;transition:all .2s;display:inline-flex}.record-btn:hover{color:#dbe4f6;background:#d6e2ff14}.record-btn.is-recording{color:#ff5c5c;background:#ff5c5c0d;border-color:#ff5c5c33}.recording-dot{background:#ff5c5c;border-radius:50%;width:8px;height:8px;animation:1.5s infinite pulse-record;box-shadow:0 0 8px #ff5c5c}@keyframes pulse-record{0%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.g-layout{grid-template-columns:minmax(250px,.82fr) minmax(480px,1.35fr) minmax(280px,.7fr);align-items:center;gap:clamp(22px,3vw,52px);width:min(1320px,100% - 72px);min-height:calc(100svh - 132px);margin:0 auto;display:grid}.g-copy{align-self:center;padding-bottom:65px}.kicker{color:#ffcf3d;letter-spacing:.13em;align-items:center;gap:7px;margin:0 0 18px;font-family:DM Mono,monospace;font-size:10px;display:flex}.g-copy h1{color:#f8f6ef;letter-spacing:-.052em;max-width:440px;margin:0;font-family:Fraunces,Georgia,serif;font-size:clamp(40px,4.1vw,66px);font-weight:600;line-height:.99}.g-copy h1 em{color:#ffce42;font-style:italic}.description{color:#9aa7c2;max-width:325px;margin:23px 0 0;font-size:14px;line-height:1.7}.stats{gap:22px;margin-top:34px;display:flex}.stats span{color:#65718d;letter-spacing:.1em;gap:4px;font-family:DM Mono,monospace;font-size:9px;display:grid}.stats b{color:#e8eefc;letter-spacing:0;font-family:Fraunces,serif;font-size:22px;font-weight:600}.machine-stage{cursor:grab;align-self:stretch;place-items:center;min-height:620px;display:grid;position:relative;overflow:hidden}.machine-stage:active{cursor:grabbing}.three-mount{z-index:2;position:absolute;inset:0}.three-mount canvas{width:100%;height:100%;display:block}.stage-orbit{z-index:0;pointer-events:none;border:1px solid #aecaff1a;border-radius:50%;position:absolute}.orbit-one{border-color:#88b2ff1f;width:570px;height:570px}.orbit-two{border-color:#ffd34a1a;width:430px;height:430px;transform:rotateX(67deg)rotate(-22deg)}.stage-chip{z-index:3;white-space:nowrap;color:#8190ad;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);letter-spacing:.11em;pointer-events:none;background:#0b122473;border:1px solid #d6e1fa1a;border-radius:999px;align-items:center;gap:7px;padding:8px 11px;font-family:DM Mono,monospace;font-size:8px;display:flex;position:absolute;top:35px;left:50%;transform:translate(-50%)}.lever-hint{z-index:4;color:#11182a;cursor:pointer;letter-spacing:.1em;background:#ffcf3d;border:0;border-radius:999px;align-items:center;gap:8px;padding:12px 16px;font-family:DM Mono,monospace;font-size:10px;font-weight:500;transition:transform .22s,background .22s;display:flex;position:absolute;bottom:42px;left:50%;transform:translate(-50%);box-shadow:0 11px 25px #ffcf3d38}.lever-hint:hover:not(:disabled){background:#ffe071;transform:translate(-50%)translateY(-3px)}.lever-hint:disabled{opacity:.74;cursor:wait}.control-card{color:#dbe5fb;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(145deg,#29395b6b,#111a328f);border:1px solid #d6e2ff1f;border-radius:20px;padding:22px;box-shadow:0 24px 70px #00000029,inset 0 1px #ffffff0a}.control-heading{color:#ffcf3d;letter-spacing:.1em;justify-content:space-between;align-items:center;margin-bottom:20px;font-family:DM Mono,monospace;font-size:10px;display:flex}.control-heading small{color:#7786a6;font-size:9px}.list-actions{grid-template-columns:1fr 1fr;gap:8px;margin-bottom:18px;display:grid}.secondary-btn{color:#9facca;letter-spacing:.1em;cursor:pointer;background:#040a1866;border:1px solid #d6e2ff1c;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:8px;padding:10px;font-family:DM Mono,monospace;font-size:9px;text-decoration:none;transition:all .2s;display:inline-flex}.secondary-btn:hover:not(:disabled):not(.disabled){color:#dbe4f6;background:#d6e2ff14}.secondary-btn:disabled,.secondary-btn.disabled{opacity:.5;cursor:not-allowed}.control-card label[for=ideas]{color:#9facca;margin-bottom:9px;font-size:11px;font-weight:600;display:block}.control-card textarea{resize:vertical;color:#dbe4f6;background:#040a184d;border:1px solid #d6e2ff1c;border-radius:10px;width:100%;min-height:168px;padding:12px 13px;font-family:DM Mono,monospace;font-size:11px;line-height:1.75}.control-card textarea::placeholder{color:#586886}.spin-button{color:#172037;cursor:pointer;letter-spacing:.08em;background:linear-gradient(110deg,#ffca36,#ffdc63);border:0;border-radius:10px;align-items:center;gap:10px;width:100%;margin-top:15px;padding:14px 13px;font-family:DM Mono,monospace;font-size:10px;font-weight:500;transition:transform .22s,filter .22s;display:flex;box-shadow:0 10px 24px #ffc9342b}.spin-button span{text-align:left;flex:1}.spin-button b{font-size:16px}.spin-button:hover:not(:disabled){filter:brightness(1.08);transform:translateY(-2px)}.spin-button:disabled{opacity:.62;cursor:wait}.control-note{color:#72819f;align-items:flex-start;gap:6px;margin:14px 1px 0;font-size:10px;line-height:1.5;display:flex}.control-note svg{color:#ffce40;flex:none;margin-top:2px}.history{border-top:1px solid #d6e2ff1a;margin-top:20px;padding-top:15px}.history>span{color:#6d7c9b;letter-spacing:.11em;font-family:DM Mono,monospace;font-size:8px}.history p{color:#c8d3ec;white-space:nowrap;text-overflow:ellipsis;align-items:center;gap:8px;margin:9px 0 0;font-size:11px;display:flex;overflow:hidden}.history i{border-radius:50%;flex:none;width:8px;height:8px}footer{color:#596683;letter-spacing:.11em;text-align:center;width:min(1320px,100% - 72px);margin:0 auto 20px;font-family:DM Mono,monospace;font-size:8px}footer span{color:#ffcf3d;margin:0 9px}.result-overlay{z-index:20;visibility:hidden;opacity:0;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#040813ab;place-items:center;padding:20px;transition:visibility 0s linear .32s,opacity .32s;display:grid;position:fixed;inset:0}.result-overlay.is-open{visibility:visible;opacity:1;transition-delay:0s}.result-card{text-align:center;color:#172037;background:radial-gradient(circle at 50% -10%,#fff4bd,#0000 41%),linear-gradient(145deg,#fff8de,#f3e7bd);border:1px solid #ffffffa6;border-radius:24px;width:min(430px,100%);padding:47px 34px 33px;transition:transform .42s cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden;transform:translateY(24px)scale(.95);box-shadow:0 35px 100px #0000006b}.is-open .result-card{transform:none}.close-result{color:#745d3b;cursor:pointer;background:#fff6;border:1px solid #5c462726;border-radius:50%;place-items:center;width:31px;height:31px;display:grid;position:absolute;top:13px;right:13px}.result-capsule{background:radial-gradient(circle at 32% 24%, #ffffff7a, transparent 18%), var(--capsule-color);width:72px;height:72px;box-shadow:inset -10px -10px 16px #32235a2e, inset 8px 8px 13px #ffffff4f, 0 11px 20px color-mix(in srgb, var(--capsule-color) 38%, transparent);border-radius:50%;margin:0 auto 20px;animation:1.8s ease-in-out infinite result-bob;position:relative}.result-capsule:after{content:"";background:#ffffffc7;height:4px;position:absolute;top:34px;left:0;right:0}.result-capsule span{background:#fff6;border-radius:50%;width:9px;height:9px;position:absolute;top:16px;left:19px}.result-card p{color:#9f7c2c;letter-spacing:.14em;margin:0;font-family:DM Mono,monospace;font-size:9px}.result-card h2{color:#172037;letter-spacing:-.04em;max-width:330px;margin:13px auto 26px;font-family:Fraunces,Georgia,serif;font-size:clamp(27px,6vw,39px);font-weight:600;line-height:1.03}.action-btn{cursor:pointer;letter-spacing:.1em;border:0;border-radius:999px;justify-content:center;align-items:center;gap:8px;width:100%;margin-bottom:10px;padding:11px 15px;font-family:DM Mono,monospace;font-size:9px;font-weight:500;transition:all .2s;display:inline-flex}.stop-record-btn{color:#fff;background:#ff5c5c}.stop-record-btn:hover{background:#e04a4a}.video-actions{gap:10px;margin-bottom:10px;display:flex}.download-btn{color:#fff8e3;background:#1a2a4b;margin-bottom:0}.download-btn:hover{background:#132039}.share-btn{color:#1a2a4b;background:0 0;border:1px solid #1a2a4b;margin-bottom:0}.share-btn:hover{background:#1a2a4b0d}.result-actions{gap:8px;width:100%;margin-top:10px;display:flex}.remove-btn{color:#b84f4f;background:#b84f4f1a;flex:1;margin-bottom:0}.remove-btn:hover{background:#b84f4f2e}.ok-btn{color:#1a2a4b;background:0 0;border:1px solid #1a2a4b33;flex:1;margin-bottom:0}.ok-btn:hover{background:#1a2a4b0d}.spin-again-btn{color:#fff8e3;background:#243b68;flex:1.5;margin-bottom:0}.spin-again-btn:hover:not(:disabled){background:#1a2a4b}.spin-again-btn:disabled{opacity:.6;cursor:not-allowed}@keyframes result-bob{50%{transform:translateY(-7px)rotate(5deg)}}@media (width<=1080px){.g-layout{grid-template-columns:minmax(240px,.8fr) minmax(440px,1.25fr);padding:16px 0 40px}.control-card{grid-column:1/-1;justify-self:center;width:min(600px,100%)}.control-card textarea{min-height:120px}.machine-stage{min-height:560px}.g-copy{padding-bottom:0}}@media (width<=730px){.g-header,.g-layout,footer{width:min(100% - 34px,500px)}.g-header{grid-template-columns:1fr auto;height:62px}.g-header>p{display:none}.g-status{font-size:8px}.g-layout{flex-direction:column;gap:0;display:flex}.g-copy{width:100%;padding:36px 0 3px}.g-copy h1{font-size:clamp(42px,12vw,56px)}.description{margin-top:16px}.stats{margin-top:22px}.machine-stage{width:100%;min-height:470px;margin-top:-8px}.stage-chip{top:19px}.lever-hint{bottom:19px}.control-card{width:100%;margin:2px 0 35px}.result-card{padding:42px 24px 27px}footer{margin-bottom:17px;line-height:1.7}}
