:root{--bg: #18222d;--bg-elevated: #232e3c;--text: #e4ecf4;--text-muted: #8b9cb3;--accent: #2a7dd4;--white: #ffffff;--pink: #e891ad;--pink-dark: #c97a94;--safe-top: env(safe-area-inset-top, 0);--safe-bottom: env(safe-area-inset-bottom, 0);--tabs-height: calc(12px + 12px + 1.3125em + var(--safe-top));--panel-top-block: 64px;--wheel-size: min(280px, 85vw)}*,*:before,*:after{box-sizing:border-box}html{-webkit-tap-highlight-color:transparent}body{margin:0;min-height:100dvh;min-height:100vh;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:1.4;padding-bottom:var(--safe-bottom)}#app{min-height:100dvh;min-height:100vh;display:flex;flex-direction:column}.tabs{display:flex;gap:0;padding:calc(12px + var(--safe-top)) 16px 12px;background:var(--bg);border-bottom:1px solid rgba(255,255,255,.08);position:sticky;top:0;z-index:10}.tab{flex:1;padding:12px 16px;border:none;background:transparent;color:var(--text-muted);font-size:15px;font-weight:500;cursor:pointer;border-radius:10px;transition:color .2s,background .2s}.tab:hover{color:var(--text);background:#ffffff0f}.tab.active{color:var(--accent);background:#2a7dd426}.tab:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.panels{flex:1;position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:0}.panel{display:none;flex-direction:column;flex:1;min-height:0;padding:16px;padding-bottom:calc(16px + var(--safe-bottom))}.panel.active{display:flex}.title{margin:0 0 20px;font-size:20px;font-weight:600;text-align:center;color:var(--text);flex-shrink:0}.wheel-wrap{display:flex;flex-direction:column;align-items:center;min-height:0;position:relative;padding-top:calc(50dvh - var(--tabs-height) - var(--panel-top-block) - (var(--wheel-size) / 2))}.wheel-container{position:relative;width:var(--wheel-size);aspect-ratio:1;flex-shrink:0}.wheel-pointer{position:absolute;top:-4px;left:50%;transform:translate(-50%);z-index:2;width:0;height:0;border-left:14px solid transparent;border-right:14px solid transparent;border-top:28px solid var(--accent);pointer-events:none}.wheel{width:100%;height:100%;border-radius:50%;position:relative;cursor:pointer;overflow:visible;touch-action:manipulation;transition:transform .1s}.wheel:active{transform:scale(.98)}.wheel.spinning{cursor:default;pointer-events:none}.wheel-sectors{width:100%;height:100%;border-radius:50%;position:relative;background:conic-gradient(from 0deg,var(--white) 0deg 45deg,var(--pink) 45deg 90deg,var(--white) 90deg 135deg,var(--pink) 135deg 180deg,var(--white) 180deg 225deg,var(--pink) 225deg 270deg,var(--white) 270deg 315deg,var(--pink) 315deg 360deg)}.wheel-labels{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;pointer-events:none}.wheel-label{position:absolute;left:50%;top:50%;width:48%;transform-origin:0 50%;display:flex;align-items:center;justify-content:flex-start;padding-left:40px;transform:translateY(-50%)}.wheel-label span{white-space:nowrap;font-size:10px;font-weight:600;color:#1a1a1a;text-shadow:0 0 1px rgba(255,255,255,.6);max-width:100%;overflow:hidden;text-overflow:ellipsis}.wheel-label.pink span{color:#4a2a35}.wheel-center{position:absolute;left:50%;top:50%;width:20%;height:20%;margin:-10% 0 0 -10%;background:var(--bg-elevated);border:3px solid var(--accent);border-radius:50%;box-shadow:0 0 0 2px var(--bg)}.wheel-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#18222deb;border-radius:50%;padding:24px;text-align:center}.wheel-overlay.hidden{display:none}.result-text{font-size:18px;font-weight:600;color:var(--text);margin-bottom:12px;padding:0 8px;word-break:break-word}.countdown{font-size:14px;color:var(--text-muted);font-variant-numeric:tabular-nums}.history-list{list-style:none;margin:0;padding:0}.history-item{padding:14px 16px;background:var(--bg-elevated);border-radius:12px;margin-bottom:8px;border:1px solid rgba(255,255,255,.06)}.history-item:last-child{margin-bottom:0}.history-date{font-size:12px;color:var(--text-muted);margin-bottom:4px}.history-text{font-size:15px;color:var(--text)}.history-empty{text-align:center;color:var(--text-muted);font-size:15px;margin:24px 0 0;padding:0 16px}.history-empty.hidden{display:none}@media (min-width: 480px){:root{--wheel-size: min(320px, 75vw)}.wheel-sector-inner{font-size:12px}.result-text{font-size:20px}.countdown{font-size:16px}}
