/* Problem sheet and interview concept notes. */
.pfilter{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:color-mix(in srgb,var(--panel) 82%,transparent)}
.seg button{background:none;border:0;padding:8px 14px;cursor:pointer;color:var(--muted);font-weight:500}
.seg button+button{border-left:1px solid var(--line)}
.seg button.on{background:var(--b1);color:var(--on-cat);font-weight:600}
.wrapseg{display:flex;flex-wrap:wrap;border:0;background:none;gap:8px;overflow:visible}
.wrapseg button,.wrapseg button+button{border:1px solid var(--line);border-radius:99px;background:color-mix(in srgb,var(--panel) 82%,transparent)}
.wrapseg button.on{background:var(--cat);border-color:var(--cat)}
#p-pat{padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--panel)}
#p-list{display:grid;gap:10px}
.pgroup{font:700 18px var(--display);margin:18px 0 2px;display:flex;align-items:center;gap:9px}
.pgroup::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--cat)}
.prob{border:1px solid var(--line);border-left:3px solid var(--cat);border-radius:12px;background:color-mix(in srgb,var(--panel) 82%,transparent)}
.prob summary{display:flex;align-items:center;gap:12px;padding:12px 14px;cursor:pointer;list-style:none}
.prob summary::-webkit-details-marker{display:none}
.prob summary strong{flex:1;min-width:0;font-weight:600}
.prob summary input{accent-color:var(--ok);width:17px;height:17px;flex:none}
.prob.done summary strong{color:var(--muted);text-decoration:line-through}
.diff{font:600 11px var(--mono);border-radius:99px;padding:3px 9px;border:1px solid;flex:none}
.diff.E{color:var(--ok)}.diff.M{color:var(--cmp)}.diff.H{color:var(--bad)}
.pbody{padding:0 14px 14px 43px;display:grid;gap:8px;max-width:72ch}
.pbody p{margin:0}
.pbody .cx{font:12.5px var(--mono);color:var(--muted)}
.pbody .cta{margin-top:4px}
a.btn{text-decoration:none;display:inline-block;color:var(--ink)}
.note{border:1px solid var(--line);border-top:3px solid var(--cat);border-radius:14px;padding:18px 20px;background:color-mix(in srgb,var(--panel) 82%,transparent)}
.note h3{font:700 19px var(--display);margin:0 0 4px}
.note>p{margin:0 0 10px;color:var(--muted);max-width:70ch}
.note ul{margin:0;padding-left:18px;display:grid;gap:6px;max-width:72ch}
.note .ask{margin-top:14px;padding:10px 12px;border-radius:10px;background:color-mix(in srgb,var(--cat) 10%,transparent);border:1px solid color-mix(in srgb,var(--cat) 35%,transparent);max-width:72ch}
.note .ask b{display:block;font:600 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb,var(--cat) 75%,var(--ink));margin-bottom:2px}
.duo{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.duo .tile{padding:22px}
.duo .tile strong{font-size:21px}
#rel{margin-top:14px}
#rel a{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none}
#rel a:hover{color:var(--b1)}
#rel a span{font:12px var(--mono);color:var(--muted)}
@media (max-width:520px){.pbody{padding-left:14px}}

/* Short C# code-reading practice */
#drill-card{max-width:900px;margin-top:18px}
.drill-card{border:1px solid var(--line);border-top:3px solid var(--c13);border-radius:16px;padding:20px;background:color-mix(in srgb,var(--panel) 88%,transparent)}
.drill-head,.drill-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}
.drill-count{font:12px var(--mono);color:var(--muted)}
.drill-card h2{font:700 22px var(--display);margin:20px 0 12px}
.drill-code{margin:0 0 14px;overflow:auto}
.drill-options{display:grid;gap:9px}
.drill-option{display:flex;align-items:center;gap:12px;text-align:left;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--ink);cursor:pointer}
.drill-option:hover:not(:disabled){border-color:var(--c13);transform:translateY(-1px)}
.drill-option b{font:600 12px var(--mono);color:var(--muted);flex:none}
.drill-option.correct{border-color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,var(--panel))}
.drill-option.wrong{border-color:var(--bad);background:color-mix(in srgb,var(--bad) 10%,var(--panel))}
.drill-option:disabled{cursor:default}
.drill-feedback{margin-top:14px;padding:13px 15px;border-radius:10px;border:1px solid var(--line)}
.drill-feedback.correct{border-color:color-mix(in srgb,var(--ok) 55%,var(--line));background:color-mix(in srgb,var(--ok) 8%,var(--panel))}
.drill-feedback.wrong{border-color:color-mix(in srgb,var(--bad) 55%,var(--line));background:color-mix(in srgb,var(--bad) 7%,var(--panel))}
.drill-feedback strong{font:700 14px var(--display)}
.drill-feedback p{margin:6px 0 0;max-width:72ch}
.drill-feedback .btn{margin-top:10px}
.drill-actions{justify-content:flex-end;margin-top:16px}
@media(max-width:520px){.drill-card{padding:15px}.drill-card h2{font-size:19px}.drill-head{align-items:flex-start;flex-direction:column}}

/* Browser-based C# problem solving */
#solve-area{max-width:1180px}
.solve-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:12px}
.solve-card{display:grid;gap:10px;text-align:left;padding:18px;border:1px solid var(--line);border-top:3px solid var(--c13);border-radius:12px;background:color-mix(in srgb,var(--panel) 88%,transparent);color:var(--ink);cursor:pointer}
.solve-card:hover{border-color:var(--c13);transform:translateY(-2px)}
.solve-card strong{font:700 20px var(--display)}
.solve-card>span:not(.diff),.solve-card small{color:var(--muted)}
.solve-card small{font:12px var(--mono)}
.solve-card em{font-style:normal;color:var(--c13);font-weight:600}
.solve-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.solve-signature{font:12px var(--mono);color:var(--muted)}
.solve-layout{display:grid;grid-template-columns:minmax(245px,.7fr) minmax(0,1.3fr);gap:16px;align-items:start}
.solve-prompt,.solve-work{min-width:0;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--panel) 88%,transparent)}
.solve-prompt{padding:18px}
.solve-tags{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.solve-prompt h2{font:700 24px var(--display);margin:15px 0 8px}
.solve-prompt>p{margin:0 0 12px;max-width:65ch}
.solve-prompt .cx{font:12px var(--mono);color:var(--muted)}
.solve-cases{margin-top:18px;border-top:1px solid var(--line);padding-top:12px}
.solve-cases summary{cursor:pointer;font-weight:600}
.solve-example{display:grid;gap:4px;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}
.solve-example code,.solve-hint code,.solve-signature{font-family:var(--mono)}
.solve-example small{color:var(--muted)}
.solve-note{margin-top:14px!important;padding:10px 12px;border:1px solid color-mix(in srgb,var(--c13) 35%,var(--line));border-radius:8px;background:color-mix(in srgb,var(--c13) 7%,var(--panel));font-size:12px;color:var(--muted)}
.solve-work{overflow:hidden}
.solve-toolbar{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding:10px;border-bottom:1px solid var(--line)}
.solve-toolbar>span:first-child{margin-right:auto;font:600 12px var(--mono);color:var(--muted)}
.solution-code{display:block;width:100%;min-height:440px;resize:vertical;border:0;border-radius:0;padding:16px;background:var(--code-bg);color:var(--ink);font:13px/1.65 var(--mono);tab-size:4;white-space:pre;overflow:auto}
.solve-hint{margin:0;padding:8px 12px;font-size:12px;color:var(--muted)}
.solve-result{margin:10px 12px 14px;padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--panel);font-size:13px;overflow-wrap:anywhere}
.solve-result>strong{font:700 14px var(--display)}
.solve-result>p{margin:6px 0}
.solve-result.pass{border-color:color-mix(in srgb,var(--ok) 55%,var(--line));background:color-mix(in srgb,var(--ok) 7%,var(--panel))}
.solve-result.fail{border-color:color-mix(in srgb,var(--bad) 50%,var(--line));background:color-mix(in srgb,var(--bad) 6%,var(--panel))}
.case-results{display:grid;gap:7px;margin-top:10px}
.case-row{display:grid;gap:3px;padding:8px 10px;border:1px solid var(--line);border-radius:7px;background:var(--panel)}
.case-row.pass b{color:var(--ok)}.case-row.fail b{color:var(--bad)}
.case-row span{font:12px/1.5 var(--mono);color:var(--muted)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#runner-host{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:850px){.solve-layout{grid-template-columns:minmax(0,1fr)}.solution-code{min-height:360px}}
@media(max-width:520px){.solve-prompt{padding:14px}.solve-toolbar .btn{padding:6px 8px;font-size:12px}.solution-code{min-height:320px;font-size:12px}}
.account-dialog{width:min(560px,calc(100vw - 28px));max-width:none;padding:20px;border:1px solid var(--line);border-radius:14px;background:var(--panel);color:var(--ink);box-shadow:0 24px 90px #0009}
.account-dialog::backdrop{background:#080604bb;backdrop-filter:blur(3px)}
.account-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.account-dialog-head h2{margin:0;font:700 22px var(--display)}
.account-form{display:grid;gap:12px;margin-top:14px}
.account-form label{display:grid;gap:6px;color:var(--muted);font-size:13px}
.account-form input{width:100%;padding:10px 11px;border:1px solid var(--line);border-radius:8px;background:var(--stage);color:var(--ink);font:inherit}
.account-form button,#account-signout{width:100%;justify-content:center}
.account-message{margin:12px 0 0;color:var(--muted);font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.account-message.error{color:var(--bad)}
.solve-save-status{margin-left:auto;color:var(--muted);font-size:11px;white-space:nowrap}
.solve-toolbar>.solve-save-status{margin:0}
.solve-result pre{margin:10px 0 0;padding:10px;border-radius:7px;background:var(--code-bg);font:12px/1.5 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere}


/* Sign-in card: guests see what an account unlocks */
.account-gate{display:none}
.account-dialog.guest .account-gate{display:block}
.account-dialog.guest .account-dialog-head{justify-content:flex-end}
.account-dialog.guest .account-dialog-head h2{display:none}
.account-dialog.guest .gate-title{margin-top:4px}
.lockic{margin-left:auto;font-size:11px;opacity:.7}
.gate-brand{display:inline-block;font:800 22px var(--display);color:var(--ink);background:none;border:0;padding:0}
.gate-title{margin:14px 0 6px;font:700 24px/1.2 var(--display)}
.gate-lead{margin:0;color:var(--muted);font-size:14px;line-height:1.5}
.gate-list{margin:12px 0 2px;padding-left:18px;color:var(--muted);font-size:13px;line-height:1.7}
.gh-btn{display:flex;align-items:center;justify-content:center;gap:8px}
.gh-btn svg{width:18px;height:18px;flex:none}
.gh-btn[hidden],.or-sep[hidden]{display:none}
.or-sep{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px}
.or-sep::before,.or-sep::after{content:"";flex:1;height:1px;background:var(--line)}
.account-note{margin:2px 0 0;color:var(--muted);font-size:12px;text-align:center}
.account-note a{color:var(--accent)}
a.navlk{text-decoration:none}

.account-dashboard{display:grid;gap:16px;margin-top:12px}
.account-profile{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--stage)}
.account-avatar{display:grid;place-items:center;width:44px;height:44px;flex:none;border-radius:50%;background:var(--accent);color:var(--ink);font:700 18px var(--display)}
.account-profile-copy{display:grid;min-width:0;gap:2px}
.account-profile-copy strong{font:700 16px var(--display);overflow-wrap:anywhere}
.account-email,.account-provider{color:var(--muted);font-size:12px;overflow-wrap:anywhere}
.account-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.account-stat{display:grid;gap:4px;padding:12px 10px;border:1px solid var(--line);border-radius:9px;background:var(--panel);text-align:center}
.account-stat strong{font:700 20px var(--display);color:var(--accent)}
.account-stat span{font-size:11px;color:var(--muted)}
.account-actions{display:flex;gap:8px;flex-wrap:wrap}
.account-actions button{flex:1 1 120px}
.account-actions #account-continue{flex-basis:100%}
#account-dashboard[hidden]{display:none}
@media(max-width:480px){.account-dialog{padding:16px}.account-stats{gap:6px}.account-stat{padding:10px 5px}.account-stat span{font-size:10px}}

/* Concepts: index + detail */
#c-tabs small{opacity:.65;font:600 11px var(--mono);margin-left:3px}
.c-layout{display:grid;grid-template-columns:minmax(250px,310px) minmax(0,1fr);gap:20px;align-items:start;margin-top:18px}
.c-index,.c-detail{min-width:0;border:1px solid var(--line);border-radius:16px;background:color-mix(in srgb,var(--panel) 92%,transparent)}
.c-index{position:sticky;top:86px;display:grid;gap:2px;padding:10px;max-height:calc(100vh - 110px);overflow:auto}
.c-index-head{display:grid;gap:4px;padding:6px 8px 10px;margin-bottom:4px;border-bottom:1px solid var(--line)}
.c-index-label{margin:0;font:600 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb,var(--cat) 70%,var(--ink))}
.c-index-head span{font-size:12px;color:var(--muted)}
.c-index-head .bar{display:block;height:4px;border-radius:99px;background:color-mix(in srgb,var(--cat) 15%,transparent);overflow:hidden}
.c-index-head .bar b{display:block;height:100%;background:var(--cat);border-radius:99px;transition:width .3s}
.c-item{display:grid;grid-template-columns:28px 1fr;gap:8px;align-items:start;width:100%;padding:9px 8px;text-align:left;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--ink);cursor:pointer}
.c-item:hover,.c-item.active{background:color-mix(in srgb,var(--cat) 11%,var(--panel));border-color:color-mix(in srgb,var(--cat) 40%,var(--line))}
.c-item>b{display:grid;place-items:center;width:24px;height:24px;border-radius:7px;font:600 10px var(--mono);color:var(--muted);background:color-mix(in srgb,var(--line) 50%,transparent)}
.c-item.ok>b{color:var(--on-cat,#111);background:var(--ok);font-size:12px}
.c-item span{display:grid;gap:3px;min-width:0}
.c-item strong{font:600 14px/1.3 var(--display)}
.c-item small{font-size:12px;line-height:1.4;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.c-detail{padding:26px 30px 22px;border-top:3px solid var(--cat);outline:none;background:linear-gradient(180deg,color-mix(in srgb,var(--cat) 7%,var(--panel)) 0,color-mix(in srgb,var(--panel) 94%,transparent) 220px)}
.c-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.c-time{font:600 11px var(--mono);color:var(--muted)}
.c-detail h2{font:800 30px/1.15 var(--display);margin:10px 0 8px;letter-spacing:-.01em}
.c-detail h3{font:600 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb,var(--cat) 65%,var(--muted));margin:0 0 12px}
.c-lead{font-size:18px;line-height:1.5;margin:0;max-width:62ch}
.c-why{margin-top:16px;padding:12px 16px;border-radius:12px;background:color-mix(in srgb,var(--cat) 9%,transparent);border-left:3px solid var(--cat)}
.c-why b{font:600 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb,var(--cat) 75%,var(--ink))}
.c-why p{margin:4px 0 0;line-height:1.55;max-width:70ch}
.c-jump{display:flex;gap:6px;flex-wrap:wrap;margin:18px 0 6px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.c-jump button{border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:99px;padding:5px 11px;font-size:12px;cursor:pointer}
.c-jump button:hover{color:var(--ink);border-color:var(--cat)}
.c-sec{margin-top:24px;scroll-margin-top:90px}
.c-points{margin:0;padding:0;list-style:none;counter-reset:pt;display:grid;gap:10px;max-width:72ch}
.c-points li{counter-increment:pt;display:grid;grid-template-columns:28px 1fr;gap:10px;line-height:1.55}
.c-points li::before{content:counter(pt);display:grid;place-items:center;width:24px;height:24px;border-radius:7px;font:600 12px var(--mono);background:color-mix(in srgb,var(--cat) 16%,transparent);color:color-mix(in srgb,var(--cat) 70%,var(--ink))}
.c-ex{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:color-mix(in srgb,var(--panel) 70%,transparent)}
.c-ex-title{margin:0;padding:10px 14px;font:600 14px var(--display);border-bottom:1px solid var(--line)}
.c-code-bar{display:flex;justify-content:space-between;align-items:center;padding:6px 10px 6px 14px;font:600 11px var(--mono);color:var(--muted);letter-spacing:.06em}
.c-code .code{border:0;border-radius:0;border-top:1px solid var(--line);font-size:12.5px}
.c-steps{margin:0;padding:14px 16px 14px 14px;list-style:none;counter-reset:st;display:grid;gap:0}
.c-steps li{counter-increment:st;position:relative;padding:0 0 14px 38px;line-height:1.55}
.c-steps li::before{content:counter(st);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font:600 12px var(--mono);background:var(--cat);color:var(--on-cat,#111)}
.c-steps li::after{content:"";position:absolute;left:12px;top:28px;bottom:2px;width:2px;background:color-mix(in srgb,var(--cat) 30%,transparent)}
.c-steps li:last-child{padding-bottom:0}.c-steps li:last-child::after{display:none}
.c-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
.c-table{width:100%;border-collapse:collapse;font-size:14px;min-width:460px}
.c-table th,.c-table td{padding:9px 12px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);line-height:1.45}
.c-table thead th{font:600 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:color-mix(in srgb,var(--cat) 7%,transparent)}
.c-table tbody th{font-weight:600;white-space:nowrap}
.c-table tr:last-child>*{border-bottom:0}
.c-mistakes{margin:0;padding:0;list-style:none;display:grid;gap:8px;max-width:72ch}
.c-mistakes li{position:relative;padding:9px 12px 9px 36px;border-radius:10px;background:color-mix(in srgb,var(--bad) 8%,transparent);border:1px solid color-mix(in srgb,var(--bad) 25%,transparent);line-height:1.5}
.c-mistakes li::before{content:"!";position:absolute;left:11px;top:9px;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;font:700 11px var(--mono);background:var(--bad);color:#fff}
.c-ask{padding:16px 18px;border-radius:14px;background:color-mix(in srgb,var(--cat) 9%,transparent);border:1px solid color-mix(in srgb,var(--cat) 35%,transparent)}
.c-ask>b{display:block;font:600 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb,var(--cat) 75%,var(--ink))}
.c-ask>p{margin:6px 0 12px;font:700 18px/1.4 var(--display)}
.c-answer{margin:0 0 14px}
.c-answer summary{cursor:pointer;font-weight:600;color:var(--ink)}
.c-answer ol{margin:10px 0 0;padding-left:22px;display:grid;gap:6px;line-height:1.5}
.c-done-row{margin-top:20px}
.c-done-row .btn.ok{border-color:var(--ok);color:var(--ok)}
.c-pager{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.c-pager .btn{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.c-back{display:none}
@media(max-width:900px){
  .c-layout{grid-template-columns:minmax(0,1fr)}
  .c-index{position:static;max-height:none}
  .c-layout.has-detail .c-index{display:none}
  .c-back{display:inline-flex;margin-bottom:10px}
  .c-detail{padding:18px 16px}
  .c-detail h2{font-size:24px}
  .c-lead{font-size:16px}
  .c-ask>p{font-size:16px}
  .c-steps li{padding-left:34px}
}

/* AI mock interview */
.ai-setup{display:grid;gap:12px;max-width:980px}
.ai-h{font:600 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:10px 0 0}
.ai-topics{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.ai-topic{display:grid;gap:4px;text-align:left;padding:14px 16px;border:1px solid var(--line);border-top:3px solid var(--cat);border-radius:12px;background:var(--panel);color:var(--ink);cursor:pointer}
.ai-topic:hover{background:color-mix(in srgb,var(--cat) 8%,var(--panel))}
.ai-topic.on{border-color:var(--cat);background:color-mix(in srgb,var(--cat) 14%,var(--panel));box-shadow:0 0 0 1px var(--cat)}
.ai-topic strong{font:700 17px var(--display)}
.ai-topic span{font-size:13px;color:var(--muted);line-height:1.4}
.ai-topic em{font:600 11px var(--mono);font-style:normal;color:var(--ok)}
.seg button small{opacity:.6;font-size:11px;margin-left:3px}
.ai-go{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:8px}
.ai-go span{color:var(--muted);font-size:13px}
.ai-note{color:var(--muted);font-size:12px;margin:4px 0 0}
.ai-err{color:var(--bad);font-size:14px;margin:8px 0 0;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ai-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 14px;border:1px solid var(--line);border-radius:12px;background:var(--panel);max-width:860px;font-size:14px}
.ai-bar .mk-dots{flex:1}
.ai-thread{display:grid;gap:14px;max-width:860px;margin-top:14px}
.ai-turn{border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--panel) 92%,transparent);padding:16px 18px}
.ai-now{border-color:color-mix(in srgb,var(--accent) 50%,var(--line))}
.ai-q{font:600 17px/1.45 var(--display);margin:0 0 10px}
.ai-q b{display:block;font:600 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.ai-ans summary,.ai-model summary{cursor:pointer;color:var(--muted);font-size:13px}
.ai-ans p,.ai-model p{white-space:pre-wrap;margin:8px 0 0;line-height:1.55;overflow-wrap:anywhere}
.ai-input{width:100%;min-height:150px;resize:vertical;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--stage);color:var(--ink);font:14px/1.55 var(--body)}
.ai-actions{display:flex;align-items:center;gap:10px;justify-content:flex-end;margin-top:10px;flex-wrap:wrap}
.ai-count{margin-right:auto;font:12px var(--mono);color:var(--muted)}
.ai-fb{margin-top:12px;padding:12px 14px;border-radius:10px;border:1px solid var(--line);border-left:4px solid var(--muted)}
.ai-fb.ok{border-left-color:var(--ok)}.ai-fb.mid{border-left-color:#e0a63a}.ai-fb.bad{border-left-color:var(--bad)}
.ai-fb-head{display:flex;align-items:baseline;gap:10px;margin-bottom:6px}
.ai-score{font:800 24px var(--display)}.ai-score small{font-size:13px;color:var(--muted);font-weight:600}
.ai-verdict{font:600 12px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.ai-good,.ai-miss{margin:6px 0;padding:0;list-style:none;display:grid;gap:5px}
.ai-good li,.ai-miss li{padding-left:22px;position:relative;line-height:1.5}
.ai-good li::before{content:"✓";position:absolute;left:2px;color:var(--ok);font-weight:700}
.ai-miss li::before{content:"–";position:absolute;left:4px;color:var(--bad);font-weight:700}
.ai-model{margin-top:6px}
.ai-wait{color:var(--muted);font-size:14px;padding:6px 2px}
.ai-report{border:1px solid var(--line);border-radius:14px;padding:18px 20px;background:var(--panel)}
.ai-report h3{font:600 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:16px 0 6px}
.ai-overall{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.ai-overall strong{font:800 44px var(--display)}.ai-overall strong small{font-size:18px;color:var(--muted)}
.ai-overall.ok strong{color:var(--ok)}.ai-overall.bad strong{color:var(--bad)}
.ai-overall span{font:600 13px var(--mono);text-transform:uppercase;color:var(--muted)}
.ai-sum{font-size:16px;line-height:1.55;margin:6px 0 0;max-width:70ch}
.ai-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:4px 20px}
.ai-study{display:flex;gap:8px;flex-wrap:wrap}
@media(max-width:520px){.ai-turn,.ai-report{padding:14px}.ai-q{font-size:16px}.ai-topics{grid-template-columns:minmax(0,1fr)}}
.seg button small{white-space:nowrap}
.ai-report,.ai-now{scroll-margin-top:90px}
@media(max-width:520px){.seg button small{display:block;margin:0}}
.gis-slot{display:flex;justify-content:center;min-height:44px;color-scheme:normal}
.gis-slot[hidden]{display:none}
.c-code .ln{align-items:flex-start;min-width:0;white-space:normal}
.c-code .ln span{white-space:pre-wrap;overflow-wrap:anywhere;min-width:0}
/* C# / Python code switch in the header */
.langsw{flex:none}
.langsw button{padding:6px 12px;font:600 12px var(--mono)}
.code-note{margin:8px 0 0;font-size:13px;color:var(--muted)}
@media (max-width:520px){.langsw button{padding:6px 9px;font-size:11.5px}}
/* judged Solve problems */
.solve-rule{margin-top:10px!important;font-size:14px;color:var(--ink)}
.solve-example code{white-space:pre-wrap;overflow-wrap:anywhere}
.case-row span{white-space:pre-wrap;overflow-wrap:anywhere}
/* Solve editor: Monaco (LeetCode's editor) with the textarea as fallback */
.solution-code[hidden]{display:none}
.solution-code{font:14px/1.5 Menlo,Monaco,Consolas,"Courier New",monospace;font-variant-ligatures:none;font-feature-settings:"liga" 0,"calt" 0}
.code-host{height:480px;min-height:280px;resize:vertical;overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.code-host[hidden]{display:none}
.compile-line{margin:6px 0 0;font:13px/1.55 Menlo,Monaco,Consolas,"Courier New",monospace;font-variant-ligatures:none;overflow-wrap:anywhere}
.line-link{background:none;border:0;padding:0;font:inherit;color:var(--bad);text-decoration:underline;cursor:pointer}
.compile-help{margin-top:10px!important;font-size:13px;color:var(--muted)}
.solve-hint kbd{font:11px var(--mono);border:1px solid var(--line);border-radius:4px;padding:0 4px}
@media(max-width:850px){.code-host{height:400px}}
@media(max-width:520px){.code-host{height:340px}.solution-code{font-size:13px}}
/* compiler download progress on the Solve page */
.load-bar{height:6px;margin:10px 0 8px;border-radius:99px;background:color-mix(in srgb,var(--line) 70%,transparent);overflow:hidden}
.load-bar span{display:block;height:100%;border-radius:inherit;background:var(--c3);transition:width .3s ease}
/* Solve: Description / Solution tabs, the solution gate and watch links */
.ptabs{display:flex;gap:4px;margin:4px 0 12px;border-bottom:1px solid var(--line)}
.ptabs button{border:0;background:none;color:var(--muted);font:600 14px var(--body);padding:8px 10px;border-bottom:2px solid transparent;cursor:pointer}
.ptabs button.on{color:var(--ink);border-bottom-color:var(--b1)}
.ppane[hidden]{display:none}
.watch-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.sol-gate{display:grid;gap:12px;justify-items:start;padding:14px;border:1px dashed color-mix(in srgb,var(--b1) 45%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--b1) 6%,transparent)}
.sol-gate p{margin:0}
.sol-watch{margin-top:18px}.sol-watch h3{margin:0;font:600 14px var(--body)}
.sol-head p{margin:0 0 6px}
.sol-bar{display:flex;align-items:center;gap:8px;margin:10px 0 8px}
.sol-code{max-height:520px;overflow:auto}
#drill-lang{margin:12px 0 4px}
/* Plus: header link, pricing page, tags */
.plus-link{border-color:color-mix(in srgb,var(--b2) 55%,var(--line));color:var(--ink);background:color-mix(in srgb,var(--b2) 14%,var(--panel))}
.plus-link.on{background:none;color:var(--muted)}
.plus-page{max-width:720px;margin:0 auto;padding:18px 0 40px;display:grid;gap:16px}
.plus-why{margin:0;font:600 15px var(--body);color:var(--muted)}
.plus-card{position:relative;padding:28px;border-radius:18px;border:1px solid color-mix(in srgb,var(--b2) 45%,var(--line));
  background:radial-gradient(120% 90% at 100% 0%,color-mix(in srgb,var(--b2) 16%,transparent),transparent 60%),var(--panel)}
.plus-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.plus-badge{font:800 12px var(--mono);letter-spacing:.06em;padding:4px 10px;border-radius:99px;color:var(--on-cat);background:linear-gradient(90deg,var(--b2),var(--b1))}
.plus-active{font-size:13px;color:var(--ok)}
.plus-card h1{margin:14px 0 6px;font:800 clamp(26px,4vw,36px)/1.15 var(--display);letter-spacing:-.02em}
.plus-price{margin:0 0 18px;color:var(--muted);font-size:16px}
.plus-price b{font:800 34px var(--display);color:var(--ink);margin-right:4px}
.plus-perks{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:12px}
.plus-perks li{display:grid;gap:2px;padding-left:28px;position:relative}
.plus-perks li::before{content:"✓";position:absolute;left:0;top:1px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;color:var(--on-cat);background:var(--ok)}
.plus-perks span{color:var(--muted);font-size:14px}
.plus-cta{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.plus-msg{margin:14px 0 0;font-weight:600}
.plus-note{margin:16px 0 0;font-size:13px;color:var(--muted);line-height:1.55}
.plus-note a{color:inherit}
.plus-free{margin:0;text-align:center;font-size:14px;color:var(--muted)}
.plus-tag{font:700 10.5px var(--mono);padding:2px 7px;border-radius:99px;color:var(--on-cat);background:linear-gradient(90deg,var(--b2),var(--b1));justify-self:start}
@media (max-width:520px){.plus-card{padding:20px}.plus-cta .btn{width:100%}}
