[data-game=word-snake]{--game-accent-h: 145;--game-accent-s: 80%;--game-accent-l: 42%;--game-accent: hsl(var(--game-accent-h), var(--game-accent-s), var(--game-accent-l));--game-accent-glow: hsla(var(--game-accent-h), var(--game-accent-s), var(--game-accent-l), .35);--game-accent-subtle: hsla(var(--game-accent-h), var(--game-accent-s), var(--game-accent-l), .12);--game-accent-hover: hsl(var(--game-accent-h), var(--game-accent-s), calc(var(--game-accent-l) + 6%));--obsidian-dark: #0a0b10;--obsidian-card: linear-gradient(135deg, #161720 0%, #0c0d13 100%);--steel-border: rgba(148, 163, 184, .18);--steel-border-hover: rgba(148, 163, 184, .4);--steel-glow: rgba(148, 163, 184, .08);--glass-bg: rgba(255, 255, 255, .02);--glass-active-bg: rgba(21, 193, 102, .15);--glass-border: rgba(255, 255, 255, .08)}.word-snake-main{flex:1;display:flex;flex-direction:column;align-items:center;padding:calc(var(--space-16) + var(--space-4)) var(--space-4) var(--space-8);gap:var(--space-5);max-width:960px;margin:0 auto;width:100%}.word-snake-layout{display:grid;grid-template-columns:1.3fr 1fr;gap:var(--space-6);width:100%;align-items:start}.word-snake-board-column{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);width:100%}.word-snake-sidebar-column{width:100%}.word-snake-lobby{width:100%;max-width:540px;background:var(--color-surface-raised);border:1px solid var(--color-border-subtle);border-radius:var(--radius-2xl);padding:var(--space-8);display:flex;flex-direction:column;align-items:center;gap:var(--space-6);text-align:center;margin:0 auto;box-shadow:0 12px 40px #0000004d}.word-snake-lobby__icon{font-size:64px;line-height:1;filter:drop-shadow(0 0 16px var(--game-accent-glow));animation:snake-float 3s ease-in-out infinite alternate}@keyframes snake-float{0%{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(3deg)}to{transform:translateY(0) rotate(0)}}.word-snake-lobby__title{font-family:var(--font-display);font-size:var(--text-4xl);font-weight:900;letter-spacing:-.03em;color:var(--color-text-primary);margin:0}.word-snake-lobby__desc{color:var(--color-text-secondary);font-size:var(--text-base);max-width:36ch;line-height:1.6;margin:0}.word-snake-rules{background:var(--obsidian-card);border:1px solid var(--steel-border);border-radius:var(--radius-xl);padding:var(--space-5);text-align:left;width:100%;display:flex;flex-direction:column;gap:var(--space-3);box-shadow:inset 0 1px 1px #ffffff08}.word-snake-rules__title{font-family:var(--font-display);font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--game-accent);margin:0}.word-snake-rules__list{margin:0;padding-left:var(--space-4);color:var(--color-text-secondary);font-size:var(--text-sm);line-height:1.6;display:flex;flex-direction:column;gap:var(--space-2)}.word-snake-rules__list li::marker{color:var(--game-accent)}.word-snake-how-to{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);width:100%;margin-top:var(--space-2)}.word-snake-preview-grid{display:grid;grid-template-columns:repeat(3,42px);gap:var(--space-2);position:relative}.word-snake-preview-cell{width:42px;height:42px;border-radius:var(--radius-md);border:1px solid var(--steel-border);background:var(--obsidian-card);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:var(--text-sm);font-weight:800;color:var(--color-text-secondary);-webkit-user-select:none;user-select:none;position:relative}.word-snake-preview-cell.selected{background:var(--glass-active-bg);border-color:var(--game-accent);color:#fff;text-shadow:0 0 6px var(--game-accent);box-shadow:0 0 10px var(--game-accent-glow)}.word-snake-preview-line{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;stroke:var(--game-accent);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;opacity:.8}.word-snake-timer-container{width:100%;display:flex;flex-direction:column;gap:var(--space-2)}.word-snake-timer-header{display:flex;justify-content:space-between;align-items:center;font-size:var(--text-xs);color:var(--color-text-tertiary);font-weight:600;text-transform:uppercase;letter-spacing:.08em}.word-snake-timer-value{font-family:var(--font-mono);font-size:var(--text-sm);font-weight:700;color:var(--color-text-secondary)}.word-snake-timer-value.urgent{color:var(--color-status-error);animation:timer-shake .4s ease infinite}@keyframes timer-shake{0%,to{transform:scale(1)}50%{transform:scale(1.08) rotate(1deg)}}.word-snake-progress-track{width:100%;height:8px;background:var(--color-surface-overlay);border-radius:var(--radius-full);overflow:hidden;border:1px solid var(--color-border-subtle);position:relative}.word-snake-progress-bar{height:100%;width:100%;background:linear-gradient(90deg,var(--game-accent) 0%,var(--game-accent-hover) 100%);border-radius:var(--radius-full);transition:width 1s linear,background .3s ease}.word-snake-progress-bar.urgent{background:var(--color-status-error);box-shadow:0 0 8px #ef444466}.word-snake-timer-gauge{position:relative;width:56px;height:56px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.word-snake-timer-gauge-circle{transform:rotate(-90deg);transform-origin:50% 50%}.word-snake-timer-gauge-bg{fill:none;stroke:var(--color-surface-overlay);stroke-width:5}.word-snake-timer-gauge-fill{fill:none;stroke:var(--game-accent);stroke-width:5;stroke-dasharray:151;stroke-dashoffset:0;stroke-linecap:round;transition:stroke-dashoffset 1s linear,stroke .3s ease}.word-snake-timer-gauge-fill.urgent{stroke:var(--color-status-error)}.word-snake-timer-gauge-text{position:absolute;font-family:var(--font-mono);font-size:var(--text-xs);font-weight:700;color:var(--color-text-primary)}.word-snake-timer-gauge-text.urgent{color:var(--color-status-error)}.word-snake-board-wrapper{position:relative;width:100%;max-width:460px;aspect-ratio:1;background:var(--obsidian-dark);border:2px solid var(--steel-border);border-radius:var(--radius-2xl);padding:var(--space-3);box-sizing:border-box;box-shadow:0 20px 40px #00000073,inset 0 1px 1px #ffffff0a;touch-action:none;-webkit-user-select:none;user-select:none;container-type:inline-size;container-name:board-container}.word-snake-grid{display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(6,1fr);gap:var(--space-2);width:100%;height:100%;position:relative;z-index:2}.word-snake-tile{background:var(--obsidian-card);border:1.5px solid var(--steel-border);border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:clamp(1.2rem,7cqi,1.85rem);font-weight:800;color:var(--color-text-primary);text-shadow:0 2px 4px rgba(0,0,0,.4);cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;transition:transform var(--duration-fast) var(--ease-out),border-color var(--duration-fast) ease,background var(--duration-fast) ease,box-shadow var(--duration-fast) ease;position:relative;overflow:hidden;box-shadow:inset 0 1px 1px #ffffff08,0 3px 6px #00000040}.word-snake-tile:hover:not(.disabled):not(.selected):not(.completed){border-color:var(--steel-border-hover);transform:translateY(-1.5px);box-shadow:inset 0 1px 1px #ffffff0d,0 5px 10px #0000004d,0 0 6px var(--steel-glow)}.word-snake-tile.selected{background:var(--glass-active-bg);border-color:var(--game-accent);color:#fff;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);text-shadow:0 0 8px var(--game-accent);box-shadow:0 0 16px var(--game-accent-glow),inset 0 1px 1.5px #ffffff26;transform:scale(1.05);z-index:10;animation:pulse-selected 1.5s infinite alternate}@keyframes pulse-selected{0%{box-shadow:0 0 12px var(--game-accent-glow),inset 0 1px 1px #ffffff1a}to{box-shadow:0 0 20px var(--game-accent),inset 0 1px 1px #fff3}}.word-snake-tile.valid-next{border-color:var(--game-accent);box-shadow:0 0 10px var(--game-accent-subtle);animation:border-breathe 1.5s infinite alternate}@keyframes border-breathe{0%{border-color:var(--steel-border-hover)}to{border-color:var(--game-accent)}}.word-snake-tile.completed{background:#10b9810a;border-color:#10b98133;color:var(--color-text-secondary);opacity:.75;cursor:default}.word-snake-tile.disabled{opacity:.35;cursor:not-allowed}.word-snake-board-wrapper.dragging .word-snake-tile{cursor:grabbing}.word-snake-svg-overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1}.word-snake-connection-line{fill:none;stroke:var(--game-accent);stroke-width:6;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 8px var(--game-accent-glow));opacity:.82;transition:stroke var(--duration-fast) ease}.word-snake-word-preview{height:48px;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:var(--text-2xl);font-weight:900;color:var(--game-accent);letter-spacing:.12em;text-transform:uppercase;text-shadow:0 0 12px var(--game-accent-glow);min-width:140px}.word-snake-word-preview.invalid{color:var(--color-status-error);text-shadow:0 0 12px rgba(239,68,68,.4);animation:preview-shake .3s ease}.word-snake-word-preview.valid{color:var(--color-status-success);text-shadow:0 0 12px rgba(16,185,129,.4);animation:preview-success-pop .3s ease}@keyframes preview-shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}@keyframes preview-success-pop{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.word-snake-sidebar{background:var(--color-surface-raised);border:1px solid var(--color-border-subtle);border-radius:var(--radius-2xl);padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-4);height:100%;min-height:440px;max-height:480px;box-shadow:0 8px 24px #0003}.word-snake-sidebar-title{font-family:var(--font-display);font-size:var(--text-sm);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-secondary);display:flex;justify-content:space-between;align-items:center;margin:0;padding-bottom:var(--space-2);border-bottom:1px solid var(--color-border-subtle)}.word-snake-found-count{font-size:var(--text-xs);color:var(--game-accent);background:var(--game-accent-subtle);padding:2px var(--space-2-5);border-radius:var(--radius-full);font-weight:800}.word-snake-words-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:var(--space-2);padding-right:var(--space-1)}.word-snake-words-list::-webkit-scrollbar{width:5px}.word-snake-words-list::-webkit-scrollbar-track{background:#0000001a;border-radius:var(--radius-full)}.word-snake-words-list::-webkit-scrollbar-thumb{background:var(--steel-border);border-radius:var(--radius-full)}.word-snake-words-list::-webkit-scrollbar-thumb:hover{background:var(--game-accent)}.word-snake-word-item{display:flex;align-items:center;justify-content:space-between;background:var(--obsidian-card);border:1px solid var(--steel-border);border-radius:var(--radius-lg);padding:var(--space-2-5) var(--space-4);font-family:var(--font-display);font-size:var(--text-sm);font-weight:700;color:var(--color-text-primary);letter-spacing:.04em;animation:item-slide-up var(--duration-normal) var(--ease-spring)}.word-snake-word-badge{background:var(--game-accent);color:#fff;font-family:var(--font-mono);font-size:var(--text-xs);font-weight:800;padding:1px var(--space-2);border-radius:var(--radius-badge);box-shadow:0 2px 4px var(--game-accent-glow)}@keyframes item-slide-up{0%{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}.word-snake-list-empty{flex:1;display:flex;align-items:center;justify-content:center;color:var(--color-text-tertiary);font-size:var(--text-sm);font-style:italic;text-align:center;padding:var(--space-8)}.word-snake-gameover{background:var(--color-surface-raised);border:1px solid var(--color-border-subtle);border-radius:var(--radius-2xl);padding:var(--space-8);width:min(460px,100%);display:flex;flex-direction:column;align-items:center;gap:var(--space-6);text-align:center;animation:modal-rise var(--duration-slow) var(--ease-spring);margin:0 auto;box-shadow:0 20px 48px #00000073}@keyframes modal-rise{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.word-snake-gameover__title{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:900;letter-spacing:-.02em;color:var(--color-text-primary);margin:0}.word-snake-gameover__stats{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-4);width:100%;background:var(--obsidian-card);border:1px solid var(--steel-border);border-radius:var(--radius-xl);padding:var(--space-4)}.word-snake-stat{display:flex;flex-direction:column;align-items:center;gap:var(--space-1)}.word-snake-stat__val{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:900;color:var(--game-accent)}.word-snake-stat__label{font-size:var(--text-xs);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.06em;font-weight:600}.word-snake-gameover__words-header{font-size:var(--text-xs);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.06em;font-weight:700;align-self:flex-start;margin:0}.word-snake-gameover__words{width:100%;max-height:120px;overflow-y:auto;display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-2);padding-right:var(--space-1)}.word-snake-gameover__word{font-family:var(--font-display);font-size:var(--text-xs);font-weight:700;padding:var(--space-1) var(--space-3);border-radius:var(--radius-badge);background:var(--color-surface-overlay);border:1px solid var(--color-border-subtle);color:var(--color-text-secondary)}.word-snake-gameover__word.high-scoring{border-color:var(--game-accent);color:var(--game-accent);background:var(--game-accent-subtle)}.word-snake-gameover__actions{display:flex;gap:var(--space-3);flex-wrap:wrap;justify-content:center;width:100%}.word-snake-gameover__actions .btn{flex:1;min-width:140px}.word-snake-toast{position:absolute;bottom:var(--space-4);left:50%;transform:translate(-50%) translateY(20px);background:#0a0b10f2;border:1px solid var(--game-accent);color:var(--game-accent);padding:var(--space-2-5) var(--space-5);border-radius:var(--radius-full);font-family:var(--font-display);font-size:var(--text-sm);font-weight:700;box-shadow:0 8px 24px #00000080,0 0 8px var(--game-accent-glow);opacity:0;pointer-events:none;transition:transform var(--duration-normal) var(--ease-spring),opacity var(--duration-normal) ease;z-index:100}.word-snake-toast.show{transform:translate(-50%) translateY(0);opacity:1}@media (max-width: 768px){.word-snake-main{padding:calc(var(--space-16) + var(--space-2)) var(--space-4) var(--space-6);gap:var(--space-4)}.word-snake-layout{grid-template-columns:1fr;gap:var(--space-5)}.word-snake-sidebar{min-height:auto;max-height:220px}}@media (max-width: 480px){.word-snake-board-wrapper{padding:var(--space-2)}.word-snake-grid{gap:4px}.word-snake-lobby{padding:var(--space-6) var(--space-4);gap:var(--space-5)}.word-snake-lobby__title{font-size:var(--text-2xl)}.word-snake-rules{padding:var(--space-4)}.word-snake-rules__list{font-size:var(--text-xs)}.word-snake-gameover{padding:var(--space-6) var(--space-4)}.word-snake-gameover__title{font-size:var(--text-2xl)}}@container board-container (max-width: 360px){.word-snake-tile{border-radius:var(--radius-md);border-width:1px}.word-snake-grid{gap:3px}}@media (prefers-reduced-motion: reduce){.word-snake-tile,.word-snake-progress-bar,.word-snake-timer-gauge-fill,.word-snake-word-item,.word-snake-lobby__icon{transition:none!important;animation:none!important}}