/* /platform/knowledge — the page's own rules (ported from the 02.10 etalon's inline <style>; the kit's rules stay in y.css / ui.css) */
/* ---- hero: findings → article ---- */
.kn{max-width:1300px;margin:64px auto 0;display:grid;grid-template-columns:minmax(0,.9fr) 120px minmax(0,1.2fr);align-items:stretch;text-align:left}
.fd{border:1px solid var(--line);border-radius:22px;padding:18px;background:linear-gradient(180deg,#131419,#0e0f12);display:flex;flex-direction:column;gap:10px;min-height:520px}
.fd h3{font-size:14px;font-weight:600;color:var(--ink2);display:flex;justify-content:space-between}
.fd h3 span{color:var(--ink3);font-weight:500}
.fc{background:#fff;border-radius:12px;padding:11px 13px;color:#0f172a;box-shadow:0 10px 24px -14px rgba(0,0,0,.7);animation:uIn .45s var(--ease) both;transition:transform .7s cubic-bezier(.6,0,.3,1),opacity .6s}
.fc .k{font-size:11.5px;font-weight:650}
.fc p{margin-top:4px;font-size:12.8px;line-height:1.45}
.fc .tg{display:none;margin-top:8px;font-size:11.5px;font-weight:650;color:#0b7648}
.fc.done{box-shadow:0 0 0 2px #bfe8cf,0 10px 24px -14px rgba(0,0,0,.7)}
.fc.done .tg{display:block;animation:uIn .35s var(--ease)}
.flow{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:0 10px}
.flow svg{width:70px;height:20px;color:#9fb0ff}
.flow .lbl{font-size:12.5px;font-weight:600;color:var(--ink2);text-align:center;line-height:1.35}
.ar2{min-height:520px;display:flex;flex-direction:column}
.ar2 .ui-main{padding:18px 22px;flex:1}
.ar2 .vv{display:flex;gap:10px;align-items:center;font-size:12px;color:var(--u-mut)}
.ar2 .vv b{font-size:12px;font-weight:700;color:#0b7648;transition:all .3s}
.ar2 .vv b.bump{animation:uPop .5s cubic-bezier(.2,1.6,.4,1)}
.ar2 h4{margin-top:6px;font-size:19px;font-weight:700;letter-spacing:-.015em;line-height:1.3}
.ar2 .p{margin-top:10px;font-size:13.3px;line-height:1.65;color:#1e293b}
.ar2 .q2{margin-top:10px;border-left:3px solid #2563eb;background:#f5f8ff;border-radius:0 8px 8px 0;padding:9px 12px;font-size:13px;line-height:1.55}
.ar2 .add{margin-top:8px;border-radius:8px;background:#f0fbf5;border-left:3px solid #16a34a;padding:8px 12px;font-size:12.8px;line-height:1.5;animation:uIn .5s var(--ease) both}
.ar2 .add small{display:block;font-size:11px;color:#0b7648;font-weight:650;margin-top:3px}
/* ---- versions ---- */
.vs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:18px;margin-top:56px;align-items:center}
.vs-l h3{font:500 26px/1.25 "Plus Jakarta Sans";letter-spacing:-.01em}
.vs-l p{margin-top:10px;font-size:15px;line-height:1.6;color:var(--ink2)}
.rail{margin-top:24px;position:relative;height:56px}
.rail .ln{position:absolute;left:12px;right:12px;top:14px;height:2px;background:var(--line2)}
.rail .fill{position:absolute;left:12px;top:14px;height:2px;background:#9fb0ff;transition:width .4s var(--ease)}
.rail button{all:unset;cursor:pointer;position:absolute;top:0;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px}
.rail button i{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:11.5px;font-weight:700;border:1px solid var(--line2);background:#0f1013;color:var(--ink3);transition:all .3s}
.rail button small{font-size:12px;color:var(--ink3);white-space:nowrap}
.rail button.on i{background:#9fb0ff;border-color:#9fb0ff;color:#0a0b0d}
.rail button.bad i{border-color:#f08a8a;color:#f08a8a}
.rail button.bad.on i{background:#f08a8a;color:#0a0b0d}
.vdoc{background:#fff;border-radius:18px;padding:22px;color:#0f172a;min-height:300px;position:relative}
.vdoc .vh{display:flex;justify-content:space-between;align-items:center;font-size:12.5px;color:#596779}
.vdoc .vh b{color:#0f172a}
.vdoc h5{margin-top:8px;font-size:18px;font-weight:700;letter-spacing:-.01em}
.vdoc .body{margin-top:12px;font-size:14px;line-height:1.65;color:#1e293b}
.vdoc .body del{background:#fdecec;color:#b91c1c;text-decoration-thickness:2px}
.vdoc .body ins{background:#e4faf0;color:#0b7648;text-decoration:none}
.vdoc .note{margin-top:14px;border-radius:10px;padding:10px 12px;font-size:13px;line-height:1.5}
.vdoc .note.bad{background:#fff5f5;color:#7f1d1d;border:1px solid #f5c2c2}
.vdoc .note.ok{background:#f0fbf5;color:#14532d;border:1px solid #bfe8cf}
.vdoc .stamp2{position:absolute;right:18px;top:16px;font-size:11.5px;font-weight:800;color:#b91c1c;border:2px solid #b91c1c;border-radius:6px;padding:4px 8px;transform:rotate(6deg);opacity:0;transition:opacity .3s}
.vdoc .stamp2.on{opacity:.85}
/* ---- what gets loaded ---- */
.ctx{display:grid;grid-template-columns:330px minmax(0,1fr);gap:18px;margin-top:56px}
.ctx-l{display:grid;gap:8px;align-content:start}
.ctx-l button{all:unset;cursor:pointer;border:1px solid var(--line);border-radius:16px;padding:14px 16px;transition:all .25s}
.ctx-l button b{display:block;font-size:15px;font-weight:600;color:var(--ink2)}
.ctx-l button small{display:block;margin-top:3px;font:500 12px ui-monospace,monospace;color:var(--ink3)}
.ctx-l button.on{border-color:rgba(129,148,221,.55);background:rgba(129,148,221,.08)}
.ctx-l button.on b{color:#fff}
.ctx-r{background:#fff;border-radius:18px;padding:18px;color:#0f172a}
.ctx-r .h{display:flex;justify-content:space-between;font-size:13px;font-weight:700}
.ctx-r .h span{font-weight:500;color:#596779;font-size:12px}
.cl2{margin-top:12px;display:grid;gap:6px}
.cl2 div{display:grid;grid-template-columns:22px 1fr auto;gap:10px;align-items:center;padding:10px 12px;border-radius:10px;border:1px solid #eef1f5;font-size:13px;transition:all .4s}
.cl2 div i{width:16px;height:16px;border-radius:4px;background:#e2e8f0}
.cl2 div span:last-child{font-size:11.5px;font-weight:650;color:#94a3b8}
.cl2 div.full{border-color:#bfd2fb;background:#f3f7ff}
.cl2 div.full i{background:#2563eb}
.cl2 div.full span:last-child{color:#1d4fc4}
.cl2 div.sum i{background:#94a3b8}
.cl2 div.skip{opacity:.35}
.meter2{margin-top:14px;display:flex;gap:10px;align-items:center;font-size:12.5px;color:#475569}
.meter2 .b{flex:1;height:8px;border-radius:4px;background:#eef1f5;overflow:hidden}
.meter2 .b i{display:block;height:100%;background:#2563eb;border-radius:4px;transition:width .6s var(--ease)}
/* ---- library ---- */
.lib{margin-top:56px}
.lib .tabs2{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}
.lib .tabs2 button{all:unset;cursor:pointer;font-size:14px;font-weight:600;color:var(--ink2);padding:10px 16px;border-radius:12px;border:1px solid var(--line2);transition:all .2s}
.lib .tabs2 button.on{background:#fff;color:#0a0b0d;border-color:#fff}
.shelf{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:18px;margin-top:22px}
.spines{display:grid;gap:8px;align-content:start}
.spine{all:unset;cursor:pointer;display:grid;grid-template-columns:6px 1fr auto;gap:14px;align-items:center;padding:14px 16px 14px 0;border-radius:14px;border:1px solid var(--line);overflow:hidden;transition:all .25s;animation:uIn .35s var(--ease) both}
.spine i{height:100%;min-height:44px;background:var(--c)}
.spine b{font-size:15px;font-weight:600;color:var(--ink2);line-height:1.35}
.spine small{font-size:12.5px;color:var(--ink3);white-space:nowrap}
.spine.on{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.03)}
.spine.on b{color:#fff}
.reader{background:#fff;border-radius:18px;padding:22px;color:#0f172a;animation:uIn .4s var(--ease)}
.reader .k{font-size:12px;font-weight:650}
.reader h5{margin-top:6px;font-size:19px;font-weight:700;letter-spacing:-.01em;line-height:1.3}
.reader .rule{margin-top:14px;font-size:16px;line-height:1.55;font-weight:600;background:linear-gradient(transparent 62%,#fff1b8 62%);display:inline}
.reader p{margin-top:14px;font-size:13.5px;line-height:1.6;color:#334155}
.reader .meta{margin-top:16px;display:flex;gap:16px;flex-wrap:wrap;font-size:12.5px;color:#596779;border-top:1px solid #eef1f5;padding-top:12px}
@media(max-width:1060px){.kn{grid-template-columns:1fr}.flow{display:none}.fd,.ar2{min-height:0}.vs,.ctx,.shelf{grid-template-columns:1fr}}
