:root{--font-sans:"Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;--accent:oklch(55% .16 260);--accent-ink:oklch(44% .16 260);--accent-hover:oklch(38% .16 260);--accent-active:oklch(32% .16 260);--accent-subtle:oklch(96% .02 260);--accent-focus-ring:oklch(55% .16 260/.4);--bg:oklch(98.5% .003 260);--bg-surface:oklch(100% 0 0);--bg-subtle:oklch(96% .005 260);--bg-hover:oklch(94% .008 260);--border-hairline:oklch(16% .008 260/.09);--border-subtle:oklch(16% .008 260/.14);--border-strong:oklch(16% .008 260/.24);--text-primary:oklch(16% .008 260);--text-secondary:oklch(44% .012 260);--text-tertiary:oklch(62% .01 260);--text-inverse:oklch(99% 0 0);--gender-masculine:oklch(52% .16 250);--gender-masculine-bg:oklch(96% .025 250);--gender-masculine-border:oklch(52% .16 250/.25);--gender-feminine:oklch(54% .19 15);--gender-feminine-bg:oklch(96% .03 15);--gender-feminine-border:oklch(54% .19 15/.25);--gender-neuter:oklch(52% .15 155);--gender-neuter-bg:oklch(96% .025 155);--gender-neuter-border:oklch(52% .15 155/.25);--gender-tendency:oklch(62% .15 75);--gender-tendency-bg:oklch(96% .03 75);--gender-tendency-border:oklch(62% .15 75/.25);--verdict-correct:oklch(48% .16 145);--verdict-correct-bg:oklch(96% .03 145);--verdict-correct-border:oklch(48% .16 145/.3);--verdict-incorrect:oklch(52% .19 25);--verdict-incorrect-bg:oklch(96% .03 25);--verdict-incorrect-border:oklch(52% .19 25/.3);--radius-xs:4px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-pill:9999px;--shadow-sm:0 1px 2px oklch(16% .008 260/.04);--shadow-md:0 4px 12px oklch(16% .008 260/.06), 0 1px 3px oklch(16% .008 260/.04);--shadow-lg:0 12px 32px oklch(16% .008 260/.08), 0 2px 6px oklch(16% .008 260/.04);--shadow-modal:0 20px 48px oklch(16% .008 260/.16), 0 4px 12px oklch(16% .008 260/.08);--ease-spring:cubic-bezier(.16, 1, .3, 1);--ease-smooth:cubic-bezier(.4, 0, .2, 1);--duration-fast:.15s;--duration-normal:.25s;--duration-slow:.4s}@media (prefers-color-scheme:dark){:root{--bg:oklch(13% .01 260);--bg-surface:oklch(18% .012 260);--bg-subtle:oklch(22% .012 260);--bg-hover:oklch(26% .015 260);--border-hairline:oklch(98% 0 0/.09);--border-subtle:oklch(98% 0 0/.15);--border-strong:oklch(98% 0 0/.25);--text-primary:oklch(97% .004 260);--text-secondary:oklch(72% .008 260);--text-tertiary:oklch(52% .008 260);--text-inverse:oklch(14% .008 260);--accent:oklch(68% .16 260);--accent-ink:oklch(62% .17 260);--accent-hover:oklch(56% .17 260);--accent-subtle:oklch(24% .04 260);--accent-focus-ring:oklch(68% .16 260/.5);--gender-masculine:oklch(68% .15 250);--gender-masculine-bg:oklch(22% .04 250);--gender-masculine-border:oklch(68% .15 250/.35);--gender-feminine:oklch(70% .17 15);--gender-feminine-bg:oklch(23% .04 15);--gender-feminine-border:oklch(70% .17 15/.35);--gender-neuter:oklch(68% .14 155);--gender-neuter-bg:oklch(22% .035 155);--gender-neuter-border:oklch(68% .14 155/.35);--gender-tendency:oklch(76% .14 75);--gender-tendency-bg:oklch(24% .04 75);--gender-tendency-border:oklch(76% .14 75/.35);--verdict-correct:oklch(68% .15 145);--verdict-correct-bg:oklch(22% .04 145);--verdict-correct-border:oklch(68% .15 145/.35);--verdict-incorrect:oklch(68% .18 25);--verdict-incorrect-bg:oklch(24% .04 25);--verdict-incorrect-border:oklch(68% .18 25/.35);--shadow-sm:none;--shadow-md:none;--shadow-lg:none;--shadow-modal:0 20px 48px oklch(0% 0 0/.5)}}*,:before,:after{box-sizing:border-box}html{font-family:var(--font-sans);color:var(--text-primary);background-color:var(--bg);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;line-height:1.5}body{background-color:var(--bg);min-width:320px;min-height:100vh;color:var(--text-primary);margin:0;padding:0}#root{width:100%;max-width:1120px;margin:0 auto;padding:1.5rem 1.25rem 3rem}h1,h2,h3,h4,h5,h6{text-wrap:balance;color:var(--text-primary);letter-spacing:-.015em;margin:0;font-weight:700}p{text-wrap:pretty}.stats,.stat,.answer-key,.pattern-reliability,.pattern-type{font-variant-numeric:tabular-nums}button{font-family:var(--font-sans);cursor:pointer;color:inherit;transition:transform var(--duration-fast) var(--ease-spring), background-color var(--duration-fast) var(--ease-smooth), border-color var(--duration-fast) var(--ease-smooth), color var(--duration-fast) var(--ease-smooth), box-shadow var(--duration-fast) var(--ease-smooth), opacity var(--duration-fast) var(--ease-smooth);background:0 0;border:1px solid #0000;margin:0;padding:0;font-size:1rem}button:focus-visible,a:focus-visible,.pattern-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button:active:not(:disabled){transform:scale(.96)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.app-header{border-bottom:1px solid var(--border-hairline);flex-direction:column;gap:1.25rem;margin-bottom:2rem;padding-bottom:1.5rem;display:flex}.header-top{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;display:flex}.brand{letter-spacing:-.02em;color:var(--text-primary);transition:opacity var(--duration-fast) var(--ease-smooth);align-items:center;font-size:1.35rem;font-weight:800;text-decoration:none;display:inline-flex}.brand:hover{opacity:.85}.brand-middot{opacity:.7;margin:0 .18em;font-weight:800}.brand-middot-1{color:var(--gender-masculine)}.brand-middot-2{color:var(--gender-feminine)}.stats{background:var(--bg-subtle);border:1px solid var(--border-hairline);border-radius:var(--radius-sm);color:var(--text-secondary);flex-wrap:wrap;align-items:center;gap:.5rem .875rem;padding:.375rem .75rem;font-size:.8125rem;display:inline-flex}.stat{align-items:center;gap:.35em;display:inline-flex}.stat strong{color:var(--text-primary);font-variant-numeric:tabular-nums;font-weight:600}.reset-trigger{color:var(--text-tertiary);border-radius:var(--radius-xs);border:1px solid #0000;min-width:44px;min-height:28px;padding:.2rem .5rem;font-size:.75rem;font-weight:600}.reset-trigger:hover{color:var(--text-primary);background:var(--bg-hover);border-color:var(--border-hairline)}.header-actions{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.header-utility-buttons{align-items:center;gap:.5rem;display:inline-flex}.icon-button{border-radius:var(--radius-sm);background:var(--bg-subtle);border:1px solid var(--border-hairline);min-width:38px;min-height:36px;color:var(--text-primary);justify-content:center;align-items:center;padding:.25rem .5rem;font-size:.95rem;display:inline-flex}.icon-button:hover{background:var(--bg-hover);border-color:var(--border-strong)}.kofi-header-button{border-radius:var(--radius-sm);background:var(--bg-subtle);border:1px solid var(--border-hairline);min-height:36px;color:var(--text-primary);align-items:center;gap:.25rem;padding:.35rem .75rem;font-size:.8125rem;font-weight:600;display:inline-flex}.kofi-header-button:hover{background:var(--bg-hover);border-color:var(--border-strong);color:var(--accent)}.app-nav{background:var(--bg-subtle);border:1px solid var(--border-hairline);border-radius:var(--radius-sm);gap:2px;width:fit-content;padding:3px;display:inline-flex}.nav-link{border-radius:calc(var(--radius-sm) - 2px);color:var(--text-secondary);justify-content:center;align-items:center;min-height:36px;padding:.45rem 1rem;font-size:.875rem;font-weight:600;display:inline-flex}.nav-link:hover{color:var(--text-primary);background:var(--bg-hover)}.nav-link.active{color:var(--text-primary);background:var(--bg-surface);border:1px solid var(--border-subtle);box-shadow:var(--shadow-sm)}.selectors{flex-wrap:wrap;align-items:center;gap:1rem 1.75rem;display:flex}.selector{align-items:center;gap:.625rem;display:inline-flex}.selector-label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-tertiary);font-size:.75rem;font-weight:700}.selector.de-emphasized{opacity:.5;transition:opacity var(--duration-normal) var(--ease-smooth)}.selector.de-emphasized:hover,.selector.de-emphasized:focus-within{opacity:1}.selector-buttons{background:var(--bg-subtle);border:1px solid var(--border-hairline);border-radius:var(--radius-sm);gap:2px;padding:2px;display:inline-flex}.selector-button{border-radius:calc(var(--radius-sm) - 2px);min-width:44px;min-height:36px;color:var(--text-secondary);justify-content:center;align-items:center;padding:.25rem .65rem;font-size:.8125rem;font-weight:500;display:inline-flex}.selector-button:hover{color:var(--text-primary);background:var(--bg-hover)}.selector-button.selected{color:var(--text-primary);background:var(--bg-surface);border:1px solid var(--border-subtle);box-shadow:var(--shadow-sm);font-weight:700}.dialog-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;animation:fadeIn var(--duration-fast) var(--ease-smooth);background:oklch(12% .01 260/.45);place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.dialog{background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border-strong);border-radius:var(--radius-md);width:100%;max-width:24rem;box-shadow:var(--shadow-modal);animation:modalEnter var(--duration-normal) var(--ease-spring);padding:1.5rem}.dialog-title{margin:0 0 1.25rem;font-size:1.05rem;font-weight:600;line-height:1.4}.dialog-actions{justify-content:flex-end;gap:.75rem;display:flex}.dialog-actions button{border-radius:var(--radius-sm);min-height:44px;padding:.5rem 1.15rem;font-size:.875rem;font-weight:600}.reset-cancel{background:var(--bg-subtle);border:1px solid var(--border-hairline);color:var(--text-secondary)}.reset-cancel:hover{background:var(--bg-hover);color:var(--text-primary)}.reset-confirm{background:var(--verdict-incorrect);color:var(--text-inverse);border:1px solid #0000}.reset-confirm:hover{opacity:.9}.kofi-dialog{text-align:center;max-width:28rem;padding:2rem 1.75rem}.kofi-icon-badge{background:var(--accent-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-pill);justify-content:center;align-items:center;width:60px;height:60px;margin-bottom:.75rem;font-size:2.25rem;display:inline-flex}.kofi-title{letter-spacing:-.015em;margin:0 0 .75rem;font-size:1.35rem;font-weight:800}.kofi-text{color:var(--text-primary);margin:0 0 .5rem;font-size:.9375rem;line-height:1.55}.kofi-text-subtle{color:var(--text-secondary);margin:0 0 1.5rem;font-size:.875rem;line-height:1.5}.kofi-actions{flex-direction:column;gap:.625rem;display:flex}.kofi-link-button{background:var(--accent-ink);color:var(--text-inverse);border-radius:var(--radius-sm);min-height:46px;box-shadow:var(--shadow-sm);transition:background-color var(--duration-fast) var(--ease-smooth), transform var(--duration-fast) var(--ease-spring);justify-content:center;align-items:center;padding:.75rem 1.25rem;font-size:.9375rem;font-weight:700;text-decoration:none;display:inline-flex}.kofi-link-button:hover{background:var(--accent-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.kofi-link-button:active{transform:scale(.96)}.kofi-close-button{color:var(--text-secondary);border-radius:var(--radius-sm);background:0 0;min-height:40px;padding:.5rem 1rem;font-size:.875rem;font-weight:600}.kofi-close-button:hover{color:var(--text-primary);background:var(--bg-subtle)}.app-content{padding-top:.5rem}.play-card{background:var(--bg-surface);border:1px solid var(--border-hairline);border-radius:var(--radius-lg);max-width:35rem;box-shadow:var(--shadow-md);text-align:center;margin:0 auto;padding:2.5rem 2rem}.prompt-word{letter-spacing:-.025em;color:var(--text-primary);margin:0 0 .35rem;font-size:2.75rem;font-weight:800}.prompt-question{color:var(--text-tertiary);letter-spacing:.05em;margin:0 0 1.75rem;font-size:1rem;font-weight:500}.prompt-sentence{color:var(--text-primary);margin:0 0 1.75rem;font-size:1.35rem;font-weight:500;line-height:1.6}.sentence-blank{border-bottom:2.5px solid var(--accent);min-width:3ch;color:var(--accent);margin:0 .1em;padding:0 .15em;font-weight:700;display:inline-block}.answer-options{justify-content:center;gap:.875rem;display:flex}.answer-button{background:var(--bg-subtle);border:1px solid var(--border-subtle);border-radius:var(--radius-md);max-width:120px;min-height:68px;box-shadow:var(--shadow-sm);flex-direction:column;flex:96px;justify-content:center;align-items:center;gap:.25rem;display:inline-flex}.answer-button:hover:not(:disabled){background:var(--bg-hover);border-color:var(--border-strong);box-shadow:var(--shadow-md);transform:translateY(-1px)}.answer-button:active:not(:disabled){transform:scale(.96)}.answer-button:disabled{opacity:.6;cursor:not-allowed}.answer-article{color:var(--text-primary);font-size:1.35rem;font-weight:700}.answer-key{font-family:var(--font-mono);color:var(--text-tertiary);background:var(--bg-surface);border:1px solid var(--border-hairline);border-radius:var(--radius-xs);padding:.1rem .35rem;font-size:.6875rem;font-weight:600}.hint-button{min-height:36px;color:var(--text-secondary);border-radius:var(--radius-sm);background:0 0;border:1px solid #0000;justify-content:center;align-items:center;margin:1.5rem auto 0;padding:.35rem .875rem;font-size:.8125rem;font-weight:600;display:inline-flex}.hint-button:hover:not(:disabled){color:var(--text-primary);background:var(--bg-subtle);border-color:var(--border-hairline)}.hint-button:disabled{opacity:.4;cursor:not-allowed}.hint{border:1px dashed var(--border-strong);border-radius:var(--radius-md);background:var(--accent-subtle);text-align:center;max-width:28rem;animation:slideUp var(--duration-fast) var(--ease-spring);margin:1.25rem auto 0;padding:.875rem 1.15rem;font-size:.9375rem}.hint-primary{color:var(--text-primary);margin:0 0 .35rem;font-weight:600}.hint-case-line{color:var(--text-secondary);margin:0;font-size:.875rem}.feedback{border-top:1px solid var(--border-hairline);text-align:center;margin-top:2rem;padding-top:1.75rem}.feedback-verdict{letter-spacing:-.01em;border-radius:var(--radius-pill);justify-content:center;align-items:center;gap:.35rem;margin:0 0 .75rem;padding:.35rem .875rem;font-size:1.2rem;font-weight:800;display:inline-flex}.verdict-correct{color:var(--verdict-correct);background:var(--verdict-correct-bg);border:1px solid var(--verdict-correct-border)}.verdict-incorrect{color:var(--verdict-incorrect);background:var(--verdict-incorrect-bg);border:1px solid var(--verdict-incorrect-border)}.feedback-correct-article{letter-spacing:-.02em;color:var(--text-primary);margin:0 0 .75rem;font-size:2.25rem;font-weight:800}.picked-correct{background:var(--bg-subtle);border:1px solid var(--border-hairline);border-radius:var(--radius-md);justify-content:center;gap:2rem;margin:0 0 1rem;padding:.75rem 1rem;display:flex}.picked-correct-row{flex-direction:column;gap:.2rem;display:flex}.picked-correct dt{text-transform:uppercase;letter-spacing:.08em;color:var(--text-tertiary);font-size:.6875rem;font-weight:700}.picked-correct dd{color:var(--text-primary);margin:0;font-size:1.6rem;font-weight:800}.feedback-german{color:var(--text-primary);margin:0 0 .75rem;font-size:1.15rem;font-weight:600;line-height:1.45}.feedback-primary{color:var(--text-primary);margin:0 0 .35rem;font-size:.9375rem;font-weight:600;line-height:1.5}.feedback-case-line{color:var(--text-secondary);margin:0 0 .5rem;font-size:.875rem;line-height:1.45}.feedback-english{color:var(--text-tertiary);margin:.75rem 0 0;font-size:.875rem;font-weight:500}.feedback .view-pattern,.feedback .next-button{border-radius:var(--radius-sm);justify-content:center;align-items:center;min-height:44px;margin-top:1.25rem;padding:.5rem 1.25rem;font-size:.875rem;font-weight:600;display:inline-flex}.feedback .view-pattern{background:var(--bg-subtle);border:1px solid var(--border-subtle);color:var(--text-secondary);margin-right:.625rem}.feedback .view-pattern:hover{background:var(--bg-hover);color:var(--text-primary);border-color:var(--border-strong)}.feedback .next-button{background:var(--accent-ink);color:var(--text-inverse);box-shadow:var(--shadow-sm);border:1px solid #0000}.feedback .next-button:hover{background:var(--accent-hover);box-shadow:var(--shadow-md)}.feedback .next-button:active{background:var(--accent-active);transform:scale(.96)}.empty-state{text-align:center;background:var(--bg-surface);border:1px solid var(--border-hairline);border-radius:var(--radius-md);max-width:32rem;color:var(--text-secondary);box-shadow:var(--shadow-sm);margin:3rem auto;padding:2rem}.pattern-bank{max-width:58rem;margin:0 auto;padding:.5rem 0 3rem}.pattern-bank-header{border-bottom:1px solid var(--border-hairline);margin-bottom:2.25rem;padding-bottom:1.5rem}.pattern-bank-header h2{letter-spacing:-.02em;margin:0 0 .5rem;font-size:2rem;font-weight:800}.pattern-bank-subtitle{color:var(--text-secondary);max-width:42rem;margin:0 0 1.25rem;font-size:.95rem;line-height:1.55}.pattern-bank-filters{flex-wrap:wrap;gap:.5rem;display:flex}.filter-button{border-radius:var(--radius-sm);background:var(--bg-subtle);border:1px solid var(--border-hairline);min-height:38px;color:var(--text-secondary);padding:.4rem .875rem;font-size:.8125rem;font-weight:600}.filter-button:hover{background:var(--bg-hover);color:var(--text-primary)}.filter-button.active{background:var(--bg-surface);color:var(--text-primary);border-color:var(--border-strong);box-shadow:var(--shadow-sm);font-weight:700}.pattern-group{margin-bottom:3rem}.group-title{letter-spacing:-.01em;border-bottom:2px solid var(--border-subtle);align-items:center;gap:.5rem;margin:0 0 1.25rem;padding-bottom:.5rem;font-size:1.35rem;font-weight:800;display:flex}.group-title-masculine{border-color:var(--gender-masculine);color:var(--gender-masculine)}.group-title-feminine{border-color:var(--gender-feminine);color:var(--gender-feminine)}.group-title-neuter{border-color:var(--gender-neuter);color:var(--gender-neuter)}.group-title-tendencies{border-color:var(--gender-tendency);color:var(--gender-tendency)}.group-patterns{grid-template-columns:repeat(auto-fill,minmax(26rem,1fr));gap:1.25rem;display:grid}.pattern-card{background:var(--bg-surface);border:1px solid var(--border-hairline);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);transition:transform var(--duration-fast) var(--ease-spring), border-color var(--duration-fast) var(--ease-smooth), box-shadow var(--duration-fast) var(--ease-smooth);text-align:left;outline:none;padding:1.35rem}.pattern-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-md);transform:translateY(-2px)}.pattern-card-selected{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-focus-ring);animation:1.5s ease-in-out pulseCard}.pattern-header{justify-content:space-between;align-items:center;margin-bottom:.625rem;display:flex}.pattern-name{letter-spacing:-.01em;margin:0;font-size:1.25rem;font-weight:800}.pattern-gender{text-transform:capitalize;border-radius:var(--radius-pill);border:1px solid #0000;padding:.2rem .6rem;font-size:.75rem;font-weight:700}.pattern-gender.gender-masculine{color:var(--gender-masculine);background:var(--gender-masculine-bg);border-color:var(--gender-masculine-border)}.pattern-gender.gender-feminine{color:var(--gender-feminine);background:var(--gender-feminine-bg);border-color:var(--gender-feminine-border)}.pattern-gender.gender-neuter{color:var(--gender-neuter);background:var(--gender-neuter-bg);border-color:var(--gender-neuter-border)}.pattern-gender.gender-tendencies{color:var(--gender-tendency);background:var(--gender-tendency-bg);border-color:var(--gender-tendency-border)}.pattern-meta{color:var(--text-secondary);flex-wrap:wrap;gap:.5rem;margin-bottom:.875rem;font-size:.75rem;display:flex}.pattern-type,.pattern-reliability{background:var(--bg-subtle);border:1px solid var(--border-hairline);border-radius:var(--radius-xs);padding:.15rem .5rem;font-weight:500}.pattern-rule{color:var(--text-primary);margin:0 0 .5rem;font-size:.9375rem;line-height:1.5}.pattern-rule strong{font-weight:700}.pattern-explanation{color:var(--text-secondary);margin:0 0 .875rem;font-size:.875rem;line-height:1.5}.pattern-examples-section,.pattern-exceptions-section{margin-top:.75rem;font-size:.8125rem}.pattern-examples-section strong,.pattern-exceptions-section strong{color:var(--text-primary);font-weight:700}.pattern-examples-list,.pattern-exceptions-list{flex-wrap:wrap;gap:.35rem .5rem;margin:.4rem 0 0;padding:0;list-style:none;display:flex}.pattern-example-item{background:var(--bg-subtle);border:1px solid var(--border-hairline);border-radius:var(--radius-xs);color:var(--text-primary);padding:.15rem .5rem;font-weight:500}.pattern-exception-item{background:var(--verdict-incorrect-bg);border:1px solid var(--verdict-incorrect-border);color:var(--verdict-incorrect);border-radius:var(--radius-xs);padding:.15rem .5rem;font-weight:600}@media (prefers-reduced-motion:no-preference){@keyframes cardEnter{0%{opacity:0;transform:translateY(12px)scale(.99)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalEnter{0%{opacity:0;transform:scale(.95)translateY(10px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes pulseCard{0%{box-shadow:0 0 0 0 var(--accent-focus-ring)}70%{box-shadow:0 0 0 8px #0000}to{box-shadow:0 0 #0000}}.card-enter{animation:cardEnter .35s var(--ease-spring) forwards}.feedback-reveal{animation:slideUp .3s var(--ease-spring) forwards}}@media (width<=640px){#root{padding:1rem .875rem 2rem}.play-card{padding:1.75rem 1.15rem}.prompt-word{font-size:2.15rem}.prompt-sentence{font-size:1.15rem}.answer-options{gap:.5rem}.answer-button{flex:76px;min-height:60px}.answer-article{font-size:1.15rem}.header-top{flex-direction:column;align-items:flex-start}.stats{justify-content:space-between;width:100%}.selectors{flex-direction:column;align-items:stretch;gap:.75rem}.selector{flex-direction:column;align-items:flex-start;gap:.35rem}.selector-buttons{width:100%;overflow-x:auto}.selector-button{flex:auto}.group-patterns{grid-template-columns:1fr}}.guide-dialog{text-align:center;width:calc(100vw - 2rem);max-width:28rem;max-height:90vh;padding:2rem 1.75rem;position:relative;overflow-y:auto}.guide-dialog::-webkit-scrollbar{width:6px}.guide-dialog::-webkit-scrollbar-track{background:0 0}.guide-dialog::-webkit-scrollbar-thumb{background:var(--border-subtle);border-radius:3px}.guide-close-btn{border-radius:var(--radius-sm);width:32px;height:32px;color:var(--text-tertiary);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;font-size:1.1rem;display:flex;position:absolute;top:.75rem;right:.75rem}.guide-close-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.guide-step{flex-direction:column;justify-content:center;align-items:center;gap:.5rem;padding:.5rem 0;display:flex}.guide-step-icon{margin-bottom:.25rem;font-size:2.5rem}.guide-step-title{letter-spacing:-.01em;color:var(--text-primary);margin:0;font-size:1.35rem;font-weight:800}.guide-step-text{color:var(--text-primary);max-width:24rem;margin:0;font-size:.9375rem;line-height:1.55}.guide-step-subtle{color:var(--text-secondary);font-size:.875rem}.guide-mock-card{background:var(--bg-surface);border:1px solid var(--border-hairline);border-radius:var(--radius-md);width:100%;max-width:20rem;box-shadow:var(--shadow-sm);margin:.75rem 0;padding:1.25rem}.guide-mock-word{letter-spacing:-.02em;margin-bottom:.25rem;font-size:1.75rem;font-weight:800}.guide-mock-prompt{color:var(--text-tertiary);margin-bottom:.75rem;font-size:.875rem}.guide-mock-sentence{margin-bottom:.75rem;font-size:1.1rem;font-weight:500}.guide-mock-blank{border-bottom:2px solid var(--accent);min-width:3ch;color:var(--accent);font-weight:700;display:inline-block}.guide-mock-buttons{justify-content:center;gap:.5rem;display:flex}.guide-mock-btn{border-radius:var(--radius-sm);background:var(--bg-subtle);border:1px solid var(--border-hairline);text-align:center;min-width:50px;padding:.35rem .75rem;font-size:.875rem;font-weight:600}.guide-mock-btn-correct{background:var(--verdict-correct-bg);border-color:var(--verdict-correct-border);color:var(--verdict-correct)}.guide-mock-hint{background:var(--accent-subtle);border:1px dashed var(--border-strong);border-radius:var(--radius-md);text-align:center;width:100%;max-width:24rem;margin:.75rem 0;padding:.75rem 1rem}.guide-mock-hint-primary{margin:0 0 .25rem;font-weight:600}.guide-mock-hint-case{color:var(--text-secondary);margin:0;font-size:.875rem}.guide-article-table{border-collapse:collapse;margin:.75rem 0;font-size:.9375rem}.guide-article-table th,.guide-article-table td{text-align:center;border:1px solid var(--border-hairline);padding:.4rem .875rem}.guide-article-table th{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;font-size:.8125rem;font-weight:700}.guide-table-label{color:var(--text-primary);font-weight:700}.guide-step-indicator{justify-content:center;gap:.4rem;margin:1rem 0 .75rem;display:flex}.guide-dot{background:var(--bg-hover);border:1px solid var(--border-subtle);width:8px;height:8px;transition:background var(--duration-fast) var(--ease-smooth);border-radius:50%}.guide-dot-active{background:var(--accent);border-color:var(--accent)}.guide-actions{flex-wrap:wrap;justify-content:center;gap:.625rem;display:flex}.guide-btn{border-radius:var(--radius-sm);cursor:pointer;border:1px solid #0000;min-height:42px;padding:.5rem 1.25rem;font-size:.875rem;font-weight:600}.guide-btn-next{background:var(--accent-ink);color:var(--text-inverse)}.guide-btn-next:hover{background:var(--accent-hover)}.guide-btn-back{background:var(--bg-subtle);border-color:var(--border-hairline);color:var(--text-secondary)}.guide-btn-back:hover{background:var(--bg-hover);color:var(--text-primary)}.guide-btn-skip{color:var(--text-tertiary);background:0 0}.guide-btn-skip:hover{color:var(--text-primary)}kbd{font-family:var(--font-mono);background:var(--bg-subtle);border:1px solid var(--border-hairline);border-radius:var(--radius-xs);box-shadow:0 1px 0 var(--border-subtle);padding:.15rem .4rem;font-size:.8125rem;font-weight:600;display:inline-block}.howto-header-button{border-radius:var(--radius-sm);background:var(--bg-subtle);border:1px solid var(--border-hairline);min-height:36px;color:var(--text-primary);align-items:center;gap:.25rem;padding:.35rem .75rem;font-size:.8125rem;font-weight:600;display:inline-flex}.howto-header-button:hover{background:var(--bg-hover);border-color:var(--border-strong);color:var(--accent)}@media (width<=640px){.guide-dialog{max-height:85vh;padding:1.5rem 1rem}.guide-step-icon{font-size:2rem}.guide-step-title{font-size:1.15rem}.guide-step-text{font-size:.875rem}.guide-mock-card{padding:1rem}.guide-mock-word{font-size:1.5rem}.guide-mock-sentence{font-size:1rem}.guide-article-table{font-size:.8125rem}.guide-article-table th,.guide-article-table td{padding:.3rem .5rem}.guide-actions{flex-direction:column;gap:.5rem}.guide-btn{width:100%}}
