:root{color:#182028;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f5f3ee;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}button,input{font:inherit}button{color:#182028;cursor:pointer;background:#fff;border:1px solid #c8d2d0;border-radius:8px}button:hover{border-color:#587772}button:focus-visible,input:focus-visible{outline-offset:2px;outline:3px solid #9bd4ca}button:disabled,input:disabled{cursor:not-allowed;opacity:.6}.shell{width:min(1180px,100%);min-height:100svh;margin:0 auto;padding:24px}.topbar{justify-content:space-between;align-items:end;gap:24px;padding-bottom:18px;display:flex}.eyebrow{color:#5f6b65;text-transform:uppercase;margin:0 0 4px;font-size:13px;font-weight:700}h1{letter-spacing:0;margin:0;font-size:34px;line-height:1.08}.stats{color:#32403d;flex-wrap:wrap;justify-content:flex-end;gap:8px;font-size:14px;display:flex}.stats span{background:#fff;border:1px solid #d7ded9;border-radius:8px;padding:6px 9px}.mode-switch{background:#e9eee9;border:1px solid #d7ded9;border-radius:10px;grid-template-columns:1fr 1fr;gap:4px;width:min(420px,100%);margin-bottom:16px;padding:4px;display:grid}.mode-switch button{background:0 0;border:0;border-radius:7px;padding:9px 8px;font-weight:700}.mode-switch .active{background:#fff;box-shadow:0 1px 2px #00000014}.workspace{display:block}.card{background:#fff;border:1px solid #d7ded9;border-radius:8px;grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);min-height:680px;display:grid;overflow:hidden;box-shadow:0 8px 28px #232f2a1a}.image-frame{background:#14201f;place-items:center;min-height:420px;display:grid}.image-frame img{object-fit:contain;width:100%;height:100%;max-height:760px;display:block}.practice{border-left:1px solid #d7ded9;flex-direction:column;gap:18px;padding:22px;display:flex}.question{color:#5f6b65;justify-content:space-between;align-items:center;gap:14px;font-weight:700;display:flex}.question button,.reveal-controls button,.quiz-form button{min-height:42px;padding:8px 12px;font-weight:800}.primary,.quiz-form button{color:#fff;background:#265f56;border-color:#265f56}.reveal-controls{grid-template-columns:1fr 1fr;gap:10px;display:grid}.reveal-controls .primary{grid-column:1/-1}.quiz-form{gap:12px;display:grid}.quiz-form label{color:#32403d;gap:6px;font-size:14px;font-weight:800;display:grid}.quiz-form input{color:#182028;background:#fff;border:1px solid #c8d2d0;border-radius:8px;width:100%;min-height:44px;padding:8px 10px}.answer{border-top:1px solid #d7ded9;gap:12px;margin-top:auto;padding-top:18px;display:grid}.answer div{gap:3px;display:grid}.label{color:#5f6b65;text-transform:uppercase;font-size:12px;font-weight:800}.answer strong{font-size:24px;line-height:1.15}.hints{gap:8px;margin:4px 0 0;padding:0;list-style:none;display:grid}.hints li{background:#f7faf8;border:1px solid #d7ded9;border-radius:8px;padding:8px 10px}.result{border-radius:8px;padding:10px 12px;font-weight:800}.result.good{color:#145634;background:#e5f5ec}.result.bad{color:#813522;background:#fbe9e4}@media (width<=920px){.shell{padding:14px}.topbar,.card{flex-direction:column;display:flex}.topbar{align-items:stretch}.stats{justify-content:flex-start}.card{min-height:0}.image-frame{min-height:300px}.practice{border-top:1px solid #d7ded9;border-left:0}}@media (width<=540px){h1{font-size:28px}.question{flex-direction:column;align-items:stretch}.reveal-controls{grid-template-columns:1fr}.reveal-controls .primary{grid-column:auto}}