:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--page:#080808;--sidebar:#191919;--surface-secondary:#1c1c1c;--surface-secondary-hover:#262626;--panel:#242424;--panel-strong:#363636;--divider:#ffffff1f;--text:#fff;--muted:#fff9;--muted-strong:#ffffffb3;--board-light:#f0d9b5;--board-dark:#b58863;--accent:#4f7f2d;--accent-strong:#5f9638;--card-hover-accent:#33e580;--accent-ink:#071006;--accent-soft:#4f7f2d33;--danger:#e56b5f;--motion-fast:.15s ease;--motion-normal:.22s ease;--page-pad:clamp(24px, 2.1vw, 40px);--catalog-gap:min(clamp(48px, 4.53vw, 87px), 7vh);--type-body-size:17px;--type-body-line:24px;--type-caption-size:15px;--type-caption-line:24px;--type-title-size:27px;--type-title-line:36px;--type-subtitle-size:19px;--type-subtitle-line:28px;--board-size:min(680px, 35.42vw, calc(100vh - 310px));font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:var(--page);min-width:320px;min-height:100vh;color:var(--text);margin:0}button{font:inherit}button,a{-webkit-tap-highlight-color:transparent}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.app-shell{background:var(--page);grid-template-columns:minmax(0,1fr);align-items:start;min-height:100vh;display:grid}.trainer-shell{position:relative}.trainer-workspace{grid-template-columns:485px minmax(0,1fr);gap:40px;min-height:100vh;padding-right:40px;display:grid}.content-page{min-width:0;min-height:100vh;padding:var(--page-pad);grid-column:1}.traps-page{align-content:start;gap:20px;display:grid}.page-header{max-width:none;margin:0 0 calc(var(--catalog-gap) - 20px);grid-template-columns:minmax(0,1fr) minmax(0,49.45%);align-items:center;gap:15px;display:grid}.page-kicker,.card-label,.trap-card-top,.trap-meta,.lesson-facts,.trap-progress span{color:var(--muted);font-size:var(--type-caption-size);line-height:var(--type-caption-line)}.page-header h1{color:var(--text);letter-spacing:0;margin:0;font-size:clamp(44px,3.54vw,68px);font-weight:400;line-height:normal}.page-header>p{max-width:100%;color:var(--muted);font-size:clamp(16px,.94vw,18px);line-height:var(--type-body-line);margin:0}.page-kicker{color:var(--muted);text-transform:uppercase;margin:0;font-size:clamp(14px,.83vw,16px);font-weight:400;line-height:32px;display:block}.trap-card{background:var(--surface-secondary);transition:border-color var(--motion-normal), background-color var(--motion-normal), box-shadow var(--motion-normal), opacity var(--motion-normal), transform var(--motion-normal);border:0;border-radius:6px}.trap-card h2{color:var(--text);letter-spacing:0;margin:0;font-size:clamp(22px,1.46vw,28px);font-weight:500;line-height:32px}.trap-card p{color:var(--muted);font-size:clamp(14px,.94vw,18px);line-height:var(--type-body-line);margin:0}.trap-copy{gap:16px;display:grid}.lesson-facts{flex-wrap:wrap;gap:6px;display:flex}.lesson-facts span,.filter-pill{background:#ffffff0d;border-radius:8px;align-items:center;min-height:30px;padding:3px 9px;display:inline-flex}.primary-action,.secondary-action,.text-action,.filter-pill{cursor:pointer;font-size:var(--type-body-size);line-height:var(--type-body-line);transition:background-color var(--motion-normal), border-color var(--motion-normal), color var(--motion-normal), opacity var(--motion-normal), transform var(--motion-fast);border:0}.primary-action,.secondary-action{border-radius:8px;min-height:42px;padding:0 16px}.primary-action{background:var(--accent);color:var(--accent-ink);font-weight:650;box-shadow:0 0 #8fa86a00}.primary-action:hover{background:var(--accent-strong);box-shadow:0 12px 32px #8fa86a38}.primary-action:active,.secondary-action:active,.text-action:active,.filter-pill:active,.reset-button:active,.segmented-tabs button:active{transform:scale(.98)}.secondary-action{background:var(--panel-strong);color:var(--text)}.secondary-action:hover,.text-action:hover,.reset-button:hover{color:var(--text);background:#242424}.text-action{color:var(--muted-strong);background:0 0}.section-block{gap:18px;display:grid}.section-heading{justify-content:space-between;align-items:center;gap:16px;display:flex}.section-heading h2{color:var(--text);font-size:var(--type-subtitle-size);font-weight:500;line-height:var(--type-subtitle-line);margin:0}.trap-card{outline:0;flex-direction:column;gap:min(clamp(24px,1.88vw,36px),5vh);min-width:0;min-height:min(clamp(420px,29.8vw,572px),57.1429vh - 107.429px);padding:20px;display:flex}.trap-card:not(.muted-card){cursor:pointer}.trap-card:not(.muted-card):hover{background:linear-gradient(#ffffff05, #ffffff05), var(--surface-secondary);transform:none}.trap-card:not(.muted-card):hover h2{color:var(--card-hover-accent)}.trap-card:not(.muted-card):hover .trap-specimen{color:#33e58057}.trap-card:not(.muted-card):hover .trap-progress div{background:0 0;border-color:#ffffff12}.muted-card:hover{opacity:1;background:0 0;border-color:#ffffff2e}.trap-card:focus-within{box-shadow:0 0 0 3px var(--accent-soft)}.muted-card{border:1px solid var(--divider);opacity:1;background:0 0}.muted-card h2{color:var(--muted)}.muted-card .trap-specimen{color:#ffffff4d}.catalog-controls{grid-template-columns:minmax(0,1fr) minmax(0,49.45%);align-items:start;gap:15px;display:grid}.catalog-toolbar{flex-wrap:wrap;gap:5px;margin-bottom:0;display:flex}.filter-pill{min-height:clamp(48px,2.92vw,56px);color:var(--text);text-transform:none;background:#ffffff0d;border:0;border-radius:6px;padding:0 20px;font-size:clamp(16px,1.04vw,20px);font-weight:400}.filter-pill:hover{background:var(--surface-secondary-hover);color:var(--text);border-color:#ffffff38}.filter-pill.active{color:#000;background:#fff}.filter-pill.active:hover{background:#f1f1f1}.catalog-search{background:var(--surface-secondary);min-width:0;min-height:clamp(48px,2.92vw,56px);color:var(--muted);transition:background-color var(--motion-normal), box-shadow var(--motion-normal);border-radius:6px;align-items:center;gap:10px;padding:0 20px;display:flex}.catalog-search:hover{background:var(--surface-secondary-hover)}.catalog-search:focus-within{box-shadow:none}.catalog-search span{border:2px solid;border-radius:999px;flex:none;width:18px;height:18px;position:relative}.catalog-search span:after{content:"";background:currentColor;border-radius:999px;width:7px;height:2px;position:absolute;bottom:-3px;right:-5px;transform:rotate(45deg)}.catalog-search input{width:100%;min-width:0;color:var(--text);font:inherit;background:0 0;border:0;outline:0;font-size:clamp(16px,1.04vw,20px);line-height:24px}.catalog-search input::placeholder{color:var(--muted)}.trap-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;display:grid}.empty-state{background:var(--surface-secondary);border-radius:6px;gap:8px;padding:32px;display:grid}.empty-state h2{color:var(--text);margin:0;font-size:24px;font-weight:550;line-height:32px}.empty-state p{color:var(--muted);font-size:var(--type-body-size);line-height:var(--type-body-line);margin:0}.site-footer{border-top:1px solid var(--divider);min-height:clamp(620px,36.4vw,700px);color:var(--muted);grid-template-rows:1fr auto;gap:0;margin-top:clamp(64px,7vw,134px);padding:0;display:grid;position:relative}.subscribe-section{grid-template-columns:minmax(0,1fr);align-content:center;justify-items:center;gap:24px;padding:clamp(72px,8vw,154px) 0;display:grid}.subscribe-copy{width:min(100%,860px);display:grid}.subscribe-copy h2{color:#ffffffc7;letter-spacing:0;margin:0;font-size:clamp(17px,1.15vw,22px);font-weight:400;line-height:1.22}.subscribe-form{gap:16px;width:min(100%,860px);display:grid}.subscribe-row{grid-template-columns:minmax(0,1fr) minmax(180px,230px);gap:22px;display:grid}.subscribe-row label{min-width:0}.subscribe-row input{background:var(--surface-secondary);width:100%;height:clamp(48px,2.92vw,56px);color:var(--text);font:inherit;transition:background-color var(--motion-normal), box-shadow var(--motion-normal);border:0;border-radius:6px;outline:0;padding:0 20px;font-size:clamp(16px,1.04vw,20px);font-weight:400;line-height:24px}.subscribe-row input::placeholder{color:#ffffff85}.subscribe-row input:hover{background:var(--surface-secondary-hover)}.subscribe-row input:disabled{cursor:wait;opacity:.72}.subscribe-row input:-webkit-autofill{-webkit-text-fill-color:var(--text);caret-color:var(--text);box-shadow:0 0 0 1000px var(--surface-secondary) inset;transition:background-color 9999s ease-out}.subscribe-row input:-webkit-autofill:hover{-webkit-text-fill-color:var(--text);caret-color:var(--text);box-shadow:0 0 0 1000px var(--surface-secondary) inset;transition:background-color 9999s ease-out}.subscribe-row input:-webkit-autofill:focus{-webkit-text-fill-color:var(--text);caret-color:var(--text);box-shadow:0 0 0 1000px var(--surface-secondary) inset;transition:background-color 9999s ease-out}.subscribe-row button{color:#ffffff9e;cursor:pointer;height:clamp(48px,2.92vw,56px);transition:background-color var(--motion-normal), color var(--motion-normal), transform var(--motion-fast);background:#ffffff0d;border:0;border-radius:999px;padding:0 24px;font-size:clamp(16px,1.04vw,20px);font-weight:400;line-height:24px}.subscribe-row button:hover{color:var(--text);background:linear-gradient(#ffffff05,#ffffff05),#ffffff0d}.subscribe-row button:disabled{cursor:wait;opacity:.72}.subscribe-row button:active{transform:scale(.98)}.subscribe-form p,.subscribe-form strong{color:#ffffff7a;max-width:710px;font-size:var(--type-caption-size);margin:0;font-weight:400;line-height:1.18}.subscribe-form strong{color:var(--card-hover-accent)}.subscribe-form .subscribe-error{color:#ff8f8f}.footer-legal{gap:28px;max-width:900px;padding-bottom:34px;display:grid}.footer-legal p,.footer-legal span{color:#ffffff7a;font-size:var(--type-caption-size);margin:0;font-weight:400;line-height:1.18}.footer-legal div{flex-wrap:wrap;gap:18px 46px;display:flex}.footer-floating{align-content:space-between;justify-items:end;display:grid;position:absolute;top:34px;bottom:34px;right:0}.footer-up{color:var(--text);transition:background-color var(--motion-normal), color var(--motion-normal), transform var(--motion-fast);cursor:pointer;background:#202020;border:0;border-radius:999px;width:56px;height:56px;position:relative}.footer-up:before{content:"";border-top:2px solid;border-left:2px solid;width:12px;height:12px;position:absolute;top:23px;left:22px;transform:rotate(45deg)}.developer-link{color:#ffffff7a;min-height:auto;font-size:var(--type-caption-size);transition:color var(--motion-normal);background:0 0;align-items:center;gap:8px;padding:0;font-weight:400;line-height:1.18;text-decoration:none;display:inline-flex}.developer-link:before{content:"";clip-path:polygon(8% 47%,92% 12%,75% 90%,50% 65%,36% 80%,38% 58%);background:currentColor;flex:none;width:18px;height:18px;display:inline-block}.developer-link:hover{color:var(--card-hover-accent)}.developer-link:active{color:#33e580b3}.footer-up:hover{color:var(--text);background:linear-gradient(#ffffff05,#ffffff05),#202020}.footer-up:active{transform:scale(.96)}.trap-card-top,.trap-meta{flex-wrap:wrap;justify-content:space-between;gap:8px;display:flex}.trap-meta{color:var(--muted);justify-content:flex-start;margin-top:auto;font-size:13px;line-height:20px}.trap-card-top{text-transform:uppercase}.card-label{background:#ffffff0d;border-radius:999px;align-items:center;min-height:22px;padding:0 8px;display:inline-flex}.trap-specimen{color:#ffffff80;white-space:nowrap;min-height:clamp(58px,4.06vw,78px);transition:color var(--motion-normal), transform var(--motion-normal);align-items:center;font-size:clamp(58px,4.06vw,78px);font-weight:700;line-height:1;display:flex;overflow:hidden}.trap-card:not(.muted-card) .trap-specimen{color:#ffffff80}.trap-progress{grid-template-columns:1fr;gap:0;margin-top:0;display:grid}.trap-progress div{border:0;border-bottom:1px solid var(--divider);min-width:0;transition:border-color var(--motion-normal), background-color var(--motion-normal);background:0 0;border-radius:0;justify-content:space-between;align-items:center;gap:12px;padding:18px 0;display:flex}.trap-progress div:last-child{border-bottom:0}.trap-progress strong{min-width:0;color:var(--text);font-size:clamp(15px,.94vw,18px);font-weight:400;line-height:var(--type-body-line);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.lesson-main{align-content:start;gap:40px;min-width:0;padding-top:46px;display:grid}.lesson-header{max-width:100%;display:block}.lesson-header h1{color:var(--text);letter-spacing:0;margin:0;font-size:clamp(48px,3.54vw,68px);font-weight:400;line-height:normal}.board-caption,.status-card p,.feedback span,.move-list p{color:var(--muted);margin:0;line-height:24px}.board-caption{text-align:center;max-width:min(100%,620px);font-size:18px}.trainer-panel .status-card p,.trainer-panel .feedback span,.trainer-panel .move-list p{font-size:var(--type-caption-size);line-height:20px}.trainer-actions{justify-content:space-between;align-items:flex-start;gap:24px;margin-top:-20px;display:flex}.trainer-action-stack{gap:8px;display:grid}.board-column{justify-content:center;justify-items:center;gap:20px;min-width:0;margin-top:-26px;display:grid}.board-frame{width:var(--board-size);max-width:100%}.board-frame>div{max-width:100%}.trainer-panel{background:var(--sidebar);flex-direction:column;justify-content:space-between;gap:40px;width:100%;min-width:0;min-height:100vh;padding:40px 40px 20px;display:flex}.trainer-panel-main{gap:40px;display:grid}.trainer-stack{gap:8px;display:grid}.reset-button,.step-indicator{background:var(--panel);min-height:36px;color:var(--text);font-size:var(--type-caption-size);font-weight:400;line-height:var(--type-body-line);border:0;border-radius:8px;padding:0 15px}.reset-button{cursor:pointer;transition:background-color var(--motion-normal), color var(--motion-normal), transform var(--motion-fast)}.back-to-catalog{align-items:center;gap:8px;display:inline-flex}.back-to-catalog:before{content:"←";font-size:17px;line-height:1}.reset-button.primary{color:#000;background:#fff}.reset-button.primary:hover{color:#000;background:#f1f1f1}.step-indicator{color:var(--muted);background:0 0;align-items:center;font-size:18px;display:inline-flex}.status-card,.info-card{background:var(--panel);border-radius:16px;padding:24px}.status-card h2{color:var(--text);font-size:var(--type-title-size);font-weight:500;line-height:var(--type-title-line);letter-spacing:0;margin:0 0 12px}.phase-label{min-height:24px;color:var(--muted-strong);background:#ffffff0f;border-radius:999px;align-items:center;margin-bottom:12px;padding:0 10px;font-size:13px;line-height:20px;display:inline-flex}.phase-label.user-turn{color:#33e580db;background:#33e5801a}.phase-label.opponent-turn{color:#e8b748e6;background:#e8b7481f}.phase-label.mistake{color:#e56b5fe6;background:#e56b5f1f}.phase-label.completed{color:#33e580db;background:#33e5801a}.info-card{gap:24px;display:grid}.completion-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px;display:grid}.completion-stats div{border:1px solid var(--panel-strong);background:0 0;border-radius:12px;gap:2px;min-width:0;padding:12px;display:grid}.completion-stats span{color:var(--muted);font-size:13px;line-height:18px}.completion-stats strong{color:var(--text);font-size:18px;font-weight:500;line-height:24px}.completion-action{color:#000;cursor:pointer;min-height:36px;font-size:var(--type-caption-size);line-height:var(--type-body-line);transition:background-color var(--motion-normal), transform var(--motion-fast);background:#fff;border:0;border-radius:8px;justify-self:start;margin-top:4px;padding:0 15px}.completion-action:hover{background:#f1f1f1}.completion-action:active{transform:scale(.98)}.segmented-tabs{background:var(--page);border-radius:10px;width:100%;padding:2px;display:flex}.mode-tabs{background:var(--page)}.segmented-tabs button{min-width:0;color:var(--muted-strong);cursor:pointer;font-size:var(--type-body-size);font-weight:400;line-height:var(--type-body-line);transition:background-color var(--motion-normal), color var(--motion-normal), opacity var(--motion-normal), transform var(--motion-fast);background:0 0;border:0;border-radius:8px;flex:1;padding:6px 15px}.segmented-tabs button.active{background:var(--panel);color:var(--text)}.segmented-tabs button:not(.active):not(:disabled):hover{color:var(--text)}.segmented-tabs button:disabled{cursor:not-allowed;opacity:.45}.feedback{gap:6px;display:grid}.feedback p{color:var(--muted);font-size:var(--type-caption-size);line-height:var(--type-body-line);margin:8px 0 0}.feedback strong{color:var(--text);font-size:var(--type-subtitle-size);font-weight:500;line-height:var(--type-subtitle-line)}.feedback.wrong strong,.feedback.illegal strong{color:var(--danger)}.feedback.success strong,.feedback.idea strong{color:var(--text)}.feedback.completed>strong{color:#33e580db}.feedback.completed>span{color:#33e5808f}.feedback.completed p{color:var(--muted);font-size:var(--type-caption-size);line-height:var(--type-body-line)}.metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:auto;display:grid}.metrics div{border:1px solid var(--panel-strong);border-radius:16px;align-content:start;gap:2px;min-width:0;padding:16px 24px;display:grid}.metrics div:last-child{grid-column:1/-1}.metrics span{color:var(--muted);font-size:var(--type-caption-size);line-height:var(--type-caption-line)}.metrics strong{color:var(--text);font-size:var(--type-subtitle-size);font-weight:500;line-height:var(--type-subtitle-line)}.metrics div:last-child strong{text-overflow:ellipsis;white-space:nowrap;min-width:0;display:block;overflow:hidden}.move-list{background:0 0;margin-top:0;padding:24px}.move-list h3{color:var(--text);font-size:var(--type-subtitle-size);font-weight:400;line-height:var(--type-body-line);margin:0 0 20px}.move-flow{flex-wrap:wrap;align-items:flex-start;gap:4px;width:100%;display:flex}.move-chip{color:#fff6;white-space:nowrap;min-height:24px;transition:background-color var(--motion-normal), color var(--motion-normal), transform var(--motion-fast);background:0 0;border-radius:6px;justify-content:center;align-items:center;padding:0;font-size:16px;line-height:24px;display:inline-flex}.move-chip:hover{color:var(--muted-strong);background:0 0;transform:translateY(-1px)}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}@media (width<=1180px){.trap-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width>=1101px) and (width<=1500px){.trainer-workspace{grid-template-columns:clamp(384px,28vw,430px) minmax(0,1fr);gap:32px;padding-right:32px}.trainer-panel{padding-left:32px;padding-right:32px}.lesson-main{gap:32px}.lesson-header{max-width:none}}@media (width<=1100px){.app-shell,.trainer-shell{grid-template-columns:1fr}.trainer-workspace{grid-column:1;grid-template-columns:1fr;gap:0;padding-right:0;display:grid}.content-page{grid-column:1;padding:28px 18px 40px}.page-header,.catalog-controls{grid-template-columns:1fr}.trainer-panel{order:2;width:auto;min-height:auto;padding:28px 18px 32px}.lesson-main{order:1;width:auto;padding:28px 18px 32px}.lesson-header h1{font-size:40px}.trainer-actions,.board-column{margin-top:0}.board-frame{width:min(100%,600px)}.page-header h1{font-size:44px}.trap-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.site-footer{min-height:auto;padding-bottom:24px}.subscribe-row{grid-template-columns:1fr;gap:14px}.subscribe-row button{justify-self:start;min-width:min(100%,300px)}.footer-floating{justify-content:space-between;align-items:center;margin-top:24px;display:flex;position:static}.trainer-panel-main{gap:28px}}@media (width<=560px){.trainer-panel{padding-top:28px}.lesson-header h1{font-size:34px}.page-header h1{font-size:34px;line-height:1.02}.board-caption,.page-header p,.trap-card p,.status-card p,.feedback span,.move-list p,.segmented-tabs button{font-size:16px}.status-card,.info-card{border-radius:14px;padding:18px}.move-list{padding:18px}.metrics{grid-template-columns:1fr}.trap-card{min-height:auto;padding:18px}.trap-progress{grid-template-columns:1fr}.site-footer{gap:0}.subscribe-section{gap:22px;padding:56px 0 64px}.subscribe-copy h2{font-size:18px}.subscribe-row input,.subscribe-row button{border-radius:6px;height:56px;font-size:16px}.subscribe-form p,.subscribe-form strong{font-size:16px}.footer-legal{padding-bottom:0}.footer-up{width:48px;height:48px}.footer-up:before{width:10px;height:10px;top:20px;left:19px}.trap-specimen{min-height:84px;font-size:58px}}@media (width<=760px){.trap-grid{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.trap-card:not(.muted-card):hover,.trap-card:not(.muted-card):hover .trap-specimen,.move-chip:hover{transform:none}}