:root{--background: #fafafa;--section-bg: #ffffff;--light-grey: #e5e5e5;--grey: #d2d2d2;--dark-grey: #acaaab;--super-dark-grey: #959595;--button-blue: #6b9be7;--button-shadow-blue: #4f82bf;--green: #52cc66;--dark-green: #34a84d;--orange: #ff9500;--dark-orange: #db7f00;--red: #ff4b4c;--dark-red: #d73a3b;--super-light-blue: #deebfe;--board-min-size-default: 260px;--board-height-offset-default: 240px;--board-width-default: min(100%, max(var(--board-min-size-default), calc(100dvh - var(--board-height-offset-default))));--deck-browser-max-height-offset-default: 240px;--deck-lines-max-height-offset-default: 380px;--deck-board-min-size-default: 240px;--deck-board-height-offset-default: 380px;--study-gap-default: 10px;--study-topbar-gap-default: 16px;--study-learn-panel-gap-default: 14px;--study-learn-panel-right-default: -28px;font-family:Quicksand,Avenir Next,Segoe UI,sans-serif;color:#111;background:var(--background)}*{box-sizing:border-box}body{margin:0;min-height:100vh}a{color:inherit;text-decoration:none}.page{min-height:100vh;display:flex;flex-direction:column}.header{display:flex;flex-direction:column;background:var(--section-bg)}.header-main{display:grid;grid-template-columns:minmax(56px,1fr) minmax(0,4fr) minmax(56px,1fr);align-items:center;padding:6px 10px;border-bottom:1px solid var(--grey)}.header-side{min-width:56px;display:flex;align-items:center}.header-left{justify-content:flex-start}.header-right{justify-content:flex-end}.content{flex:1;padding:16px;max-width:900px;width:100%;margin:0 auto}.content-wide{max-width:min(1400px,calc(100vw - 24px))}.deck-screen{--deck-browser-max-height-offset: var(--deck-browser-max-height-offset-default);--deck-lines-max-height-offset: var(--deck-lines-max-height-offset-default);--deck-board-min-size: var(--deck-board-min-size-default);--deck-board-height-offset: var(--deck-board-height-offset-default);--deck-board-width: min(100%, max(var(--deck-board-min-size), calc(100dvh - var(--deck-board-height-offset))));height:100dvh;max-height:100dvh;overflow:hidden;display:flex;flex-direction:column;gap:8px}.deck-back{align-self:flex-start;margin-bottom:2px}.screen-back{margin-bottom:8px}.deck-screen h2{margin:0}.deck-screen .row.gap-sm{flex-wrap:wrap}.study-screen{display:flex;flex-direction:column;gap:var(--study-gap-default)}.study-topbar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:var(--study-topbar-gap-default)}.study-progress{width:100%}.study-status{min-width:56px;text-align:right;font-weight:700}.study-title{width:var(--board-width-default);margin:0 auto}.study-main-layout{position:relative;min-height:1px}.study-main-column{min-width:0}.study-learn-panel{position:absolute;right:var(--study-learn-panel-right-default);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--study-learn-panel-gap-default);padding-left:0}.study-learn-btn{min-height:44px;padding:12px 20px}@media(max-width:1120px){.study-main-layout{position:static;gap:10px}.study-learn-panel{position:static;transform:none;justify-content:flex-start;margin:0 auto;padding-left:0}}.trainer-controls-wide{justify-content:space-between}.trainer-controls-wrap{max-width:100%;margin:8px auto 0}.form{max-width:560px;margin:0 auto;display:flex;flex-direction:column;gap:12px;padding:18px}.input,.textarea,.select{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--grey);background:var(--light-grey);font-size:1rem;font-family:Quicksand,Avenir Next,Segoe UI,sans-serif}.add-card-title-input{display:block;width:var(--board-width-default);max-width:100%;margin:0 auto 14px;padding:2px 0;border:0;background:transparent;color:#111;font-size:2rem;font-weight:700;line-height:1.15;outline:none;box-shadow:none;font-family:Quicksand,Avenir Next,Segoe UI,sans-serif}.add-card-title-input::placeholder{color:var(--dark-grey)}.board-panel-layout,.add-card-layout{display:grid;grid-template-columns:minmax(260px,1fr) minmax(240px,1fr);gap:16px;align-items:start}.board-panel-board-column,.board-panel-side-column,.add-card-board-column,.add-card-moves-column{min-width:0}.add-card-board-controls{max-width:100%;margin:8px auto 0}.add-card-board-column{display:flex;flex-direction:column}.add-card-controls{width:100%;display:grid;grid-template-columns:minmax(44px,auto) minmax(0,1fr) minmax(88px,auto);align-items:center;gap:12px}.add-card-step-buttons{justify-content:center;gap:10px}.add-card-color-btn{justify-self:flex-start}.add-card-controls .btn{justify-self:flex-end}.add-card-actions{display:inline-flex;align-items:center;justify-content:flex-end;gap:8px}.add-card-moves-title{margin:6px 0 8px;text-align:left}.add-card-moves{max-height:min(72dvh,720px);overflow-y:auto;padding-right:4px}.add-card-moves p{margin-top:0;white-space:pre-wrap;overflow-wrap:anywhere}.add-card-both-colors{gap:8px;width:var(--board-width-default);max-width:100%;margin:12px auto 0}@media(max-width:980px){.board-panel-layout,.add-card-layout{grid-template-columns:1fr}.add-card-moves{max-height:none;padding-right:0}}.textarea{min-height:120px}.btn{border-radius:12px;padding:10px 16px;background:var(--button-blue);color:#fff;font-weight:700;cursor:pointer;border:0;border-left:1px solid var(--button-shadow-blue);border-right:1px solid var(--button-shadow-blue);border-bottom:5px solid var(--button-shadow-blue);transition:transform .08s ease;font-family:Quicksand,Avenir Next,Segoe UI,sans-serif;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:active{transform:translateY(1px)}.btn.selected{background:var(--super-light-blue);color:#111;border-color:var(--button-blue)}.btn.secondary{background:#fff;color:#111;border-color:var(--grey)}.btn.again{background:var(--red);border-left-color:var(--dark-red);border-right-color:var(--dark-red);border-bottom-color:var(--dark-red)}.btn.hard{background:var(--orange);border-left-color:var(--dark-orange);border-right-color:var(--dark-orange);border-bottom-color:var(--dark-orange)}.btn.good{background:var(--green);border-left-color:var(--dark-green);border-right-color:var(--dark-green);border-bottom-color:var(--dark-green)}.btn.easy{background:var(--button-blue);border-left-color:var(--button-shadow-blue);border-right-color:var(--button-shadow-blue);border-bottom-color:var(--button-shadow-blue)}.deck-card{width:100%;text-align:left;border:2px solid var(--grey);border-bottom-width:5px;border-radius:14px;padding:14px;background:var(--section-bg);display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;cursor:pointer}.deck-card h3{margin:0 0 4px}.deck-card p{margin:0;color:var(--super-dark-grey)}.header-nav{background:var(--section-bg);padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.header-nav a{text-align:center;padding:5px 4px;border-radius:999px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-size:.75rem}.footer-icon{font-size:.9rem;line-height:1;display:inline-flex}.header-nav a.active{background:var(--super-light-blue);color:#111}.padded{padding:8px 16px}.progress{width:100%;border-radius:999px;background:var(--light-grey);overflow:hidden;height:10px}.progress-spaced{margin-bottom:12px}.progress-fill{height:100%;background:var(--green)}.muted{color:var(--dark-grey)}.error{color:var(--red)}.ok{color:var(--green)}.loading,.center{min-height:60vh;display:flex;align-items:center;justify-content:center;flex-direction:column}.green{color:var(--green)}.row{display:flex;align-items:center}.space-between{justify-content:space-between}.gap-sm{gap:8px}.response-row{width:var(--board-width-default);margin:0 auto;justify-content:space-between;gap:0}.response-row .btn{flex:0 0 20%;max-width:20%;justify-content:center;padding-left:0;padding-right:0}.mt-sm{margin-top:8px}.stack{display:flex;flex-direction:column;gap:10px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;width:100%}.list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}.search-row{display:grid;grid-template-columns:auto 1fr auto;gap:8px;margin-bottom:12px;align-items:center}.icon-btn{border:0;background:transparent;display:inline-flex;align-items:center;justify-content:center;padding:4px;cursor:pointer}.icon-btn:disabled{cursor:not-allowed;opacity:.55}.step-control-btn:disabled,.hint-btn:disabled{opacity:1}.step-hit-zone{flex:1 1 0;min-height:38px;padding:0}.step-buttons{display:flex;align-items:center;gap:8px}.study-step-buttons{gap:10px}.trainer-controls-wide .hint-btn.step-hit-zone{justify-content:flex-start}.study-controls-large .step-hit-zone{min-height:46px}.study-controls-large .hint-btn.step-hit-zone{flex:1 1 auto}.study-controls-large .step-control-btn.step-hit-zone{flex:0 0 28%}.study-controls-large .step-control-btn svg,.study-controls-large .hint-btn svg{width:26px;height:26px}.rank-row{padding:8px 0}.rank-number{width:22px;display:inline-block;color:var(--super-dark-grey)}.deck-browser{margin-top:20px;padding:12px;border:2px solid var(--grey);border-bottom-width:5px;border-radius:12px;background:var(--section-bg)}.deck-screen .deck-browser{margin-top:8px;min-height:0;max-height:calc(100dvh - var(--deck-browser-max-height-offset));overflow:hidden;display:flex;flex-direction:column}.deck-screen .deck-browser-layout{align-items:start}.deck-screen .deck-browser-board{min-height:0;display:flex;flex-direction:column}.deck-browser-board-controls{max-width:100%;margin:8px auto 0;display:flex;justify-content:flex-start}.deck-browser-board-controls .row{width:100%;justify-content:flex-start}.deck-browser-board,.deck-browser-lines{min-width:0}.deck-browser-title{width:var(--board-width-default);margin:6px auto 8px}.deck-screen .deck-browser-title{width:var(--deck-board-width)}.deck-lines-title{margin:6px 0 8px;text-align:left}.deck-browser-lines{max-height:min(72dvh,720px);overflow-y:auto;padding-right:4px}.deck-screen .deck-browser-lines{height:auto;max-height:max(240px,calc(100dvh - var(--deck-lines-max-height-offset)));min-height:0;overflow-y:auto;overscroll-behavior:contain}.board-wrap{position:relative;width:var(--board-width-default);margin:0 auto}.deck-screen .board-wrap{width:var(--deck-board-width)}@media(max-width:980px){.deck-screen .deck-browser{--deck-browser-max-height-offset: 220px;--deck-board-min-size: 220px;--deck-board-height-offset: 470px}.deck-screen .deck-browser-layout{height:100%;min-height:0;grid-template-rows:auto minmax(0,1fr);overflow:hidden}.deck-screen .deck-browser-board{grid-row:1}.deck-screen .deck-browser-lines{grid-row:2;height:100%;max-height:100%;min-height:0;overflow-y:auto;padding-right:0}.deck-screen .board-wrap{width:var(--deck-board-width)}}.arrow-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:10}.square-hints-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:22}.move-feedback{position:absolute;width:20px;height:20px;border-radius:30px;display:inline-flex;align-items:center;justify-content:center;pointer-events:none;z-index:15;opacity:0;animation:feedback-fade .6s ease-out forwards}.move-feedback.right{background:#4cd964}.move-feedback.wrong{background:#ff3b30}.tick{width:15px;height:10px;position:relative}.tick-line-short{position:absolute;height:1.5px;width:5px;background:#fff;bottom:3px;left:2px;border-radius:1px;transform:rotate(45deg)}.tick-line-long{position:absolute;height:1.5px;width:10px;background:#fff;bottom:4px;right:0;border-radius:1px;transform:rotate(-45deg)}.cross{width:10px;height:10px;position:relative}.cross-line-1,.cross-line-2{position:absolute;height:1.333px;width:10px;background:#fff;border-radius:.667px;top:4.333px}.cross-line-1{transform:rotate(45deg)}.cross-line-2{transform:rotate(-45deg)}@keyframes feedback-fade{0%{opacity:0}50%{opacity:1}66.666%{opacity:1}to{opacity:0}}.onboarding{max-width:760px;margin:0 auto;padding:24px 16px;display:flex;flex-direction:column;gap:14px}.prose p,.prose h3{margin-top:0}@media(max-width:640px){.content,.form,.onboarding{padding:12px}.study-main-layout{position:static;gap:10px}.study-learn-panel{position:static;transform:none;justify-content:flex-start;margin:0 auto;padding-left:0}}