:root{--color-bg: #0f1117;--color-surface: #1c1e2a;--color-text: #e4e4e7;--color-text-secondary: #9ca3af;--color-border: #2e3040;--color-primary: #818cf8;--color-primary-hover: #a5b4fc;--color-success: #4ade80;--color-success-bg: rgba(74, 222, 128, .1);--color-fail: #f87171;--color-fail-bg: rgba(248, 113, 113, .1);--color-wrong: #4b5563;--color-hint: rgba(251, 191, 36, .12);--color-hint-border: #d97706;--radius: 8px;--radius-lg: 12px;--shadow: 0 1px 3px rgba(0, 0, 0, .3);--shadow-lg: 0 4px 12px rgba(0, 0, 0, .4);--font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}[data-theme=light]{--color-bg: #fafafa;--color-surface: #ffffff;--color-text: #1a1a2e;--color-text-secondary: #6b7280;--color-border: #e5e7eb;--color-primary: #4f46e5;--color-primary-hover: #4338ca;--color-success: #16a34a;--color-success-bg: #f0fdf4;--color-fail: #dc2626;--color-fail-bg: #fef2f2;--color-wrong: #9ca3af;--color-hint: #fef3c7;--color-hint-border: #f59e0b;--shadow: 0 1px 3px rgba(0, 0, 0, .1);--shadow-lg: 0 4px 12px rgba(0, 0, 0, .1)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font);background:var(--color-bg);color:var(--color-text);min-height:100vh;display:flex;justify-content:center;transition:background .2s ease,color .2s ease}#app{width:100%;max-width:540px;padding:16px}.game-wrapper{display:flex;flex-direction:column;gap:24px}.toolbar{display:flex;align-items:center;gap:8px;padding:4px 0}.toolbar-left{margin-right:auto;display:flex;align-items:center}.toolbar-right{display:flex;align-items:center;gap:6px}.toolbar-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;transition:all .15s ease;line-height:1}.toolbar-btn:hover{border-color:var(--color-primary);color:var(--color-primary)}.toolbar-streak{display:flex;align-items:center;gap:3px;padding:0 8px;font-weight:600;font-size:14px;color:var(--color-text)}.toolbar-streak-icon{font-size:16px;line-height:1}.toolbar-streak-count{font-variant-numeric:tabular-nums}.back-to-today{font-size:13px;color:var(--color-primary);background:none;border:none;cursor:pointer;font-family:var(--font);font-weight:500;padding:6px 10px;border-radius:var(--radius);transition:background .15s}.back-to-today:hover{background:#818cf81a}.mode-switcher{display:flex;gap:4px;justify-content:center;margin-bottom:8px}.mode-btn{flex:1;max-width:140px;padding:6px 16px;border-radius:20px;border:1px solid var(--color-border);background:none;color:var(--color-text-secondary);cursor:pointer;font-size:13px;font-weight:500;font-family:var(--font);transition:all .15s ease}.mode-btn:hover{background:var(--color-bg);color:var(--color-text)}.mode-btn--active{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.mode-btn--active:hover{background:var(--color-primary);color:#fff}.day-stats{text-align:center;font-size:13px;color:var(--color-text-secondary);padding:8px 0;font-style:italic}.game-header{text-align:center;padding:8px 0}.game-title{font-size:28px;font-weight:700;letter-spacing:-.5px}.game-subtitle{font-size:14px;color:var(--color-text-secondary);margin-top:4px}.game-subtitle--archive{color:var(--color-hint-border)}.guess-info{font-size:13px;color:var(--color-primary);font-weight:500;margin-top:8px}.ranking-section{display:flex;flex-direction:column;gap:12px}.ranking-label{font-size:14px;color:var(--color-text-secondary);text-align:center}.ranking-list{display:flex;flex-direction:column;gap:6px}.ranking-row{display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);transition:all .2s ease}.ranking-row--hint{background:var(--color-hint);border-color:var(--color-hint-border);animation:slideIn .3s ease}@keyframes slideIn{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}.ranking-rank{font-weight:700;font-size:14px;color:var(--color-primary);min-width:28px}.ranking-flag{font-size:22px;line-height:1;display:flex;align-items:center}.flag-img{border-radius:2px;display:block}.brand-img{border-radius:2px;display:block;object-fit:contain}.poster-img{border-radius:2px;display:block;object-fit:cover}.ranking-row--movie-box{position:relative;overflow:hidden}.ranking-row--movie-box:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:var(--poster-bg);background-size:200%;background-position:center;opacity:.75;z-index:0}.ranking-row--movie-box>*{position:relative;z-index:1}.ranking-row--movie-box .ranking-rank,.ranking-row--movie-box .ranking-name,.ranking-row--movie-box .ranking-value{padding:2px 6px;border-radius:3px}.ranking-row--movie-box .ranking-rank,.ranking-row--movie-box .ranking-name,.ranking-row--movie-box .ranking-value{background-color:#0000004d}[data-theme=light] .ranking-row--movie-box .ranking-rank,[data-theme=light] .ranking-row--movie-box .ranking-name,[data-theme=light] .ranking-row--movie-box .ranking-value{background-color:#ffffff4d}.ranking-name{font-weight:500;font-size:15px;flex:1}.ranking-value{font-size:13px;color:var(--color-text-secondary);font-weight:500;font-variant-numeric:tabular-nums}.options-section{display:flex;flex-direction:column;gap:12px}.options-label{font-size:15px;font-weight:600;text-align:center}.options-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.option-btn{padding:10px 12px;border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-surface);color:var(--color-text);font-family:var(--font);font-size:13px;font-weight:500;cursor:pointer;transition:all .15s ease;text-align:center;box-shadow:var(--shadow)}.option-btn:hover:not(:disabled){border-color:var(--color-primary);color:var(--color-primary);box-shadow:var(--shadow-lg)}.option-btn:active:not(:disabled){transform:scale(.98)}.option-btn--wrong{background:var(--color-bg);color:var(--color-wrong);border-color:var(--color-wrong);text-decoration:line-through;cursor:default;box-shadow:none}.option-wrapper{position:relative;display:flex}.option-wrapper .option-btn{flex:1}.metric-tooltip{display:none;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:6px 10px;font-size:12px;color:var(--color-text-secondary);white-space:normal;width:max-content;max-width:220px;text-align:center;box-shadow:var(--shadow-lg);z-index:10;pointer-events:none}.metric-tooltip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:5px solid transparent;border-top-color:var(--color-border)}.option-wrapper--has-tooltip:hover .metric-tooltip{display:block}.result-section{animation:fadeIn .4s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.result-banner{padding:16px;border-radius:var(--radius-lg);text-align:center}.result-banner--success{background:var(--color-success-bg);border:1px solid var(--color-success)}.result-banner--fail{background:var(--color-fail-bg);border:1px solid var(--color-fail)}.result-title{font-size:20px;font-weight:700}.result-banner--success .result-title{color:var(--color-success)}.result-banner--fail .result-title{color:var(--color-fail)}.result-detail{font-size:14px;color:var(--color-text-secondary);margin-top:4px}.stats-section{display:flex;flex-direction:column;gap:16px;animation:fadeIn .4s ease .1s both}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.stat-item{text-align:center;padding:8px;background:var(--color-surface);border-radius:var(--radius);border:1px solid var(--color-border)}.stat-value{font-size:22px;font-weight:700}.stat-label{font-size:11px;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-top:2px}.distribution-section{display:flex;flex-direction:column;gap:6px}.distribution-title{font-size:14px;font-weight:600;margin-bottom:4px}.distribution-row{display:flex;align-items:center;gap:8px}.distribution-label{font-size:13px;font-weight:600;min-width:28px;text-align:right}.distribution-bar-container{flex:1}.distribution-bar{background:var(--color-border);color:var(--color-text);font-size:12px;font-weight:600;padding:2px 8px;border-radius:4px;min-width:fit-content;text-align:right;transition:width .3s ease}.distribution-bar--current{background:var(--color-primary);color:#fff}.share-section{text-align:center;animation:fadeIn .4s ease .2s both}.share-btn{padding:12px 32px;background:var(--color-primary);color:#fff;border:none;border-radius:var(--radius);font-family:var(--font);font-size:15px;font-weight:600;cursor:pointer;transition:all .15s ease}.share-btn:hover{background:var(--color-primary-hover)}.share-btn:active{transform:scale(.98)}.archive-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;justify-content:center;align-items:center;z-index:100;animation:fadeIn .15s ease}.archive-modal{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);width:90%;max-width:380px;max-height:85vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 16px 48px #0000004d}.archive-modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid var(--color-border)}.archive-modal-title{font-weight:700;font-size:18px}.archive-close{width:32px;height:32px;border-radius:50%;border:none;background:transparent;color:var(--color-text-secondary);cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;font-family:var(--font)}.archive-close:hover{background:var(--color-bg);color:var(--color-text)}.archive-body{padding:12px 16px 16px;overflow-y:auto;flex:1}.archive-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.archive-nav-btn{width:32px;height:32px;border-radius:50%;border:1px solid var(--color-border);background:none;color:var(--color-text);cursor:pointer;font-size:20px;line-height:1;display:flex;align-items:center;justify-content:center;font-family:var(--font)}.archive-nav-btn:hover:not(:disabled){background:var(--color-bg)}.archive-nav-btn--disabled{opacity:.3;cursor:default}.archive-nav-label{font-weight:600;font-size:15px}.archive-cal-header{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:4px}.archive-cal-day-header{text-align:center;font-size:11px;font-weight:600;color:var(--color-text-secondary);padding:4px 0}.archive-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.archive-cal-cell{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:var(--radius);font-size:13px;position:relative;min-height:40px}.archive-cal-cell--empty{background:none}.archive-cal-cell--disabled{opacity:.25}.archive-cal-cell--playable{cursor:pointer;transition:background .15s ease}.archive-cal-cell--playable:hover{background:var(--color-bg)}.archive-cal-cell--current{background:#818cf81f;outline:2px solid var(--color-primary);outline-offset:-2px}.archive-cal-day{font-weight:600;font-size:13px;line-height:1}.archive-cal-score{font-size:9px;line-height:1;margin-top:2px}.archive-cal-score--solved{color:var(--color-success)}.archive-cal-score--failed{color:var(--color-fail);font-weight:700}.archive-cal-score--unplayed{color:var(--color-text-secondary);opacity:.5}.howtoplay-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;justify-content:center;align-items:center;z-index:100;animation:fadeIn .15s ease}.howtoplay-modal{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);width:90%;max-width:420px;max-height:75vh;display:flex;flex-direction:column;box-shadow:0 16px 48px #0000004d}.howtoplay-modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px 16px 12px;border-bottom:1px solid var(--color-border)}.howtoplay-modal-title{font-weight:700;font-size:18px}.howtoplay-close{width:32px;height:32px;border-radius:50%;border:none;background:transparent;color:var(--color-text-secondary);cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;font-family:var(--font)}.howtoplay-close:hover{background:var(--color-bg);color:var(--color-text)}.howtoplay-body{overflow-y:auto;padding:16px;flex:1;line-height:1.6;font-size:14px;color:var(--color-text-secondary)}.howtoplay-body p{margin:0 0 12px}.howtoplay-body h3{color:var(--color-text);font-size:15px;margin:16px 0 6px}.howtoplay-body ul{margin:0 0 12px;padding-left:20px}.howtoplay-body li{margin-bottom:4px}.howtoplay-body strong{color:var(--color-text)}.consent-banner{position:fixed;bottom:0;left:0;right:0;background:var(--color-surface);border-top:1px solid var(--color-border);padding:12px 16px;display:flex;align-items:center;justify-content:center;gap:16px;z-index:200;box-shadow:0 -4px 12px #0003;animation:slideUp .3s ease}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.consent-text{font-size:13px;color:var(--color-text-secondary);flex-shrink:1}.consent-link{color:var(--color-primary);text-decoration:none}.consent-link:hover{text-decoration:underline}.consent-actions{display:flex;gap:8px;flex-shrink:0}.consent-btn{padding:7px 16px;border-radius:var(--radius);font-family:var(--font);font-size:13px;font-weight:500;cursor:pointer;transition:all .15s ease;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text)}.consent-btn:hover{border-color:var(--color-primary);color:var(--color-primary)}.consent-btn--accept{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.consent-btn--accept:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover);color:#fff}.ad-container{min-height:50px;display:flex;align-items:center;justify-content:center}.ad-placeholder{width:100%;padding:16px;border:1px dashed var(--color-border);border-radius:var(--radius);text-align:center;font-size:12px;color:var(--color-wrong)}.ad-blocked-message{width:100%;padding:12px 16px;text-align:center;font-size:12px;color:var(--color-text-secondary);font-style:italic}.site-footer{display:flex;align-items:center;justify-content:center;gap:8px;padding:16px 0 8px;font-size:12px}.footer-link{color:var(--color-text-secondary);text-decoration:none;transition:color .15s}.footer-link:hover{color:var(--color-primary)}.footer-btn{background:none;border:none;cursor:pointer;font-family:var(--font);font-size:12px;padding:0}.footer-sep{color:var(--color-border)}.date-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;margin-bottom:12px;background:var(--color-hint);border:1px solid var(--color-hint-border);border-radius:var(--radius);color:var(--color-text);font-size:14px;line-height:1.4;animation:banner-fade-in .3s ease}.date-banner-dismiss{background:none;border:none;color:var(--color-text-secondary);font-size:20px;line-height:1;cursor:pointer;padding:0 4px;flex-shrink:0}.date-banner-dismiss:hover{color:var(--color-text)}@keyframes banner-fade-in{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}