.ob-body{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}.ob-bar{display:flex;justify-content:center;padding:18px 16px 6px}.ob-bar a{text-decoration:none}.ob-main{flex:1;display:flex;justify-content:center;padding:16px 16px 48px}.ob-screen,.ob-card{width:100%;max-width:34rem;display:flex;flex-direction:column;gap:14px}.ob-screen h1,.ob-card h1{font-size:1.7rem;line-height:1.25;text-wrap:balance}.ob-screen h1:focus{outline:none}.ob-sub{margin-top:-4px!important}.ob-step{font-family:var(--font-mono);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--text-muted)}.ob-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.ob-options{border:0;margin:6px 0 4px;padding:0;display:flex;flex-direction:column;gap:10px}.ob-option{position:relative;display:flex;align-items:center;gap:14px;min-height:3.6rem;padding:12px 16px;border:1.5px solid var(--border-strong);border-radius:12px;background:var(--surface-card);cursor:pointer}.ob-option:hover{background:var(--surface-sunken)}.ob-option.on{border:2.5px solid var(--brand-strong);background:var(--brand-tint);padding:11px 15px}.ob-option input{position:absolute;opacity:0;width:1px;height:1px}.ob-option:has(input:focus-visible){box-shadow:var(--ac-ring)}.ob-option-text{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.ob-option-text b{font-family:var(--font-display);font-size:1.1rem;color:var(--text-strong)}.ob-option-text .ac-muted{font-size:.95rem}.ob-picked{display:inline-flex;align-items:center;gap:4px;font-weight:600;font-size:.9rem;color:var(--brand-strong)}.ob-go{width:100%}.ob-link{align-self:center;background:none;border:0;padding:10px 8px;min-height:2.75rem;font:inherit;font-size:.95rem;color:var(--text-link);text-decoration:underline;text-underline-offset:3px;cursor:pointer;text-align:center}.ob-back{align-self:flex-start;display:inline-flex;align-items:center;gap:4px;background:none;border:0;padding:8px 6px 8px 0;min-height:2.75rem;font:inherit;font-weight:600;color:var(--text-link);cursor:pointer}.ob-card{background:var(--surface-card);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-sm);padding:28px 24px}.ob-badge{width:3rem;height:3rem;border-radius:50%;display:grid;place-items:center;background:var(--brand-tint);color:var(--brand-strong)}.ob-badge .ai{width:1.6rem;height:1.6rem;stroke-width:2.5}.ob-spin{width:2.4rem;height:2.4rem;border-radius:50%;border:4px solid var(--border);border-top-color:var(--brand-strong);animation:ob-spin .9s linear infinite}@keyframes ob-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.ob-spin{animation-duration:3s}}.ob-google,.dark .ob-google{background:var(--surface-card)!important;color:var(--text-strong)!important;border:1.5px solid var(--border-strong)}.ob-google:hover,.dark .ob-google:hover{background:var(--surface-sunken)!important}.ob-or{display:flex;align-items:center;gap:10px;color:var(--text-muted);font-size:.9rem}.ob-or:before,.ob-or:after{content:"";flex:1;height:1px;background:var(--border)}.ob-field{display:flex;flex-direction:column;gap:6px;font-weight:600}.ob-field input[type=text],.ob-field input[type=email]{min-height:3.1rem;padding:0 14px;border:1.5px solid var(--border-strong);border-radius:10px;font:inherit;font-weight:400;background:var(--surface-card);color:var(--text-body)}.ob-field input:focus{outline:none;border-color:var(--brand);box-shadow:var(--ac-ring)}.ob-field input[readonly]{background:var(--surface-sunken)}.ob-code{letter-spacing:.4em;font-family:var(--font-mono)!important;font-size:1.3rem!important;text-align:center}.ob-check{display:flex;align-items:flex-start;gap:12px;min-height:2.75rem;font-size:.95rem;cursor:pointer}.ob-check input{width:1.4rem;height:1.4rem;margin-top:2px;flex:none;accent-color:var(--brand-strong)}.ob-note{font-size:.9rem}.ob-error{color:var(--coral-700, #b42318);font-weight:600}.ob-mock{display:flex;flex-wrap:wrap;gap:4px 10px;font-family:var(--font-mono);font-size:.75rem;color:var(--text-muted);border:1px dashed var(--border-strong);border-radius:8px;padding:8px 10px}.ob-mock a{overflow-wrap:anywhere}.ob-photo{display:flex;align-items:center;gap:16px;margin-top:4px}.ob-avatar{width:4.5rem;height:4.5rem;border-radius:50%;flex:none;object-fit:cover;display:grid;place-items:center;background:var(--brand-tint);color:var(--brand-strong);font-family:var(--font-display);font-weight:700;font-size:1.9rem;border:1.5px solid var(--border)}.ob-photo-acts{display:flex;flex-direction:column;align-items:flex-start;gap:2px}.ob-photo-btn{position:relative;cursor:pointer}.ob-photo-btn:has(input:focus-visible){box-shadow:var(--ac-ring)}.ob-link--left{align-self:flex-start;padding-left:0}.ob-field small{font-weight:400;font-size:.9rem}.ob-last{margin-top:-6px!important;font-size:.9rem;font-weight:600;color:var(--brand-strong);text-align:center}.ob-legacy{background:var(--brand-tint);border:1.5px solid var(--border);border-radius:12px;padding:12px 14px;display:grid;gap:6px}.ob-legacy p{margin:0}.ob-main{align-items:flex-start;padding-bottom:32px}.ob-shell{width:min(1040px,100%);margin:auto 0;display:flex;background:var(--surface-card);border:1px solid var(--border);border-radius:20px;overflow:hidden;box-shadow:var(--shadow-sm)}.ob-shell--solo{width:min(560px,100%)}.ob-pane{width:520px;flex:none;box-sizing:border-box;padding:40px 44px;display:flex;flex-direction:column}.ob-shell--solo .ob-pane{width:100%}.ob-pane .ob-screen{max-width:none;gap:16px}.ob-pane .ob-screen h1{font-size:2rem;line-height:1.2;margin:0}.ob-pane .ob-label{color:var(--brand-strong);margin-bottom:-6px}.ob-pane .ob-sub{margin:-4px 0 0!important;font-size:1rem;line-height:1.5;color:var(--text-body)}.ob-pane .ob-go,.ob-pane .ob-field input[type=email],.ob-pane .ob-field input[type=text]{min-height:52px;border-radius:12px;font-size:1.02rem}.ob-aside{flex:1;min-width:0;box-sizing:border-box;padding:40px;display:flex;flex-direction:column;justify-content:center;gap:20px;background:var(--brand-tint);border-left:1px solid var(--green-200);color:var(--text-strong)}.dark .ob-aside{border-left-color:#1c5a43}.ob-aside h2{margin:0;font-size:1.4rem;line-height:1.3;color:var(--brand-deep);text-wrap:balance}.dark .ob-aside h2{color:var(--green-300)}.ob-aside .ac-label{color:var(--brand-strong)}@media(max-width:899px){.ob-shell{flex-direction:column}.ob-pane{width:auto;padding:28px 22px}.ob-aside{border-left:0;border-top:1px solid var(--green-200);padding:24px 22px}}.ob-body [tabindex="-1"]:focus,.ob-body [tabindex="-1"]:focus-visible{outline:none;box-shadow:none}.ob-points{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;font-size:1rem;line-height:1.45}.ob-points li{display:flex;align-items:flex-start;gap:10px}.ob-tick{flex:none;width:18px;height:18px;margin-top:3px;fill:none;stroke:var(--brand-strong);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.ob-aside-box{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border-radius:12px;background:var(--surface-card);border:1px solid var(--border-strong);font-size:.92rem;line-height:1.5;color:var(--text-body)}.ob-aside-box b{color:var(--text-strong)}.ob-aside-label{font-family:var(--font-mono);font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}.app-body .ob-aside-box code{font-family:var(--font-mono);font-weight:600;letter-spacing:.12em;color:var(--text-strong);background:none;padding:0}.ob-tips{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;counter-reset:ob;font-size:1rem;line-height:1.45}.ob-tips li{display:flex;align-items:flex-start;gap:12px;counter-increment:ob}.ob-tips li:before{content:counter(ob);flex:none;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--surface-card);border:1px solid var(--green-200);color:var(--brand-strong);font-family:var(--font-mono);font-size:.8rem;font-weight:600}.ob-sheet{background:var(--surface-card);border:1px solid var(--border-strong);border-radius:12px;overflow:hidden;font-family:var(--font-mono);font-size:.84rem;color:var(--text-strong)}.ob-sheet-fx{display:flex;align-items:center;gap:10px;padding:9px 12px;border-bottom:1px solid var(--border);background:var(--surface-muted)}.ob-sheet-fx i{color:var(--text-muted)}.ob-sheet-grid{display:grid;grid-template-columns:36px minmax(0,1fr) minmax(0,1fr)}.ob-sheet-grid span{padding:6px 10px;border-right:1px solid var(--border);border-bottom:1px solid var(--border);white-space:nowrap;min-height:1.2em}.ob-sheet-grid .hd{background:var(--surface-muted);color:var(--text-muted);text-align:center;font-size:.75rem}.ob-sheet-grid .b{font-weight:600}.ob-sheet-grid .num{text-align:right}.ob-sheet-grid .ans{text-align:right;font-weight:600;background:var(--brand-tint);color:var(--brand-deep);outline:2px solid var(--brand-strong);outline-offset:-2px}.dark .ob-sheet-grid .ans{color:var(--green-300)}.ob-lesson{display:flex;background:var(--surface-card);border:1px solid var(--border-strong);border-radius:14px;overflow:hidden}.ob-lesson>div{flex:1;min-width:0;padding:18px 20px;display:flex;flex-direction:column;gap:6px}.ob-lesson>div .ac-label{color:var(--text-muted)}.ob-lesson b{font-family:var(--font-display);font-size:1.25rem;line-height:1.25;text-wrap:balance}.ob-lesson>div>span:last-child{font-size:.9rem;color:var(--text-body)}.ob-lesson-n{width:110px;flex:none;display:flex;align-items:flex-end;padding:14px;box-sizing:border-box;background:var(--brand-strong);color:#fff;font-family:var(--font-sans);font-weight:700;font-size:1.75rem}.ob-callout{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:var(--brand-tint);border:1px solid var(--green-200);color:var(--brand-deep);font-size:.95rem;line-height:1.45}.dark .ob-callout{border-color:#1c5a43;color:var(--green-300)}.ob-callout-tick{flex:none;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--brand-strong)}.ob-callout-tick .ob-tick{width:16px;height:16px;margin:0;stroke:#fff}.ob-callout:has(.ob-callout-tick){font-weight:700;font-size:1.02rem}.ob-callout--strong{font-weight:700;font-size:1.02rem}.ob-callout--code code{flex:none;font-family:var(--font-mono);font-weight:600;font-size:.95rem;letter-spacing:.08em;padding:7px 10px;border-radius:8px;background:var(--surface-card);border:1px dashed var(--brand-strong);color:var(--brand-deep)}.dark .ob-callout--code code{color:var(--green-300)}.ob-last-tag{margin-left:4px;padding:2px 9px;border-radius:99px;font-family:var(--font-mono);font-size:.68rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;background:var(--brand-tint);border:1px solid var(--green-200);color:var(--brand-deep)}.ac-btn:not(.ob-google) .ob-last-tag{background:#ffffff2e;border-color:#ffffff80;color:#fff}.dark .ob-last-tag{border-color:#1c5a43;color:var(--green-300)}.ob-google--last,.dark .ob-google--last{border:2px solid var(--brand-strong)!important}.ob-codeform{display:contents}.ob-pane .ob-field label{font-weight:600}.ob-otp{position:relative;height:68px}.ob-pane .ob-field .ob-otp input.ob-otp-input,.ob-otp input.ob-otp-input{position:absolute;min-height:0;border-radius:12px;box-shadow:none;inset:0;z-index:1;width:100%;height:100%;box-sizing:border-box;margin:0;padding:0;border:0;background:transparent;color:transparent;caret-color:transparent;font-size:1px;letter-spacing:0}.ob-otp-input::selection{background:transparent}.ob-pane .ob-field .ob-otp input.ob-otp-input:focus,.ob-otp input.ob-otp-input:focus{outline:none;box-shadow:none;border:0}.ob-otp-boxes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;height:100%}.ob-otp-boxes span{display:flex;align-items:center;justify-content:center;border-radius:12px;border:1.5px solid var(--border-strong);background:var(--surface-card);font-family:var(--font-mono);font-size:1.85rem;font-weight:600;color:var(--text-strong)}.ob-otp-boxes span.on{border-color:var(--brand-strong)}.ob-otp:focus-within .ob-otp-boxes span.next{border:2px solid var(--brand-strong);box-shadow:0 0 0 4px var(--green-200)}.dark .ob-otp:focus-within .ob-otp-boxes span.next{box-shadow:0 0 0 4px #1c5a43}.ob-otp:has(.ob-otp-input[aria-invalid=true]) .ob-otp-boxes span{border-color:#d84a33}.ob-field small{color:var(--text-muted)}.ob-resend{margin:0;display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:.92rem;color:var(--text-body)}.ob-resend small{margin-left:auto;font-size:.85rem;color:var(--text-muted)}.ob-inline{border:0;background:none;padding:0;min-height:2rem;font:inherit;font-weight:700;color:var(--text-link);text-decoration:underline;text-underline-offset:3px;cursor:pointer}.ob-inline:disabled{opacity:.6;cursor:default}.ob-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:.92rem}.ob-foot .ob-zoom{align-self:auto;padding:0;min-height:2rem;font-size:.88rem;color:var(--text-muted)}.ob-badge--solid{width:3.25rem;height:3.25rem;background:var(--brand-strong);color:#fff}.ob-paid .ob-go .ai{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}.ob-next{display:flex;align-items:flex-start;gap:12px;padding-top:16px;border-top:1px solid var(--border);font-size:.9rem;line-height:1.5;color:var(--text-body)}.ob-next>span{flex:1}.ob-next b{color:var(--text-strong)}.ob-next .ob-inline{flex:none;white-space:nowrap;min-height:0;text-decoration:none}
