body{background:var(--nowl-bg-base);color:var(--nowl-text)}.app{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}header{display:flex;align-items:center;gap:14px;padding:16px 20px;border-bottom:1px solid var(--nowl-border);background:var(--nowl-bg-elevated)}.logo{width:44px;height:44px;flex:none}.header-text{display:flex;flex-direction:column;gap:2px;min-width:0}.title{font-size:1.5rem;font-weight:700;color:var(--nowl-white);margin:0;letter-spacing:.01em;white-space:nowrap}.title-accent{color:var(--nowl-accent)}.credit{font-size:.72rem;color:var(--nowl-text-muted);text-decoration:none;transition:color .15s ease;white-space:nowrap}.credit:hover{color:var(--nowl-text-secondary)}.search-bar{position:sticky;top:0;z-index:30;padding:22px 20px 14px;background:var(--nowl-bg-base);border-bottom:1px solid transparent;transition:border-color .2s ease,box-shadow .2s ease,padding .2s ease}.search-bar.stuck{border-bottom-color:var(--nowl-border);box-shadow:0 8px 20px -12px #010e18e6;padding-top:14px}.letter-input{width:100%;max-width:560px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:14px}.input-shell{position:relative;width:min(100%,26rem)}.letters-field{width:100%;height:56px;padding:0 52px;font-size:1.2rem;letter-spacing:.3em;text-align:center;color:var(--nowl-text);background:var(--nowl-bg-surface);border:1px solid var(--nowl-border-strong);border-radius:12px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.letters-field::placeholder{color:var(--nowl-text-muted);letter-spacing:.03em;font-size:.9rem}.letters-field:focus{border-color:var(--nowl-accent);box-shadow:0 0 0 3px #7fdbca24}.clear-button{position:absolute;top:0;bottom:0;right:10px;margin:auto 0;width:34px;height:34px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;line-height:1;color:var(--nowl-text-muted);background:transparent;border:none;border-radius:50%;cursor:pointer;transition:color .15s ease,background .15s ease}.clear-button:hover,.clear-button:focus-visible{color:var(--nowl-text);background:#d6deeb14;outline:none}.rack{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;min-height:40px}.tile{width:34px;height:38px;display:flex;align-items:center;justify-content:center;font-size:1rem;font-weight:700;text-transform:uppercase;color:var(--nowl-bg-base);background:var(--nowl-accent);border-radius:7px;box-shadow:0 3px #010e188c}.tile-blank{background:var(--nowl-coral)}.tile-empty{background:transparent;border:1px dashed var(--nowl-secondary-dark);box-shadow:none}.summary{margin:14px 0 0;font-size:.85rem;color:var(--nowl-text-muted);text-align:center;min-height:1.3em}.summary strong{color:var(--nowl-accent);font-weight:700}.summary-time{color:var(--nowl-secondary-dark)}.main{flex:1;width:100%;max-width:880px;margin:0 auto;padding:18px 20px 14vh}.empty-state{max-width:560px;margin:4vh auto 0;text-align:center}.empty-lead{margin:0 0 26px;font-size:.98rem;line-height:1.6;color:var(--nowl-text-secondary)}.examples-label{display:block;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--nowl-text-muted);margin-bottom:10px}.examples-row{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.example{display:flex;flex-direction:column;align-items:center;gap:2px;padding:9px 14px;background:var(--nowl-bg-surface);border:1px solid var(--nowl-border);border-radius:10px;cursor:pointer;transition:border-color .15s ease,background .15s ease,transform .15s ease}.example:hover,.example:focus-visible{border-color:var(--nowl-accent);background:var(--nowl-bg-elevated);transform:translateY(-1px);outline:none}.example-letters{font-size:.95rem;font-weight:600;letter-spacing:.1em;color:var(--nowl-text)}.example-note{font-size:.66rem;letter-spacing:.06em;color:var(--nowl-text-muted)}.tips{list-style:none;margin:30px 0 0;padding:0;display:flex;flex-direction:column;gap:9px;font-size:.82rem;color:var(--nowl-text-muted)}kbd{display:inline-block;min-width:1.5em;padding:1px 5px;font-family:inherit;font-size:.78em;font-weight:600;color:var(--nowl-text-secondary);background:var(--nowl-bg-elevated);border:1px solid var(--nowl-border);border-bottom-width:2px;border-radius:5px}.no-matches{margin:8vh auto 0;text-align:center;color:var(--nowl-text-secondary)}.no-matches p{margin:0 0 8px}.no-matches-hint{font-size:.85rem;color:var(--nowl-text-muted)}.groups{width:100%;display:flex;flex-direction:column;gap:16px}.group{background:var(--nowl-bg-surface);border:1px solid var(--nowl-border);border-radius:14px;padding:15px 17px 17px}.group-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--nowl-border)}.group-length{margin:0;font-size:1.05rem;font-weight:700;color:var(--nowl-accent)}.group-length-unit{color:var(--nowl-text-muted);font-weight:500;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase}.group-count{font-size:.76rem;color:var(--nowl-text-muted);font-variant-numeric:tabular-nums}.word-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}.word{padding:5px 10px;font:inherit;font-size:.88rem;color:var(--nowl-text);background:var(--nowl-bg-elevated);border:1px solid transparent;border-radius:7px;cursor:pointer;transition:border-color .12s ease,color .12s ease,background .12s ease}.word:hover,.word:focus-visible{border-color:var(--nowl-border-strong);color:var(--nowl-white);outline:none}.word.uses-blank{color:var(--nowl-coral);border-color:#ffab7040}.word.copied{color:var(--nowl-bg-base);background:var(--nowl-accent);border-color:var(--nowl-accent)}.word-run{margin:0;font-size:.86rem;line-height:1.7;color:var(--nowl-text-secondary);word-spacing:.08em}.github-attribution{position:fixed;bottom:.85rem;right:1rem;z-index:50;display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .7rem;background:var(--nowl-bg-elevated);color:var(--nowl-text-secondary);border:1px solid var(--nowl-dark-gray);border-radius:999px;font-family:system-ui,sans-serif;font-size:.76rem;font-weight:500;text-decoration:none;box-shadow:0 2px 8px #0000004d;transition:background .15s ease,color .15s ease,border-color .15s ease}.github-attribution:hover{background:var(--nowl-dark-gray);color:var(--nowl-cyan);border-color:var(--nowl-cyan)}.github-attribution:focus-visible{outline:2px solid var(--nowl-cyan);outline-offset:2px}.github-attribution-icon{font-size:1.1em;line-height:1}@media(max-width:640px){header{padding:12px 14px}.title{font-size:1.2rem}.search-bar{padding:16px 14px 12px}.main{padding:16px 14px 16vh}.letters-field{height:52px;font-size:1.05rem;padding:0 46px}.clear-button{width:32px;height:32px}.tile{width:30px;height:34px;font-size:.9rem}.empty-state{margin-top:2vh}}:root{--nowl-primary-light: #afc6ff;--nowl-primary: #82aaff;--nowl-primary-dark: #4976a1;--nowl-secondary-light: #a3b7c7;--nowl-secondary: #8da0af;--nowl-secondary-dark: #2a3f51;--nowl-cyan: #7fdbca;--nowl-coral: #ffab70;--nowl-green: #c3e88d;--nowl-pink: #f07178;--nowl-yellow: #ffcb6b;--nowl-purple: #c792ea;--nowl-white: #ffffff;--nowl-light-gray: #d6deeb;--nowl-gray: #637777;--nowl-dark-gray: #1d3b53;--nowl-bg-elevated: #132a3e;--nowl-bg-surface: #0a1e30;--nowl-bg-base: #011627;--nowl-bg-floor: #010e18;--nowl-text: #d6deeb;--nowl-text-secondary: #9db2c0;--nowl-text-muted: #7e8e94;--nowl-accent: var(--nowl-cyan);--nowl-border: var(--nowl-dark-gray);--nowl-border-strong: #2c4f6b}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
