@layer components{.grammar-video{gap:var(--space-2);flex-direction:column;width:100%;max-width:none;display:flex}.grammar-video h2{margin:0}.grammar-video_player{border-radius:var(--radius-card);aspect-ratio:16/9;background:#000;width:100%}.grammar-video_placeholder{aspect-ratio:16/9;justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-3);border:var(--border-width) dashed var(--color-border-field);border-radius:var(--radius-card);background:var(--color-surface-soft);text-align:center;color:var(--color-text-secondary);flex-direction:column;display:flex}.grammar-video_placeholder p{max-width:28rem;margin:0}.grammar-video_icon{background:var(--color-yellow-tile);width:3.5rem;height:3.5rem;color:var(--color-text-primary);border-radius:50%;place-items:center;font-size:1.25rem;display:grid}.gp_wrap{gap:var(--space-2);min-width:0;max-width:45rem;padding:var(--space-3);border:var(--border-width) solid var(--color-border);border-radius:var(--radius-card);background:var(--color-white);flex-direction:column;display:flex}.gp_game{gap:var(--space-2);flex-direction:column;min-width:0;display:flex}.gp_menu{gap:var(--space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.gp_menu_item{justify-content:space-between;align-items:center;gap:var(--space-2);padding:var(--space-2);border:var(--border-width) solid var(--color-border-field);border-radius:var(--radius-card);flex-wrap:wrap;display:flex}.gp_menu_title{margin:0;font-size:1.0625rem}.gp_hint,.gp_counter{color:var(--color-text-secondary);font-size:var(--text-small);margin:0}.gp_lives{letter-spacing:.1em;color:var(--puzzle-bad-fg,#a8201a);margin:0;font-size:1.125rem}.gp_prompt{margin:0;font-size:1.125rem;line-height:1.5}.gp_big{font-size:1.5rem;font-weight:var(--primary-bold)}.gp_row{gap:var(--space-2);flex-wrap:wrap;display:flex}.gp_row .phr_option{flex:8rem;width:auto}.gp_columns{gap:var(--space-2);grid-template-columns:1fr 1fr;display:grid}.gp_col{flex-flow:column}.gp_col .phr_option{flex:none}.gp_lines{gap:var(--space-1);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.gp_lines .phr_option{width:100%}.gp_built{align-items:center;gap:var(--space-1);min-height:3rem;padding:var(--space-1);border-bottom:var(--border-width) solid var(--color-border-field);flex-wrap:wrap;display:flex}.gp_tile,.gp_word{border:var(--border-width) solid var(--color-border-field);border-radius:var(--radius-pill);background:var(--color-surface-soft);color:var(--color-text-primary);font:inherit;cursor:pointer;padding:.5rem .875rem}.gp_tile.is-placed{background:var(--color-yellow-tile)}.gp_tile:disabled{opacity:.4;cursor:default}.gp_tile:focus-visible,.gp_word:focus-visible{outline:var(--outline-focus);outline-offset:2px}.gp_word{font-size:inherit;background:0 0;border-color:#0000;border-radius:.375rem;margin:0 .1em;padding:.1rem .35rem;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;display:inline}.gp_word.is-picked{background:var(--color-yellow-tile)}.gp_blank{border-bottom:2px solid var(--color-text-primary);font-weight:var(--primary-bold);padding:0 .4rem}.gp_wrap .phr_option.is-picked{border-color:var(--color-text-primary);background:var(--color-yellow-tile)}.gp_feedback{align-items:flex-start;gap:var(--space-1);padding:var(--space-2);border-radius:var(--radius-card);flex-direction:column;display:flex}.gp_feedback p{margin:0;line-height:1.4}.gp_feedback.is-right{background:var(--puzzle-ok-bg,#e5f5e0);color:var(--puzzle-ok-fg,#1c5d2a)}.gp_feedback.is-wrong{background:var(--puzzle-bad-bg,#fdecea);color:var(--puzzle-bad-fg,#a8201a)}.gp_result{padding:var(--space-2);border-radius:var(--radius-card);background:var(--puzzle-ok-bg,#e5f5e0);color:var(--puzzle-ok-fg,#1c5d2a);margin:0}.gp_back{color:var(--color-blue-text);font:inherit;font-size:var(--text-small);cursor:pointer;background:0 0;border:0;align-self:flex-start;padding:0;text-decoration:underline}.gp_status{padding:var(--space-1) var(--space-2);border-radius:var(--radius-card);background:var(--color-surface-soft);color:var(--color-text-secondary);font-size:var(--text-small);margin:0}.gp_status.is-passed{background:var(--puzzle-ok-bg,#e5f5e0);color:var(--puzzle-ok-fg,#1c5d2a);font-weight:var(--primary-bold)}.gp_save_error{color:var(--puzzle-bad-fg,#a8201a)}.gp_result.is-failed{background:var(--puzzle-bad-bg,#fdecea);color:var(--puzzle-bad-fg,#a8201a)}.gp_wrap{gap:var(--space-3);max-width:none;padding:var(--space-4);background:linear-gradient(#fffaf0,#fff);border:0;border-radius:1.5rem;box-shadow:inset 0 0 0 2px #f0e6c8}.gp_hint{font-size:.9375rem}.gp_menu{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(18rem,1fr));display:grid}.gp_menu_item{--tone:#1368ce;--soft:#e3eefc;align-items:center;gap:var(--space-2) var(--space-3);padding:var(--space-3);border:2px solid var(--color-border);box-shadow:0 4px 0 var(--color-border);background:#fff;border-radius:1.25rem;grid-template-columns:auto 1fr;transition:transform .15s,box-shadow .15s;display:grid}.gp_menu_item:hover{box-shadow:0 8px 0 var(--color-border);transform:translateY(-3px)}.gp_menu_item[data-game=judge]{--tone:#c4520c;--soft:#fdeadd}.gp_menu_item[data-game=tiles]{--tone:#6a3fd3;--soft:#ece5fb}.gp_menu_item[data-game=error]{--tone:#e21b3c;--soft:#fde6ea}.gp_menu_item[data-game=sort]{--tone:#26890c;--soft:#e3f4dd}.gp_menu_item[data-game=detective]{--tone:#15171e;--soft:#eceef3}.gp_menu_item[data-game=gap]{--tone:#a87b00;--soft:#fdf3d3}.gp_menu_item[data-game=truth]{--tone:#0f7d6c;--soft:#dcf3ef}.gp_menu_item[data-game=match]{--tone:#1368ce;--soft:#e3eefc}.gp_menu_icon{background:var(--soft);border-radius:1rem;place-items:center;width:3.5rem;height:3.5rem;font-size:1.75rem;display:grid}.gp_menu_text{min-width:0}.gp_menu_title{font-size:1.1875rem;font-weight:800}.gp_start{padding:0 var(--space-3);text-align:center;background:var(--tone);color:#fff;min-height:3rem;font:inherit;cursor:pointer;border:0;border-radius:.875rem;grid-column:1/-1;justify-content:center;align-items:center;font-weight:800;transition:transform .1s,box-shadow .1s;display:flex;box-shadow:0 4px #00000038}.gp_start:hover{filter:brightness(1.08)}.gp_start:active{transform:translateY(3px);box-shadow:0 1px #00000038}.gp_start:focus-visible{outline:var(--outline-focus);outline-offset:3px}.gp_game{gap:var(--space-3);width:100%;max-width:46rem;margin-inline:auto}.gp_counter_wrap{align-items:center;gap:var(--space-2);display:flex}.gp_counter{color:var(--color-text-primary);flex:none;font-weight:800}.gp_progress{border-radius:var(--radius-pill);background:#efe7cf;flex:1;height:10px;overflow:hidden}.gp_progress span{border-radius:inherit;background:linear-gradient(90deg,#ffd84d,#ff9f1c);height:100%;transition:width .4s;display:block}.gp_lives{text-align:right;font-size:1.5rem}.gp_menu_title{margin:0}.gp_prompt{padding:var(--space-4) var(--space-4);border:2px solid var(--color-border);box-shadow:0 5px 0 var(--color-border);text-align:center;background:#fff;border-radius:1.25rem;font-size:clamp(1.25rem,3vw,1.75rem);font-weight:700;line-height:1.35;animation:.28s gp-pop}.gp_row .phr_option,.gp_lines .phr_option,.gp_col .phr_option{text-align:center;border:2px solid var(--color-border);min-height:3.5rem;box-shadow:0 4px 0 var(--color-border);background:#fff;border-radius:1rem;font-size:1.0625rem;font-weight:700;transition:transform .1s,box-shadow .1s,background .15s}.gp_row .phr_option:hover:not(:disabled),.gp_lines .phr_option:hover:not(:disabled),.gp_col .phr_option:hover:not(:disabled){background:var(--color-yellow-tile);transform:translateY(-2px)}.gp_row .phr_option:active:not(:disabled){box-shadow:0 1px 0 var(--color-border);transform:translateY(3px)}.gp_feedback{padding:var(--space-3);border-radius:1.25rem;font-size:1rem;animation:.3s gp-slide}.gp_feedback.is-right{box-shadow:inset 0 0 0 2px #7fcf6a}.gp_feedback.is-wrong{box-shadow:inset 0 0 0 2px #f0958f}.gp_tile{box-shadow:0 3px 0 var(--color-border);background:#fff;border-width:2px;border-radius:.875rem;padding:.65rem 1.1rem;font-weight:700;transition:transform .1s}.gp_tile:hover:not(:disabled){transform:translateY(-2px)}.gp_built{min-height:4rem;padding:var(--space-2);border:2px dashed var(--color-border-field);background:#fffdf5;border-radius:1rem}.gp_result{padding:var(--space-4);text-align:center;border-radius:1.25rem;font-size:1.125rem;animation:.35s gp-pop}.gp_back{margin-top:var(--space-1)}@keyframes gp-pop{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}@keyframes gp-slide{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.gp_prompt,.gp_feedback,.gp_result{animation:none}.gp_menu_item,.gp_start{transition:none}}.grammar-topic_explanation{max-width:var(--size-text-max)}.grammar-topic_explanation p{line-height:var(--line-height-relaxed)}.grammar-topic_explanation>h2{margin-block:var(--space-4) var(--space-2)}.grammar-topic_examples{gap:var(--space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.grammar-topic_examples li{gap:var(--space-1);padding:var(--space-2) var(--space-3);border-left:.25rem solid var(--color-brand-yellow);border-radius:var(--radius-card);background:var(--color-surface-soft);flex-direction:column;display:flex}.grammar-topic_examples span{color:var(--color-text-secondary)}}