@import"https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,500;0,9..40,600;1,9..40,400&family=DM+Serif+Display&display=swap";*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #F4F1EB;--surface: #EAE7E0;--surface-raised: #E2DFD8;--border: #D0CCC4;--text: #1A1814;--text-muted: #7A756C;--accent: #4A7A5A;--key-active-bg: #2C2A26;--key-active-text: #F0EDE6;--key-inactive-bg: #DAD7D0;--key-inactive-text: #A09C96;--valid: #4A7A5A;--invalid: #C4614A;--radius: 6px}html{background:var(--bg);color:var(--text);font-family:DM Sans,system-ui,sans-serif;font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}body{min-height:100vh}.app{max-width:680px;margin:0 auto;padding:0 28px}.hero{text-align:center;padding:88px 0 72px;border-bottom:1px solid var(--border)}.logo{height:224px;width:auto;display:block;margin:0 auto 28px}.tagline{font-size:1.2rem;color:var(--text-muted);font-weight:400;margin:0}section{padding:72px 0;border-bottom:1px solid var(--border)}h2{font-family:"DM Serif Display",Georgia,serif;font-size:1.75rem;font-weight:400;margin-bottom:14px;letter-spacing:-.01em}p{color:var(--text-muted);margin-bottom:0}p+p{margin-top:12px}strong{color:var(--text);font-weight:600}.keyboard{display:flex;flex-direction:column;gap:5px;width:fit-content;margin:40px auto 20px;-webkit-user-select:none;user-select:none}.keyboard-row{display:flex;gap:5px}.keyboard-row.row-1{padding-left:20px}.keyboard-row.row-2{padding-left:40px}.key{width:37px;height:37px;display:flex;align-items:center;justify-content:center;border-radius:4px;font-size:12px;font-weight:600;letter-spacing:.02em;flex-shrink:0}.key--active{background:var(--key-active-bg);color:var(--key-active-text);box-shadow:0 2px #100e0b}.key--inactive{background:var(--key-inactive-bg);color:var(--key-inactive-text);box-shadow:0 2px #b8b4ae}.key-list{font-size:.82rem;letter-spacing:.08em;color:var(--text-muted);text-align:center;margin-top:10px}.checker-input-wrap{margin:24px 0 0}.checker-input{width:100%;padding:14px 18px;font-size:1.2rem;font-family:inherit;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);outline:none;transition:border-color .15s,box-shadow .15s}.checker-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent)}.checker-input::placeholder{color:var(--text-muted);opacity:.55}.checker-result{margin-top:20px;padding-top:20px;border-top:1px solid var(--border)}.letter-breakdown{margin-bottom:14px;font-size:1.75rem;font-weight:600;letter-spacing:.06em;line-height:1.5;word-break:break-all}.letter--valid{color:var(--valid)}.letter--invalid{color:var(--invalid);text-decoration:underline;text-decoration-style:wavy;text-decoration-color:var(--invalid);text-underline-offset:4px}.letter--neutral{color:var(--text-muted)}.letter-space{display:inline-block;width:.45em}.verdict{font-size:.95rem;font-weight:600;letter-spacing:.01em}.verdict--yes{color:var(--valid)}.verdict--no{color:var(--invalid)}.examples-grid{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}.example-word{background:var(--surface);border:1px solid var(--border);border-radius:100px;padding:6px 18px;font-size:.9rem;font-weight:500;color:var(--text);cursor:pointer;transition:background .12s,border-color .12s}.example-word:hover{background:var(--surface-raised);border-color:#c0bcb5}footer{padding:36px 0 52px;text-align:center}footer p{font-size:.82rem;color:var(--text-muted);opacity:.7}@media (max-width: 520px){.app{padding:0 20px}.hero{padding:48px 0 44px;text-align:center}.logo{height:148px}section{padding:52px 0;text-align:center}section h2,section p,.key-list{text-align:center}.key{width:28px;height:28px;font-size:9px}.keyboard-row.row-1{padding-left:14px}.keyboard-row.row-2{padding-left:28px}.checker-input-wrap,.checker-input,.checker-result,.letter-breakdown,.verdict{text-align:left}.letter-breakdown{font-size:1.4rem}.examples-grid{justify-content:center}}