:root{--primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--glass-bg: rgba(255, 255, 255, .1);--glass-border: rgba(255, 255, 255, .2);--glass-shadow: 0 8px 32px 0 rgba(31, 38, 135, .37);--text-primary: #ffffff;--text-secondary: #e2e8f0;--accent-color: #ffd700}*{margin:0;padding:0;box-sizing:border-box;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--primary-gradient);min-height:100vh;overflow:hidden;color:var(--text-primary)}.game-container{height:100vh;display:flex;flex-direction:column;align-items:center;padding:10px;gap:10px}.glass-header{width:100%;max-width:500px;background:var(--glass-bg);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--glass-border);border-radius:16px;padding:12px 20px;box-shadow:var(--glass-shadow);z-index:10}.header-content{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.header-right{display:flex;align-items:center;gap:8px}.glass-header h1{font-size:1.25rem;font-weight:800;background:linear-gradient(to right,#fff,gold);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.subtitle{font-size:.75rem;color:var(--text-secondary);opacity:.8}.history-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:4px 8px;border-radius:12px;font-size:.8rem;cursor:pointer;transition:background .2s}.history-btn:hover{background:#fff3}.score-pill{background:#0000004d;padding:4px 12px;border-radius:20px;display:flex;gap:8px;align-items:center}.score-label{font-size:.7rem;text-transform:uppercase;letter-spacing:1px;color:#bbb}.score-value{font-size:1.1rem;font-weight:700;color:var(--accent-color)}.game-area{flex:1;display:flex;align-items:center;justify-content:center;width:100%;position:relative}.game-canvas-wrapper{position:relative;background:#0003;border:2px solid rgba(255,255,255,.1);border-radius:12px;box-shadow:0 0 20px #0003;overflow:hidden;touch-action:none}.game-canvas{display:block;width:100%;height:100%}.guide-line{position:absolute;top:0;bottom:0;width:0;border-left:1px dashed rgba(255,255,255,.3);pointer-events:none;z-index:1}.current-ball{position:absolute;transform:translate(-50%);pointer-events:none;z-index:5;background:#fff;border-radius:50%;overflow:hidden;box-shadow:0 0 10px #0003}.ball-img,.preview-img{width:100%;height:100%;object-fit:cover;display:block}.next-preview{position:absolute;top:10px;right:10px;padding:8px 12px;display:flex;flex-direction:column;align-items:center;z-index:10;pointer-events:none}.glass-panel{background:var(--glass-bg);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--glass-border);border-radius:12px}.next-preview span{font-size:.6rem;margin-bottom:4px;color:#ddd}.preview-circle{width:36px;height:36px;background:#ffffff1a;border-radius:50%;padding:2px}.legend-panel{width:100%;max-width:500px;padding:10px;max-height:100px}.legend-scroll{display:flex;overflow-x:auto;gap:12px;padding-bottom:4px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.3) transparent}.legend-scroll::-webkit-scrollbar{height:4px}.legend-scroll::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:4px}.legend-item{display:flex;flex-direction:column;align-items:center;gap:4px;opacity:.6;transition:opacity .3s,transform .3s;min-width:40px}.legend-item.current-target{opacity:1;transform:scale(1.1)}.legend-icon{width:32px;height:32px;border-radius:50%;background:#fff;overflow:hidden;padding:2px}.legend-icon img{width:100%;height:100%;object-fit:cover;border-radius:50%}.legend-name{font-size:.6rem;white-space:nowrap}.drama-toast{position:absolute;top:15%;left:50%;transform:translate(-50%) scale(.9);z-index:20;opacity:0;pointer-events:none;transition:all .3s cubic-bezier(.175,.885,.32,1.275)}.drama-toast.show{opacity:1;transform:translate(-50%) scale(1)}.drama-content{background:#000000bf;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:10px 20px;border-radius:20px;border:1px solid rgba(255,215,0,.3);box-shadow:0 4px 15px #0000004d}.drama-text{color:gold;font-weight:700;font-size:1rem;text-align:center;white-space:nowrap;letter-spacing:1px}.overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#0009;z-index:50;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);animation:fadeIn .3s ease}.glass-overlay{background:#14141ed9}.overlay h2{font-size:2rem;margin-bottom:10px;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.5)}.overlay .message{color:#ccc;margin-bottom:20px}.final-score{font-size:1.5rem;color:var(--accent-color);margin-bottom:30px;font-weight:700}.overlay-btns{display:flex;gap:15px}.restart-btn{background:linear-gradient(45deg,#ff512f,#dd2476);border:none;padding:12px 32px;color:#fff;border-radius:30px;font-size:1.1rem;font-weight:700;cursor:pointer;box-shadow:0 4px 15px #dd247666;transition:transform .2s,box-shadow .2s}.restart-btn:active{transform:scale(.95)}.history-btn-large{background:#ffffff1a;border:1px solid rgba(255,255,255,.3);padding:12px 32px;color:#fff;border-radius:30px;font-size:1.1rem;font-weight:700;cursor:pointer}.win .restart-btn{background:linear-gradient(45deg,#1d976c,#93f9b9);color:#1a1a2e}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.history-overlay{z-index:60}.history-panel{width:85%;max-width:400px;max-height:70vh;padding:20px;display:flex;flex-direction:column;color:#fff}.history-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.1)}.close-btn{background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:0 5px}.history-list{flex:1;overflow-y:auto;margin-bottom:15px;scrollbar-width:thin}.history-item{display:flex;justify-content:space-between;align-items:center;padding:10px;background:#ffffff0d;border-radius:8px;margin-bottom:8px}.history-info{display:flex;flex-direction:column}.history-date{font-size:.75rem;color:#aaa}.user-score{font-size:1rem;font-weight:700;color:var(--accent-color)}.history-badge{display:flex;flex-direction:column;align-items:center;font-size:.7rem;color:#ccc;width:40px}.badge-img{width:30px;height:30px;border-radius:50%;object-fit:cover}.clear-history-btn{width:100%;padding:10px;background:#ff475733;border:1px solid rgba(255,71,87,.5);color:#ff4757;border-radius:8px;cursor:pointer;font-size:.9rem}.no-history{text-align:center;color:#aaa;padding:20px}