@font-face{font-family:'Comfortaa';src:url('./assets/fonts/Comfortaa-variable.ttf') format('truetype');font-style:normal;font-weight:300 700;font-display:swap}
:root{font-family:'Comfortaa',sans-serif;color:var(--text);background:var(--bg);font-synthesis:none;color-scheme:light;--accent:#f503d9;--subaccent:#55256f;--text:#34233d;--bg:#faf5fb;--surface:#fffbff;--muted:#75657c;--line:#e1d4e6;--soft:#f1e5f4;--accepted:#f5dcef;--tile-shadow:#74115c;--input-line:#cdb8d4;--placeholder:#89748f;--backdrop:#27103480}
:root[data-theme="dark"]{color-scheme:dark;--accent:#f512bc;--subaccent:#754a9c;--text:#f3e6f8;--bg:#18111f;--surface:#24192e;--muted:#bdaac6;--line:#46324f;--soft:#37233f;--accepted:#46243f;--tile-shadow:#74115c;--input-line:#6c4c78;--placeholder:#b29cbd;--backdrop:#100817b8}
*{box-sizing:border-box}body{margin:0;font-family:inherit}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--subaccent);outline-offset:4px}header{max-width:1120px;margin:auto;padding:26px 36px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{font-size:30px;font-weight:700;letter-spacing:-1.5px;text-decoration:none;color:inherit}.brand-dot{color:var(--subaccent);margin-left:7px}.icon{border:1px solid var(--input-line);border-radius:50%;width:32px;height:32px;background:transparent;color:inherit;font-weight:600}main{max-width:790px;margin:auto;padding:40px 24px 20px}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:700;display:flex;gap:10px;align-items:center}#date{margin-left:auto;letter-spacing:1px;color:var(--muted)}.live-dot{width:6px;height:6px;background:var(--subaccent);border-radius:50%}.intro{text-align:center;padding:32px 0 22px}h1{font-family:inherit;font-size:46px;line-height:1.25;letter-spacing:-1.8px;font-weight:500;margin:0 0 22px}h1 em{color:var(--accent);font-weight:400}.intro p{color:var(--muted);font-size:14px;line-height:1.7}.mode{font-size:11px;text-align:center;color:var(--subaccent);min-height:24px}.puzzle{border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:25px 36px 22px;box-shadow:0 7px 24px #303a2710}.puzzle-top{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.5px;font-weight:700;color:var(--muted)}.tiles{display:flex;justify-content:center;gap:14px;margin:31px 0 17px}.tile{position:relative;width:74px;height:82px;display:grid;place-items:center;background:#e00ca8;border-radius:8px;color:#fff;font-family:inherit;font-size:44px;box-shadow:0 5px 0 var(--tile-shadow)}.tile:not(:last-child):after{content:'·';position:absolute;right:-12px;color:var(--muted);font-size:24px}.trail-caption{text-align:center;font-size:11px;color:var(--muted);margin-bottom:28px}label{display:block;font-size:11px;font-weight:600;margin-bottom:9px}.input-row{display:flex;gap:9px}input{width:0;flex:1;border:1px solid var(--input-line);border-radius:7px;background:transparent;padding:16px;color:var(--text);font-size:17px}input::placeholder{color:var(--placeholder)}button[type=submit]{border:0;border-radius:7px;background:#ad1685;color:white;padding:0 22px;font-size:13px;font-weight:600}button[type=submit] span{margin-left:20px}button:disabled{opacity:.5;cursor:default}.status-row{display:flex;align-items:center;justify-content:space-between;margin-top:17px;font-size:11px;color:var(--muted)}.attempts{display:flex;gap:5px}.attempts span{width:7px;height:7px;border-radius:50%;background:var(--line)}.attempts .used{background:var(--subaccent)}.attempts .won{background:var(--accent)}#message{font-size:13px;min-height:18px;margin-bottom:0}#history{list-style:none;padding:0;font-size:12px;margin:8px 0 0;display:flex;flex-wrap:wrap;gap:8px}#history li{padding:5px 9px;background:var(--soft);border-radius:4px}#history .accepted{color:var(--accent);background:var(--accepted)}.how{display:flex;gap:23px;align-items:center;margin:25px 0 30px;padding:0 16px}.mini-tiles{white-space:nowrap;border:1px solid var(--input-line);border-radius:4px;font-size:11px;letter-spacing:4px;padding:9px;color:var(--accent)}.how p{font-size:11px;line-height:1.9;color:var(--muted)}.how strong{letter-spacing:1px}.how strong b{color:var(--accent)}.how strong span{font-weight:400}footer{border-top:1px solid var(--line);padding:21px 0;display:flex;gap:12px;flex-wrap:wrap;font-size:10px;color:var(--muted)}footer a{color:inherit;margin-left:auto}.section-title{display:flex;justify-content:space-between;align-items:center}h2{font-family:inherit;font-size:27px;font-weight:500;margin:8px 0}.results{margin-top:35px}.text-button{border:0;background:transparent;color:var(--accent);font-size:12px;padding:10px 0;text-decoration:underline;text-underline-offset:4px}#ranking{list-style:none;padding:0}#ranking li{position:relative;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;padding:15px 10px;font-size:13px;isolation:isolate}#ranking li:before{content:'';position:absolute;inset:4px auto 4px 0;width:var(--bar);background:var(--soft);z-index:-1;border-radius:4px}#result-info{font-size:12px;color:var(--muted)}dialog{border:1px solid var(--line);border-radius:16px;max-width:480px;padding:32px;color:inherit;background:var(--surface)}dialog::backdrop{background:var(--backdrop)}dialog .icon{float:right}dialog p{font-size:14px;line-height:1.7}@media(max-width:560px){header{padding:18px 22px}.brand{font-size:26px}main{padding:28px 18px 10px}h1{font-size:32px;letter-spacing:-1px}.intro{padding-top:30px}.puzzle{padding:23px 20px}.tile{width:51px;height:64px;font-size:34px}.tiles{gap:11px}.tile:not(:last-child):after{right:-10px}.input-row{flex-direction:column}input{width:100%}button[type=submit]{padding:15px}.how{padding:0;gap:12px}.eyebrow{font-size:9px;letter-spacing:1px}#date{font-size:9px}.section-title{align-items:end}footer a{margin-left:0}}

.header-actions{display:flex;align-items:center;gap:10px}h1 em{font-style:normal}#theme-toggle{font-family:system-ui,sans-serif;font-size:20px}#answer-count{font-variant-numeric:tabular-nums}footer{justify-content:flex-start}
