*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--bg: #F7F5F0;--bg-alt: #EDEAE4;--text: #1A1A1A;--text-muted: #9A9490;--accent: #2D5BE3;--accent-suffix: #D4450C;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono: "DM Mono", "SF Mono", "Fira Code", monospace}[data-theme=dark]{--bg: #111110;--bg-alt: #1E1E1C;--text: #E8E6E1;--text-muted: #7A7670;--accent: #6B8AFF;--accent-suffix: #FF7043}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-sans);background-color:var(--bg);color:var(--text);line-height:1.5;min-height:100vh;transition:background-color .3s ease,color .3s ease}.app{max-width:1060px;margin:0 auto;padding:3rem 1.5rem 2rem;min-height:100vh;display:flex;flex-direction:column}.header{margin-bottom:2.5rem}.header-row{display:flex;align-items:center;justify-content:space-between}.theme-toggle{background:var(--bg-alt);border:none;color:var(--text-muted);width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:color .2s ease,background-color .2s ease,transform .3s cubic-bezier(.34,1.56,.64,1);flex-shrink:0}.theme-toggle:hover{color:var(--text);transform:rotate(30deg)}.theme-toggle:active{transform:rotate(180deg) scale(.9)}.theme-icon{transition:transform .4s cubic-bezier(.34,1.56,.64,1)}.title{font-family:var(--font-sans);font-size:2rem;font-weight:700;letter-spacing:-.03em;color:var(--text);line-height:1.1}.subtitle{font-size:1rem;color:var(--text-muted);margin-top:.35rem;font-weight:400}.search-container{margin-bottom:2rem}.dual-inputs{display:flex;align-items:flex-end;gap:1rem}.input-group{flex:1}.input-label{display:block;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:.4rem;font-family:var(--font-sans)}.label-optional{font-weight:400;text-transform:none;letter-spacing:normal;opacity:.6;font-size:.7rem}.input-divider{display:flex;align-items:center;padding-bottom:.6rem}.divider-dot{font-size:1.5rem;font-weight:300;color:var(--bg-alt);line-height:1;-webkit-user-select:none;user-select:none}.input-wrapper{position:relative;display:flex;align-items:center}.search-input{width:100%;font-family:var(--font-sans);font-size:1.75rem;font-weight:500;color:var(--text);background:transparent;border:none;border-bottom:2px solid var(--bg-alt);padding:.5rem 2.5rem .5rem 0;outline:none;caret-color:var(--accent);transition:border-color .2s ease,color .3s ease;letter-spacing:-.01em}.search-input::placeholder{color:var(--text-muted);font-weight:400;opacity:.5}.search-input:focus{border-bottom-color:var(--accent)}#suffix-input:focus{border-bottom-color:var(--accent-suffix);caret-color:var(--accent-suffix)}.clear-btn{position:absolute;right:0;top:50%;transform:translateY(-50%);background:none;border:none;font-size:1.5rem;color:var(--text-muted);cursor:pointer;padding:.25rem .5rem;line-height:1;font-family:var(--font-sans);transition:color .15s ease;border-radius:4px}.clear-btn:hover{color:var(--text)}.count-chip{display:inline-flex;align-items:baseline;margin-top:1rem;font-size:.875rem;font-family:var(--font-mono);animation:chipFadeIn .2s ease}.count-number{color:var(--accent);font-weight:500}.count-label{color:var(--text-muted);margin-left:.15em}@keyframes chipFadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.hero{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 0;animation:heroFadeIn .4s ease}.hero-label{font-size:.875rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:1.25rem;font-weight:500}.hero-examples{display:flex;flex-wrap:wrap;gap:.625rem;justify-content:center;max-width:680px}.hero-chip{font-family:var(--font-mono);font-size:.875rem;font-weight:500;color:var(--text);background:var(--bg-alt);border:none;padding:.5rem .9rem;border-radius:6px;cursor:pointer;display:inline-flex;align-items:center;gap:.35em;transition:background .15s ease,transform .15s ease}.hero-chip:hover{background:#e0dcd5;transform:translateY(-1px)}[data-theme=dark] .hero-chip:hover{background:#2a2a27}.hero-prefix{color:var(--accent);font-weight:600}.hero-dots{color:var(--text-muted);opacity:.4;font-size:.75em}.hero-suffix{color:var(--accent-suffix);font-weight:600}.hero-arrow{color:var(--text-muted);font-size:.85em;margin:0 .1em}.hero-result{color:var(--text);font-weight:400}.hero-combo-text{font-size:.8em;letter-spacing:.01em}.hero-chip--combo .hero-combo-text{color:var(--text-muted)}.hero-total{margin-top:2rem;font-size:.8125rem;color:var(--text-muted);font-family:var(--font-mono)}@keyframes heroFadeIn{0%{opacity:0}to{opacity:1}}.no-results{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 0;animation:heroFadeIn .3s ease}.no-results-dash{font-size:2.5rem;color:var(--bg-alt);line-height:1;margin-bottom:.75rem;font-weight:300}.no-results-text{font-size:.9375rem;color:var(--text-muted)}.results{flex:1}.word-grid{columns:4;column-gap:1rem;padding-top:.25rem}.word-item{display:block;font-family:var(--font-mono);font-size:.8125rem;color:var(--text);background:var(--bg-alt);padding:.3rem .6rem;border-radius:4px;margin-bottom:.375rem;break-inside:avoid;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;animation:wordFadeIn .25s ease both;transition:background-color .3s ease,color .3s ease}.hl-prefix{color:var(--accent);font-weight:600}.hl-suffix{color:var(--accent-suffix);font-weight:600}.hl-accent{color:var(--accent);font-weight:600}@keyframes wordFadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.overflow-label{margin-top:1.25rem;text-align:center;font-family:var(--font-mono);font-size:.8125rem;color:var(--text-muted);padding:.75rem;background:var(--bg-alt);border-radius:6px}.footer{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--bg-alt);text-align:center}.footer p{font-size:.75rem;color:var(--text-muted);font-family:var(--font-mono)}@media(max-width:768px){.app{padding:2rem 1rem 1.5rem}.title{font-size:1.5rem}.search-input{font-size:1.25rem}.dual-inputs{gap:.75rem}.word-grid{columns:2}.hero-examples{gap:.5rem}.hero-chip{font-size:.8125rem;padding:.4rem .75rem}}@media(max-width:480px){.dual-inputs{flex-direction:column;gap:1rem}.input-divider{display:none}.word-grid{columns:1}.search-input{font-size:1.125rem}}@media(min-width:769px)and (max-width:1024px){.word-grid{columns:3}}@media(min-width:1025px){.word-grid{columns:5}}