/* Личный кабинет «Вертум». Тема свет/тьма через data-theme на . */ :root{ --red:#E23C3C; --red-d:#c62f2f; --bg:#eef1f6; --surface:#ffffff; --surface-2:#f7f9fc; --text:#1B212C; --muted:#6b7480; --border:#e3e8ef; --ok:#1a9d5a; --ok-bg:#e7f7ee; --warn:#b5730a; --warn-bg:#fdf3e2; --err:#d23b3b; --err-bg:#fceaea; --shadow:0 1px 2px rgba(20,25,35,.06), 0 6px 20px rgba(20,25,35,.05); --radius:12px; } :root[data-theme="dark"]{ --bg:#0f131a; --surface:#1B212C; --surface-2:#161c26; --text:#F2F5F9; --muted:#93a0b0; --border:#2a323e; --ok:#3fca80; --ok-bg:#12291d; --warn:#e0a145; --warn-bg:#2a2113; --err:#f0645f; --err-bg:#2b1616; --shadow:0 1px 2px rgba(0,0,0,.3), 0 8px 24px rgba(0,0,0,.35); } *{box-sizing:border-box} html,body{margin:0} body{ font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; background:var(--bg); color:var(--text); -webkit-font-smoothing:antialiased; } a{color:var(--red); text-decoration:none} a:hover{text-decoration:underline} h1{font-size:24px; margin:0 0 4px} h2{font-size:18px; margin:28px 0 12px} h3{margin:0 0 6px; font-size:16px} /* ── topbar ── */ .topbar{ display:flex; align-items:center; gap:24px; padding:12px 22px; background:var(--surface); border-bottom:1px solid var(--border); position:sticky; top:0; z-index:10; } .brand{display:flex; align-items:center} .logo{display:block} :root[data-theme="dark"] .logo-light{display:none} :root[data-theme="light"] .logo-dark{display:none} .nav{display:flex; gap:4px; flex:1; flex-wrap:wrap} .nav a{color:var(--text); padding:7px 12px; border-radius:8px; font-weight:500} .nav a:hover{background:var(--surface-2); text-decoration:none} .nav a.active{background:var(--red); color:#fff} .topright{display:flex; align-items:center; gap:10px; margin-left:auto} .icon-btn{background:none;border:1px solid var(--border);color:var(--text);width:34px;height:34px;border-radius:8px;cursor:pointer;font-size:15px} .icon-btn:hover{background:var(--surface-2)} .wrap{max-width:1180px; margin:0 auto; padding:26px 22px 60px} .foot{max-width:1180px;margin:0 auto;padding:20px 22px;color:var(--muted);font-size:13px} .page-head{display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:8px; margin-bottom:16px} /* ── buttons ── */ .btn{display:inline-block;border:1px solid var(--border);background:var(--surface);color:var(--text); padding:8px 14px;border-radius:9px;cursor:pointer;font-size:14px;font-weight:500;line-height:1.2} .btn:hover{background:var(--surface-2);text-decoration:none} .btn.primary{background:var(--red);border-color:var(--red);color:#fff} .btn.primary:hover{background:var(--red-d)} .btn.ghost{background:transparent} .btn.danger{color:var(--err);border-color:transparent;background:transparent} .btn.danger:hover{background:var(--err-bg)} .btn.ok-b{color:var(--ok);border-color:var(--ok)} .btn.sm{padding:5px 10px;font-size:13px} .btn.wide{width:100%} form{margin:0} /* ── tiles ── */ .tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin:6px 0 8px} .tile{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow)} .tile-n{font-size:24px;font-weight:700;letter-spacing:-.5px} .tile-l{color:var(--muted);font-size:13px;margin-top:2px} .tile.ok .tile-n{color:var(--ok)} .tile.warn .tile-n{color:var(--warn)} .tile.err .tile-n{color:var(--err)} /* ── tables ── */ .table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow)} table.grid{width:100%;border-collapse:collapse;font-size:14px;min-width:640px} table.grid th,table.grid td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--border);vertical-align:top} table.grid thead th{background:var(--surface-2);font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);font-weight:600;position:sticky;top:0} table.grid thead th a{color:var(--muted)} table.grid thead th a.sorted{color:var(--red)} table.grid tbody tr:hover{background:var(--surface-2)} table.grid.compact th,table.grid.compact td{padding:7px 10px} .grid .r{text-align:right} .grid .center{text-align:center} tr.off{opacity:.55} .name a{font-weight:500} .url a{word-break:break-all} .mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px} .small{font-size:12px} .muted{color:var(--muted)} .ok-t{color:var(--ok)} .warn-t{color:var(--warn)} .err-t{color:var(--err)} /* progress bar */ .bar{height:7px;background:var(--surface-2);border:1px solid var(--border);border-radius:6px;overflow:hidden;min-width:90px} .bar>span{display:block;height:100%;background:var(--red)} /* badges */ .badge{display:inline-block;padding:1px 7px;border-radius:20px;font-size:11px;font-weight:600;background:var(--surface-2);color:var(--muted);border:1px solid var(--border)} .badge.off{color:var(--muted)} .badge.unavailable,.badge.profile_drop{background:var(--warn-bg);color:var(--warn);border-color:transparent} .badge.discontinued,.badge.challenge{background:var(--err-bg);color:var(--err);border-color:transparent} .badge.parse_error{background:var(--err-bg);color:var(--err);border-color:transparent} /* forms / filters */ .filters{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:0 0 14px} input,select{font:inherit;padding:8px 10px;border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--text)} input:focus,select:focus{outline:2px solid var(--red);outline-offset:0;border-color:var(--red)} .filters input[type=search]{min-width:240px;flex:1} .panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px;margin:14px 0;box-shadow:var(--shadow)} .row-form{display:flex;gap:10px;flex-wrap:wrap} .row-form input{flex:1;min-width:220px} .grid-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;align-items:center} .grid-form .wide-in{grid-column:1/-1} .pager{display:flex;gap:14px;align-items:center;justify-content:center;margin:18px 0} /* alerts */ .alert{padding:10px 14px;border-radius:10px;margin:10px 0;font-size:14px} .alert.ok{background:var(--ok-bg);color:var(--ok)} .alert.warn{background:var(--warn-bg);color:var(--warn)} .alert.err{background:var(--err-bg);color:var(--err)} /* code */ pre.code,.code{background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:12px 14px;overflow-x:auto;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;line-height:1.55} code{font-family:ui-monospace,Menlo,Consolas,monospace} /* login */ .login-wrap{min-height:60vh;display:flex;align-items:center;justify-content:center} .login-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:28px;width:100%;max-width:380px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:14px} .login-card label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)} .login-card input{font-size:15px} /* landing */ .hero{padding:36px 0 20px;max-width:760px} .hero h1{font-size:34px;line-height:1.15;letter-spacing:-.5px} .lead{font-size:17px;color:var(--muted);margin:12px 0 20px} .hero-actions{display:flex;gap:12px;flex-wrap:wrap} .cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:26px 0} .card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)} .card-ico{font-size:24px;margin-bottom:6px} .card p{color:var(--muted);font-size:14px;margin:0} .strip{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px 20px;box-shadow:var(--shadow)} /* home */ .home-hero{max-width:820px;margin:6px 0 18px} .home-hero h1{font-size:28px} .grid .c{text-align:center} .caps .yes{color:var(--ok);font-weight:700} .caps .no{color:var(--muted)} .home-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:8px 0} .steps{margin:6px 0 0;padding-left:20px} .steps li{margin:4px 0;color:var(--text)} .steps li b{font-weight:600} @media(max-width:760px){.home-cols{grid-template-columns:1fr}} /* tokens */ .token-box{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:var(--surface-2);border:1px dashed var(--red);border-radius:10px;padding:12px 14px;margin:8px 0} .token-box code{font-size:14px;word-break:break-all;flex:1} .tok{word-break:break-all} /* docs */ .docs{display:grid;grid-template-columns:180px 1fr;gap:24px} .docs-nav{position:sticky;top:70px;align-self:start;display:flex;flex-direction:column;gap:4px} .docs-nav a{color:var(--muted);padding:5px 8px;border-radius:7px;font-size:14px} .docs-nav a:hover{background:var(--surface-2);text-decoration:none;color:var(--text)} .docs-body section{margin-bottom:26px} .docs-body h2{margin-top:0;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:16px} @media(max-width:760px){ .docs{grid-template-columns:1fr}.docs-nav{position:static;flex-direction:row;flex-wrap:wrap} .nav{order:3;flex-basis:100%} }