:root{--ok-bg:#f5f8ff;--ok-text:#172653;--ok-muted:#445476;--ok-line:#b8c9e8;--ok-surface:#eaf1ff;--ok-accent:#253a82;--ok-accent-text:#fff;--ok-good:#e7f6ec;--ok-good-line:#1e7a3c;--ok-bad:#fdecec;--ok-bad-line:#b3261e;--ok-focus:#1b5bd6;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}body{background:radial-gradient(circle at 50% -180px, #ccecff 0, var(--ok-bg) 470px);color:var(--ok-text);-webkit-text-size-adjust:100%;margin:0;font:19px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}.ok-app{max-width:560px;min-height:100vh;padding:20px 16px calc(32px + env(safe-area-inset-bottom));margin:0 auto}.ok-center{text-align:center;flex-direction:column;justify-content:center;gap:12px;min-height:60vh;display:flex}.ok-title{letter-spacing:-.025em;margin:8px 0 12px;font-size:28px;line-height:1.2}.ok-text{margin:0 0 12px}.ok-strong{font-weight:700}.ok-caption{color:var(--ok-muted);margin:0 0 8px;font-size:17px}.ok-note{border:1px solid var(--ok-line);background:var(--ok-surface);border-radius:16px;padding:12px 14px}.ok-question{overflow-wrap:anywhere;margin:8px 0 16px;font-size:24px;font-weight:700;line-height:1.3}.ok-wrong{text-decoration:line-through;-webkit-text-decoration-color:var(--ok-bad-line);text-decoration-color:var(--ok-bad-line)}.ok-stack{flex-direction:column;gap:12px;margin:16px 0;display:flex}.ok-button{border:2px solid var(--ok-line);width:100%;min-height:56px;color:var(--ok-text);font:inherit;text-align:left;cursor:pointer;background:#fff;border-radius:18px;flex-direction:column;justify-content:center;align-items:flex-start;padding:14px 18px;font-weight:600;text-decoration:none;transition:transform .14s,box-shadow .14s,border-color .14s;display:flex;box-shadow:0 4px #dce5f6}.ok-button:hover:not(:disabled){border-color:var(--ok-accent)}.ok-button:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px #dce5f6}.ok-primary{border-color:var(--ok-accent);background:var(--ok-accent);color:var(--ok-accent-text);text-align:center;align-items:center;box-shadow:0 4px #14245d}.ok-primary:active:not(:disabled){box-shadow:0 1px #14245d}.ok-selected{border-color:var(--ok-focus);background:#dbeaff}.ok-button:disabled{opacity:.55;cursor:default}.ok-sub{color:inherit;opacity:.85;margin-top:2px;font-size:16px;font-weight:400}.ok-link{min-height:44px;color:var(--ok-focus);font:inherit;cursor:pointer;background:0 0;border:0;padding:8px 0;text-decoration:underline}.ok-button:focus-visible,.ok-link:focus-visible,.ok-chip:focus-visible,.ok-input:focus-visible{outline:3px solid var(--ok-focus);outline-offset:2px}.ok-input{border:2px solid var(--ok-line);width:100%;min-height:56px;color:var(--ok-text);font:inherit;background:#fff;border-radius:16px;padding:12px 14px}.ok-textarea{resize:vertical}.ok-lesson-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.ok-progress{width:100%;height:15px;accent-color:var(--ok-accent);border-radius:99px;margin:4px 0 14px;overflow:hidden}.ok-progress::-webkit-progress-bar{background:#dce8fb;border-radius:99px}.ok-progress::-webkit-progress-value{background:#4eafe9;border-radius:99px}.ok-progress::-moz-progress-bar{background:#4eafe9;border-radius:99px}.ok-feedback{border:2px solid var(--ok-line);background:var(--ok-surface);border-radius:20px;margin:16px 0;padding:16px}.ok-good{border-color:var(--ok-good-line);background:var(--ok-good)}.ok-bad{border-color:var(--ok-bad-line);background:var(--ok-bad)}.ok-ai{white-space:pre-line}.ok-built,.ok-chips{border-radius:12px;flex-wrap:wrap;gap:10px;min-height:60px;margin:0 0 12px;padding:8px;display:flex}.ok-built{border:2px dashed var(--ok-line)}.ok-placeholder{color:var(--ok-muted);align-self:center}.ok-chip{border:2px solid var(--ok-line);min-width:48px;min-height:48px;color:var(--ok-text);font:inherit;cursor:pointer;background:#fff;border-radius:14px;padding:8px 14px;font-weight:600}.ok-chip-used{border-color:var(--ok-focus);background:#dbeaff}.ok-visual{isolation:isolate;background:linear-gradient(135deg,#e0f2ff 0%,#d9e5ff 65%,#ecf4ff 100%);border:1px solid #c9dcf8;border-radius:26px;place-items:center;width:100%;height:158px;margin:0 0 16px;display:grid;position:relative;overflow:hidden}.ok-visual img{z-index:2;object-fit:contain;filter:drop-shadow(0 10px 10px #3668af38);width:144px;height:144px;position:relative}.ok-orbit,.ok-visual-tile{pointer-events:none;display:block;position:absolute}.ok-orbit{border:2px solid #ffffffa8;border-radius:50%;width:250px;height:250px}.ok-orbit-one{top:-143px;left:-78px}.ok-orbit-two{bottom:-177px;right:-82px}.ok-visual-tile{background:#fff9;border:2px solid #fff;border-radius:11px;width:53px;height:37px;transform:rotate(-12deg);box-shadow:0 8px 18px #385b9820}.ok-visual-tile-one{top:29%;left:14%}.ok-visual-tile-two{bottom:24%;right:12%;transform:rotate(12deg)}.ok-visual-home{background:linear-gradient(125deg,#d8f1ff,#d9e7ff 72%)}.ok-visual-home img{transform:translateY(16px)rotate(-7deg)}.ok-visual-welcome{background:linear-gradient(125deg,#e6f5ff,#e2e9ff);height:134px}.ok-visual-welcome img{width:125px;height:125px;transform:translateY(12px)}.ok-visual-success{background:linear-gradient(125deg,#dcf8ec,#d9ecff)}.ok-visual-success img{transform:translateY(15px)rotate(8deg)}.ok-visual-success .ok-visual-tile{background:#fff2a7}.ok-visual-retry{background:linear-gradient(125deg,#fff0e8,#e8ecff)}.ok-visual-retry img{transform:translateY(20px)rotate(-9deg)}.ok-visual-pro{background:linear-gradient(125deg,#1c2c6d,#455cab);border-color:#344791;height:126px}.ok-visual-pro img{width:118px;height:118px;transform:translateY(9px)}.ok-visual-pro .ok-visual-tile{background:#ffe3a4;border-color:#fff1d1}.ok-center .ok-visual{flex:none}.ok-center .ok-stack{width:100%}@media (width>=700px){.ok-app{padding-top:32px}.ok-visual{height:190px}.ok-visual img{width:170px;height:170px}.ok-visual-welcome,.ok-visual-pro{height:155px}}.ok-list{margin:0 0 12px;padding-left:22px}.ok-plan{border:2px solid var(--ok-line);background:var(--ok-surface);border-radius:20px;gap:8px;padding:16px;display:grid}.ok-plan .ok-caption{margin:0}.ok-practice-grid{gap:12px;margin-top:12px;display:grid}.ok-practice-card{border:2px solid var(--ok-line);background:var(--ok-surface);text-align:left;font:inherit;color:inherit;cursor:pointer;border-radius:20px;grid-template-columns:96px 1fr;align-items:center;gap:12px;padding:10px;display:grid}.ok-practice-card img{object-fit:cover;border-radius:14px;width:96px;height:72px}.ok-practice-card:hover{border-color:var(--ok-accent)}.ok-practice-card:focus-visible{outline:3px solid var(--ok-accent);outline-offset:2px}.ok-practice-locked img{filter:grayscale(.6);opacity:.75}.ok-practice-body{gap:4px;display:grid}.ok-practice-body .ok-caption{margin:0}.ok-practice-badge{background:#e3f6ec;border-radius:999px;justify-self:start;padding:2px 10px;font-size:13px}.ok-practice-badge-locked{background:#fff2c2}.ok-practice-image{object-fit:cover;border-radius:20px;width:100%;max-height:260px;margin:8px 0}.ok-practice-audio{width:100%;margin:8px 0}.ok-practice-text blockquote{border-left:4px solid var(--ok-accent);background:var(--ok-surface);border-radius:10px;margin:8px 0;padding:10px 14px}.ok-options-grid,.ok-options-row{display:grid}.ok-options-grid{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}.ok-options-row{grid-template-columns:1fr 1fr}.ok-practice-right{background:#e3f6ec;border-color:#3fae6a}.ok-practice-faded{opacity:.55}.ok-stat-grid{grid-template-columns:1fr 1fr;gap:10px;margin:12px 0;display:grid}.ok-stat{border:2px solid var(--ok-line);background:var(--ok-surface);border-radius:16px;gap:2px;padding:12px;display:grid}.ok-stat .ok-caption{margin:0}.ok-stat-list,.ok-top{gap:6px;margin:0 0 12px;padding:0;list-style:none;display:grid}.ok-stat-list li,.ok-top li{background:var(--ok-surface);border-radius:12px;justify-content:space-between;gap:10px;padding:8px 12px;display:flex}.ok-top li{align-items:center}.ok-top-place{width:24px;font-weight:700}.ok-top-name{overflow-wrap:anywhere;flex:1}.ok-top-me{outline:2px solid var(--ok-accent)}.ok-toggle{align-items:center;gap:10px;min-height:44px;display:flex}.ok-toggle input{width:22px;height:22px}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
