:root{--font-main:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-family:var(--font-main);color:var(--ink);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{min-width:320px;min-height:100svh;margin:0}#root{min-height:100svh}:root{--bg:#fafafa;--surface:#fff;--ink:#191919;--muted:#747474;--line:#e5e2dc;--hole:#f0eee8;--hole-stroke:#d8d2c7;--rules-bg:#f4f1e8;--purple:#7651d1;--salt-rainbow:linear-gradient(135deg, #7065f2 0%, #d94fa1 22%, #ec5b43 40%, #efcf58 58%, #55c77d 76%, #4d9ce8 100%);--shadow:0 14px 40px #14141414}.app{box-sizing:border-box;flex-direction:column;gap:14px;width:min(960px,100%);min-height:100svh;margin:0 auto;padding:18px;display:flex}.topbar{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:16px;width:100%;min-height:42px;display:grid}.topbar>div{align-items:center;display:flex}.brand{justify-self:start;align-items:center;gap:10px;display:flex}.brand-mark{flex:none;width:36px;height:41px;overflow:visible}.brand-mark polygon{fill:#4d9ce8;stroke:#19191938;stroke-linejoin:round;stroke-width:1.6px}.brand h1{margin:0;font-size:26px;font-weight:650;line-height:1}.actions{justify-self:end;align-items:center;gap:8px;display:flex}.topbar-timer{color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:0;justify-self:center;font-size:18px;font-weight:650;line-height:1}button{border:1px solid var(--line);background:var(--surface);min-height:38px;color:var(--ink);font:inherit;cursor:pointer;border-radius:7px;padding:0 13px;font-size:14px}button:hover:not(:disabled){border-color:#bbb4aa}button:focus-visible{outline-offset:3px;outline:3px solid #111}button:disabled{color:#b9b9b9;cursor:default}.board-wrap{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;border-radius:8px;padding:clamp(4px,.8vw,8px) clamp(6px,2vw,18px)}.board{-webkit-user-select:none;user-select:none;width:100%;height:auto;max-height:min(72svh,760px);display:block}.grid polygon{fill:var(--hole);stroke:var(--hole-stroke);stroke-width:2px}.marble{cursor:pointer;-webkit-user-select:none;user-select:none;outline:none}.marble polygon{stroke:#19191938;stroke-width:2px;filter:none;transition:transform .12s,opacity .12s,filter .18s,stroke-width .12s}.marble text{pointer-events:none;fill:#fffffff0;font-size:25px;font-weight:850;font-family:var(--font-main);-webkit-user-select:none;user-select:none}.marble:focus-visible .marble-face{stroke:#111;stroke-width:4px}.marble.is-locked{opacity:.22;filter:grayscale(.35)}.marble.is-free .marble-face{stroke:#19191975}.marble.is-selected .marble-face{stroke:#111;stroke-width:4px}.marble .match-pulse{fill:none;filter:drop-shadow(0 0 7px #ffffffb3)drop-shadow(0 0 14px #f6d05375);opacity:0;pointer-events:none;stroke:#fffffff5;stroke-linejoin:round;stroke-width:4px;transform-box:fill-box;transform-origin:50%;animation:1.35s ease-out infinite candidate-pulse}.marble.is-match-candidate .marble-face{filter:drop-shadow(0 0 7px #ffffff94)drop-shadow(0 0 15px #f6d05357);stroke:#ffffffeb;stroke-width:3.5px;animation:1.35s ease-in-out infinite candidate-face-glow}@keyframes candidate-pulse{0%{opacity:0;stroke-width:5px;transform:scale(1.2)}22%{opacity:.95}to{opacity:0;stroke-width:1.4px;transform:scale(.68)}}@keyframes candidate-face-glow{0%,to{filter:drop-shadow(0 0 5px #ffffff70)drop-shadow(0 0 11px #f6d0533d)}50%{filter:drop-shadow(0 0 10px #ffffffc7)drop-shadow(0 0 20px #f6d05370)}}@media (prefers-reduced-motion:reduce){.marble .match-pulse,.marble.is-match-candidate .marble-face{animation:none}.marble .match-pulse{opacity:.55;transform:scale(.92)}}.marble-quicksilver text,.marble-lead text,.marble-tin text,.marble-iron text,.marble-copper text,.marble-silver text,.marble-gold text{fill:#fff}.marble-salt polygon,.rule-hex.marble-salt{fill:url(#salt-rainbow);background:var(--salt-rainbow)}.marble-air polygon,.rule-hex.marble-air{fill:#f0ca4d;background:#f0ca4d}.marble-fire polygon,.rule-hex.marble-fire{fill:#e9593f;background:#e9593f}.marble-water polygon,.rule-hex.marble-water{fill:#4d9ce8;background:#4d9ce8}.marble-earth polygon,.rule-hex.marble-earth{fill:#62a83c;background:#62a83c}.marble-vitae polygon,.rule-hex.marble-vitae{fill:#c98c65;background:#c98c65}.marble-mors polygon,.rule-hex.marble-mors{fill:#485f65;background:#485f65}.marble-quicksilver polygon,.rule-hex.marble-quicksilver,.marble-lead polygon,.rule-hex.marble-lead,.marble-tin polygon,.rule-hex.marble-tin,.marble-iron polygon,.rule-hex.marble-iron,.marble-copper polygon,.rule-hex.marble-copper,.marble-silver polygon,.rule-hex.marble-silver,.marble-gold polygon,.rule-hex.marble-gold{fill:var(--purple);background:var(--purple)}.tray{border:1px solid var(--line);background:var(--rules-bg);min-width:0;box-shadow:var(--shadow);-webkit-user-select:none;user-select:none;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:4px;display:flex}.tray-row{justify-content:center;align-items:center;gap:5px;min-width:0;display:flex}.purple-track{gap:4px}.tray-arrow{color:#6b645c;margin-inline:-1px;font-size:clamp(10px,3.1vw,14px);font-weight:500;line-height:1}.tray-divider{background:var(--line);flex:none;width:1px;height:clamp(23px,6.4vw,29px);margin-inline:3px}.token{color:#fff;background:0 0;flex:none;width:clamp(37px,11.25vw,52px);height:clamp(42px,12.8vw,59px);transition:filter .14s,opacity .14s;overflow:visible}.token polygon{fill:var(--hole);stroke:#19191942;stroke-linejoin:round;stroke-width:2px}.token.marble-salt polygon{fill:url(#salt-rainbow)}.token.marble-air polygon{fill:#f0ca4d}.token.marble-fire polygon{fill:#e9593f}.token.marble-water polygon{fill:#4d9ce8}.token.marble-earth polygon{fill:#62a83c}.token.marble-vitae polygon{fill:#c98c65}.token.marble-mors polygon{fill:#485f65}.token.marble-quicksilver polygon,.token.marble-lead polygon,.token.marble-tin polygon,.token.marble-iron polygon,.token.marble-copper polygon,.token.marble-silver polygon,.token.marble-gold polygon{fill:var(--purple)}.token-mark{fill:#fffffff2;pointer-events:none;font-size:clamp(18px,5vw,23px);font-weight:850}.token-count-badge circle{fill:#ffffffeb;stroke:#19191938;stroke-width:1.4px}.token-count{fill:#292521;pointer-events:none;font-size:clamp(14px,3.7vw,17px);font-weight:900}.token .token-count{fill:#292521}.token-count-badge.is-odd .token-count{fill:#d0342c}.token.is-completed{opacity:.28;filter:grayscale(.4)}.token.is-future{opacity:.5;filter:grayscale(.12)}.token.is-current polygon{stroke:#191919b8;stroke-width:3.2px}.app-loading{gap:14px}.loading-stage{flex:1;place-items:center;min-height:0;display:grid}.loading-copy{color:var(--ink);text-align:center;margin:0;font-size:19px;font-weight:520;line-height:1.3}.loading-copy button{margin-top:14px}.loading-copy p{margin:0}.loading-dots{text-align:left;grid-template-columns:repeat(3,.28em);justify-content:start;width:.84em;display:inline-grid}.loading-dots span{opacity:0;animation:1.35s infinite loading-dot-one;transform:translateY(.18em)scale(.6)}.loading-dots span:nth-child(2){animation-name:loading-dot-two}.loading-dots span:nth-child(3){animation-name:loading-dot-three}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@keyframes loading-dot-one{0%,12%{opacity:0;transform:translateY(.18em)scale(.6)}18%,72%{opacity:1;transform:translateY(0)scale(1)}78%,to{opacity:0;transform:translateY(.18em)scale(.6)}}@keyframes loading-dot-two{0%,28%{opacity:0;transform:translateY(.18em)scale(.6)}34%,72%{opacity:1;transform:translateY(0)scale(1)}78%,to{opacity:0;transform:translateY(.18em)scale(.6)}}@keyframes loading-dot-three{0%,44%{opacity:0;transform:translateY(.18em)scale(.6)}50%,72%{opacity:1;transform:translateY(0)scale(1)}78%,to{opacity:0;transform:translateY(.18em)scale(.6)}}.rules-backdrop{z-index:20;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#19191947;justify-content:center;align-items:center;padding:22px;display:flex;position:fixed;inset:0}.rules-modal{background:var(--rules-bg);color:#332f2a;border:1px solid #bdb8ad;border-radius:8px;width:min(1180px,100%);max-height:min(820px,100svh - 44px);padding:28px;position:relative;overflow:auto;box-shadow:0 24px 80px #14141442}.rules-modal h2{color:#403833;letter-spacing:.04em;text-align:center;text-transform:uppercase;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;margin:0 0 18px;font-size:20px;font-weight:650;display:grid}.rules-modal h2:before,.rules-modal h2:after{content:"";background:#8d877c;height:1px}.rules-close{z-index:1;background:0 0;border:0;width:30px;min-height:30px;padding:0;font-size:22px;line-height:1;position:absolute;top:14px;right:16px}.rules-close:hover:not(:disabled){border-color:#0000}.rules-brand{justify-content:center;width:max-content;margin:0 auto 22px}.rules-top{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px;display:grid}.rules-block p,.rules-combinations p{color:#4f4942;text-align:left;margin:0;font-size:14px;line-height:1.35}.rules-block p+p{margin-top:8px}.rules-cards{gap:12px;margin-bottom:18px;display:grid}.rules-cards.two-up{grid-template-columns:repeat(2,1fr)}.rules-cards.one-up{grid-template-columns:1fr}.rules-cards.three-up{grid-template-columns:repeat(3,1fr)}.rules-cards article{background:#ede9de;border:1px solid #8d877c;min-width:0;padding:10px;overflow:hidden}.rules-caption-grid{grid-template-columns:2fr 1fr;gap:18px;display:grid}.mini-rule-board{width:min(210px,100%);height:auto;margin:0 auto;display:block;overflow:visible}.mini-rule-board .grid polygon{stroke-width:2.4px}.mini-rule-board .marble polygon{stroke-width:2.2px}.mini-rule-board .marble.is-selected .marble-face{stroke-width:4.2px}.mini-rule-board .marble text{font-size:20px}.mini-demo-board .marble{opacity:1;transition:opacity .32s,filter .32s}.mini-demo-board .marble-face{transition:stroke .18s,stroke-width .18s,filter .18s}.mini-demo-board .marble.is-hidden,.mini-demo-board .marble.is-clearing{opacity:0}.mini-demo-board .marble.is-fading-in{animation:.28s both demo-fade-in}.mini-demo-board .marble.is-locked{opacity:.22;filter:grayscale(.35)}.mini-demo-board .marble.is-selected .marble-face{stroke:#050505;stroke-width:4.2px}.mini-demo-board .marble.is-match-candidate .marble-face{filter:drop-shadow(0 0 7px #ffffff94)drop-shadow(0 0 15px #f6d05357);stroke:#ffffffeb;stroke-width:3.5px}.mini-demo-board .match-pulse{opacity:0;animation:1.05s ease-in-out infinite demo-candidate-pulse}.mini-demo-board .marble.is-match-candidate .match-pulse{opacity:1}.demo-cursor{color:#191919;filter:drop-shadow(0 2px 2px #19191947);pointer-events:none;transform-box:fill-box;transform-origin:0 0}.demo-cursor path{fill:#fff;stroke:currentColor;stroke-linejoin:round;stroke-width:2.2px}.color-match-frame{background:#ede9de;border:1px solid #8d877c;margin-bottom:12px;padding:10px;overflow:hidden}.color-match-copy{gap:8px;display:grid}.mini-board-labels text,.mini-off-board text{fill:#4a453f;font-size:15px;font-weight:700}@keyframes demo-fade-in{0%{opacity:0}to{opacity:1}}@keyframes demo-candidate-pulse{0%{opacity:.45;transform:scale(1)}48%{opacity:1;transform:scale(1.14)}to{opacity:.45;transform:scale(1)}}.mini-off-board polygon{fill:#ffffffb8;stroke:#19191929;stroke-width:2px}.rule-hex{color:#fffffff5;background:0 0;flex:none;width:34px;height:40px;display:inline-block;overflow:visible}.rule-hex[class*=marble-]{background:0 0}.rule-hex polygon{fill:var(--hole);stroke:#1919193d;stroke-linejoin:round;stroke-width:2px}.rule-hex.marble-salt polygon{fill:url(#salt-rainbow)}.rule-hex.marble-air polygon{fill:#f0ca4d}.rule-hex.marble-fire polygon{fill:#e9593f}.rule-hex.marble-water polygon{fill:#4d9ce8}.rule-hex.marble-earth polygon{fill:#62a83c}.rule-hex.marble-vitae polygon{fill:#c98c65}.rule-hex.marble-mors polygon{fill:#485f65}.rule-hex.marble-quicksilver polygon,.rule-hex.marble-lead polygon,.rule-hex.marble-tin polygon,.rule-hex.marble-iron polygon,.rule-hex.marble-copper polygon,.rule-hex.marble-silver polygon,.rule-hex.marble-gold polygon{fill:var(--purple)}.rule-hex text{fill:currentColor;pointer-events:none;font-size:20px;font-weight:850}.rule-hex.is-empty{color:#4a453f}.rule-hex.is-empty polygon{fill:#f7f5ed}.rule-hex.is-off-board{opacity:.72}.rule-hex.is-off-board polygon{fill:#eeeae0;stroke:#1919191f}.rule-hex.is-locked{filter:grayscale(.15);opacity:.72}.rules-combinations{margin-top:26px}.rules-footer{justify-content:center;margin-top:24px;display:flex}.combination-grid{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:18px;display:grid}.combo-row,.metal-chain{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;min-height:94px;margin-bottom:12px;display:flex}.match-pair,.metal-step{color:#292521;align-items:center;gap:5px;font-size:18px;display:inline-flex}.chain-arrow{color:#292521;font-size:19px;font-weight:500}.result-backdrop{z-index:10;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#1919192e;justify-content:center;align-items:center;padding:18px;display:flex;position:fixed;inset:0}.result{border:1px solid var(--line);background:var(--rules-bg);text-align:center;border-radius:8px;flex-direction:column;align-items:center;gap:10px;width:min(420px,100vw - 36px);padding:22px;display:flex;position:relative;box-shadow:0 20px 60px #14141429}.result-win{gap:24px;width:min(720px,100vw - 36px);padding:42px 38px 34px}.result h2{color:var(--ink);margin:0;font-size:24px;line-height:1.1}.result-win h2{letter-spacing:0;font-size:42px}.result p{color:var(--muted);margin:0;font-size:14px}.result-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px;width:100%;display:grid}.result-stat-column{align-content:start;gap:16px;min-height:170px;padding:0;display:grid}.result-stat-column h3{color:#403833;letter-spacing:.04em;text-align:center;text-transform:uppercase;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;margin:0 0 4px;font-size:18px;font-weight:650;display:grid}.result-stat-column h3:before,.result-stat-column h3:after{content:"";background:#8d877c;height:1px}.result-stat{gap:6px;padding-inline:4px;display:grid}.result-stat span{color:var(--muted);font-size:13px}.result-stat strong{color:var(--ink);font-variant-numeric:tabular-nums;font-size:32px;font-weight:700;line-height:1.1}.result-close{z-index:1;background:0 0;border:0;width:30px;min-height:30px;padding:0;font-size:22px;line-height:1;position:absolute;top:14px;right:16px}.result-close:hover:not(:disabled){border-color:#0000}.result button{margin-top:6px}.result-actions{justify-content:center;gap:8px;margin-top:6px;display:flex}.result-actions button{margin-top:0}@media (width<=680px){.app{gap:8px;padding:4px}.brand h1{font-size:23px}.topbar p{max-width:42vw;font-size:13px}.topbar{gap:8px}.topbar-timer{font-size:15px}.actions{gap:5px}.result-win{gap:14px;padding:34px 16px 22px}.result-win h2{font-size:28px}.result-stats{gap:14px}.result-stat-column{min-height:136px}.result-stat strong{font-size:21px}.result-stat-column h3{gap:8px;font-size:14px}.result-stat{padding-inline:0}button{min-height:36px;padding:0 9px;font-size:13px}.board-wrap{box-shadow:none;border-inline:0;border-radius:0;margin-inline:-4px;padding:0}.board{max-height:none}.tray{gap:5px;overflow-x:hidden}.tray-row{gap:3px}.purple-track{gap:2px}.tray-divider{margin-inline:1px}.rules-backdrop{padding:8px}.rules-modal{max-height:calc(100svh - 16px);padding:18px 14px}.rules-modal h2{gap:10px;font-size:15px}.rules-top,.rules-caption-grid,.combination-grid{grid-template-columns:1fr}.rules-top{gap:24px}.rules-cards.one-up,.rules-cards.two-up,.rules-cards.three-up{grid-template-columns:1fr}.rules-cards article{padding:8px}.rules-combinations{margin-top:22px}.combo-row,.metal-chain{min-height:auto}.mini-rule-board{width:min(190px,100%)}.rule-hex{font-size:15px}}