:root{--bg-primary: #05070f;--bg-radial: radial-gradient(circle at center, #12132d 0%, #060712 75%, #020308 100%);--bg-surface: rgba(10, 14, 30, .7);--border-color: rgba(255, 255, 255, .08);--text-primary: #f8fafc;--text-secondary: #94a3b8;--text-muted: #64748b;--ring-red: #ff3b5c;--ring-blue: #00d2ff;--ring-yellow: #ffb703;--ring-green: #06d6a0;--color-success: #10b981;--color-error: #ef4444;--color-warning: #f59e0b;--font-display: "Space Grotesk", sans-serif;--font-body: "Outfit", sans-serif;--max-width: 550px}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}body{background:var(--bg-radial);color:var(--text-primary);font-family:var(--font-body);min-height:100svh;display:flex;justify-content:center;overflow-x:hidden}.app-container{width:100%;max-width:var(--max-width);min-height:100svh;display:flex;flex-direction:column;padding:1rem 1.5rem;position:relative}.glassmorphism{background:linear-gradient(135deg,#ffffff0a,#ffffff03),var(--bg-surface);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 1px #ffffff1a,0 20px 40px #0009}.game-header{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0 1.5rem;border-bottom:1px solid var(--border-color)}.brand{display:flex;align-items:center;gap:.5rem}.logo-icon{width:28px;height:28px;color:var(--ring-blue);animation:spin-loop 8s linear infinite}@keyframes spin-loop{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.brand h1{font-family:var(--font-display);font-size:1.6rem;font-weight:700;letter-spacing:.05em;background:linear-gradient(90deg,#ffffff,var(--text-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.icon-btn{background:transparent;border:1px solid var(--border-color);color:var(--text-secondary);width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}.icon-btn:hover{background:#ffffff0d;color:#fff;border-color:#fff3}.icon-btn:active{transform:scale(.93)}.icon-btn svg{width:20px;height:20px}.game-main{flex-grow:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1.5rem}.status-banner{display:flex;justify-content:space-between;width:100%;font-size:.9rem;font-weight:600;padding:0 .25rem}.date-label{color:var(--text-secondary)}.completion-ratio{color:var(--ring-green);text-transform:uppercase;letter-spacing:.05em}.board-wrapper{width:100%;aspect-ratio:1/1;display:flex;justify-content:center;align-items:center;position:relative;max-width:450px}#game-svg{filter:drop-shadow(0 15px 30px rgba(0,0,0,.6))}.ring{fill:#06081440;stroke-width:6.5px;transition:all .3s cubic-bezier(.4,0,.2,1);stroke-dasharray:600;stroke-dashoffset:0}.ring-red{stroke:var(--ring-red)}.ring-blue{stroke:var(--ring-blue)}.ring-yellow{stroke:var(--ring-yellow)}.ring-green{stroke:var(--ring-green)}.ring.dimmed,.cat-label-fo.dimmed{opacity:.15}.ring,.cat-label-fo{transition:opacity .35s ease,stroke-width .35s ease}.ring:hover{stroke-width:8.5px}.cat-label-fo{overflow:visible;pointer-events:none}.svg-cat-label{display:flex;align-items:center;justify-content:center;text-align:center;height:100%;font-family:var(--font-display);font-size:11.5px;font-weight:700;color:#fff;text-transform:uppercase;line-height:1.25;letter-spacing:.04em;padding:2px 4px;border-radius:6px;background:#05070fd9;box-shadow:0 4px 10px #00000080;border:1px solid rgba(255,255,255,.05)}.svg-cat-label.red{border-color:#ff3b5c4d}.svg-cat-label.blue{border-color:#00d2ff4d}.svg-cat-label.yellow{border-color:#ffb7034d}.svg-cat-label.green{border-color:#06d6a04d}.overlap-target{cursor:pointer;transition:transform .25s cubic-bezier(.34,1.56,.64,1);transform-box:fill-box;transform-origin:center}.target-bg{fill:#111425;stroke:#ffffff1f;stroke-width:2px;transition:all .25s ease;filter:drop-shadow(0 6px 12px rgba(0,0,0,.45))}.target-icon{stroke:var(--text-secondary);stroke-width:3px;stroke-linecap:round;transition:all .25s ease;pointer-events:none}.overlap-target.solved .target-bg{stroke:#fff;stroke-width:2.2px}#target-0.solved .target-bg{fill:url(#grad-0);filter:drop-shadow(0 0 12px rgba(255,59,92,.4))}#target-1.solved .target-bg{fill:url(#grad-1);filter:drop-shadow(0 0 12px rgba(0,210,255,.4))}#target-2.solved .target-bg{fill:url(#grad-2);filter:drop-shadow(0 0 12px rgba(255,183,3,.4))}#target-3.solved .target-bg{fill:url(#grad-3);filter:drop-shadow(0 0 12px rgba(6,214,160,.4))}.overlap-target.solved .target-icon{display:none}.solved-word-text{display:none;font-family:var(--font-display);font-size:11px;font-weight:700;fill:#fff;text-anchor:middle;pointer-events:none;-webkit-user-select:none;user-select:none;text-transform:uppercase;letter-spacing:.02em;paint-order:stroke fill;stroke:#0009;stroke-width:3px;stroke-linejoin:round}.overlap-target.solved .solved-word-text{display:block}.overlap-target:hover{transform:scale(1.13)}.overlap-target:hover .target-bg{stroke:#fff;fill:#1e223c}.overlap-target:hover .target-icon{stroke:#fff}.overlap-target:active{transform:scale(.94)}.modal{position:fixed;top:0;left:0;width:100vw;height:100svh;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s ease;z-index:100}.modal.active{opacity:1;pointer-events:auto}.modal-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background:#02040cbf;backdrop-filter:blur(0px);-webkit-backdrop-filter:blur(0px);transition:backdrop-filter .3s ease}.modal.active .modal-backdrop{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.modal-content{position:relative;width:90%;max-width:440px;border-radius:20px;padding:2.2rem 1.6rem;z-index:101;transform:scale(.9) translateY(20px);transition:transform .3s cubic-bezier(.34,1.56,.64,1);text-align:center}.modal.active .modal-content{transform:scale(1) translateY(0)}.close-btn{position:absolute;top:15px;right:15px;background:transparent;border:none;font-size:1.8rem;color:var(--text-muted);cursor:pointer;transition:color .2s ease,transform .15s ease;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%}.close-btn:hover{color:#fff;background:#ffffff0d}.close-btn:active{transform:scale(.9)}.modal-title{font-family:var(--font-display);font-size:1.4rem;font-weight:700;margin-bottom:1.5rem;letter-spacing:.02em}.categories-display{display:flex;justify-content:center;align-items:center;gap:.6rem;margin-bottom:2rem}.category-pill{padding:.5rem 1rem;border-radius:99px;font-size:.82rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.25);box-shadow:0 4px 10px #0000004d}.category-pill.cat-0{background:var(--ring-red)}.category-pill.cat-1{background:var(--ring-blue)}.category-pill.cat-2{background:var(--ring-yellow);color:#000;text-shadow:none}.category-pill.cat-3{background:var(--ring-green)}.and-symbol{font-family:var(--font-display);font-weight:700;color:var(--text-muted)}.input-container{position:relative;margin-bottom:1.5rem}#guess-input{width:100%;background:#ffffff08;border:1px solid var(--border-color);border-radius:12px;padding:1rem;font-family:var(--font-body);font-size:1.1rem;font-weight:600;color:#fff;text-align:center;text-transform:uppercase;letter-spacing:.05em;outline:none;transition:all .3s ease}#guess-input:focus{background:#ffffff12;border-color:#ffffff4d;box-shadow:0 0 15px #ffffff0d}.submit-btn{background:linear-gradient(135deg,var(--ring-blue) 0%,#007aff 100%);color:#fff;border:none;border-radius:12px;padding:1rem 2rem;width:100%;font-family:var(--font-display);font-size:1rem;font-weight:700;cursor:pointer;letter-spacing:.05em;transition:all .2s ease;box-shadow:0 4px 12px #00d2ff40}.submit-btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px #00d2ff66}.submit-btn:active{transform:scale(.96)}.help-scroll-content{text-align:left;display:flex;flex-direction:column;gap:1.2rem;font-size:.95rem;line-height:1.55;color:var(--text-secondary)}.help-scroll-content strong{color:#fff}.rules-list{display:flex;flex-direction:column;gap:1rem}.rule-item{display:flex;gap:1rem;align-items:flex-start}.rule-num{width:24px;height:24px;background:#ffffff14;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;color:#fff;flex-shrink:0;font-size:.85rem}.example-box{background:#ffffff08;border-radius:12px;padding:1rem;border-left:3px solid var(--ring-blue)}.example-box h3{font-size:.9rem;font-weight:700;margin-bottom:.4rem;color:#fff}.badge{padding:.15rem .4rem;border-radius:4px;font-size:.75rem;font-weight:700;text-transform:uppercase}.badge-red{background:#ff3b5c26;color:var(--ring-red)}.badge-blue{background:#00d2ff26;color:var(--ring-blue)}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin-bottom:2rem}.stat-box{background:#ffffff08;border:1px solid var(--border-color);border-radius:12px;padding:.8rem .2rem}.stat-val{font-family:var(--font-display);font-size:1.6rem;font-weight:700;color:#fff}.stat-lbl{font-size:.75rem;color:var(--text-muted);text-transform:uppercase;margin-top:.2rem;font-weight:600}.share-section{background:#ffffff08;border-radius:16px;padding:1.5rem 1rem;display:flex;flex-direction:column;align-items:center;gap:.8rem}.share-section h3{font-size:1rem;color:#fff}.share-section p{font-size:.85rem;color:var(--text-muted)}.share-action-btn{background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:10px;padding:.8rem 1.8rem;font-family:var(--font-display);font-size:.95rem;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:.6rem;transition:all .2s ease;box-shadow:0 4px 12px #10b98140}.share-action-btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px #10b98166}.share-action-btn:active{transform:scale(.96)}.share-action-btn svg{width:16px;height:16px}.toast-container{position:fixed;bottom:30px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:.5rem;z-index:105;pointer-events:none}.toast{background:#0f172af2;color:#fff;border:1px solid var(--border-color);padding:.8rem 1.5rem;border-radius:50px;font-size:.9rem;font-weight:600;box-shadow:0 10px 25px #00000080;animation:toast-fade-in .3s cubic-bezier(.175,.885,.32,1.275),toast-fade-out .3s ease 2.7s forwards;white-space:nowrap}.toast.success{border-color:var(--color-success);color:var(--color-success)}.toast.error{border-color:var(--color-error);color:var(--color-error)}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}.shake{animation:shake .5s ease;border-color:var(--color-error)!important;box-shadow:0 0 10px #ef444433!important}@keyframes toast-fade-in{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@keyframes toast-fade-out{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-15px)}}@media (max-width: 400px){.app-container{padding:.8rem 1rem}.brand h1{font-size:1.3rem}.board-wrapper{max-width:320px}.svg-cat-label{font-size:9.5px}.target-bg{r:26px}.solved-word-text{font-size:9.5px}}.overlap-target,.overlap-target:focus,.overlap-target:focus-visible,.overlap-target:active{outline:none!important}.help-scroll-content::-webkit-scrollbar{width:6px}.help-scroll-content::-webkit-scrollbar-track{background:transparent}.help-scroll-content::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:99px;transition:background .2s ease}.help-scroll-content::-webkit-scrollbar-thumb:hover{background:#ffffff40}