:root { --bg:#f4f4f8; --card:#ffffff; --ink:#162158; --mut:#6b7280; --line:#e8e8ef;
        --ok:#1f9d57; --fail:#d92d20; --unc:#c47d0a; --na:#7a869a; --acc:#f67319; --acc-d:#dd5f0c; }
* { box-sizing:border-box; }
body { margin:0; font:14px/1.55 Inter,system-ui,Segoe UI,Roboto,sans-serif; background:var(--bg); color:#1f2433; }
header { background:var(--card); padding:14px 24px; border-bottom:1px solid var(--line);
         display:flex; align-items:center; gap:12px; }
.logo { width:30px; height:30px; border-radius:8px; background:var(--acc); color:#fff;
        display:flex; align-items:center; justify-content:center; font-weight:700; flex:0 0 auto; }
h1 { font-size:17px; margin:0; color:var(--ink); font-weight:700; }
.sub { color:var(--mut); font-size:12px; margin-top:2px; }
.acct { text-align:right; font-size:12px; color:var(--mut); }
.acct-plan { color:var(--ink); font-weight:500; }
.acct-key { margin:4px 0 0; padding:3px 10px; font-size:11px; background:#fff; color:var(--mut);
            border:1px solid var(--line); border-radius:12px; font-weight:500; }
main { max-width:1280px; margin:0 auto; padding:24px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:18px;
        margin-bottom:16px; box-shadow:0 1px 2px rgba(22,33,88,.04); }
.tabs { display:flex; gap:8px; margin-bottom:14px; flex-wrap:wrap; }
.tab { padding:7px 16px; border:1px solid var(--line); border-radius:22px; cursor:pointer;
       color:var(--mut); font-weight:500; background:#fff; transition:all .15s; }
.tab:hover { border-color:var(--acc); color:var(--ink); }
.tab.active { background:var(--acc); color:#fff; border-color:var(--acc); }
label { display:block; font-size:12px; color:var(--mut); margin:10px 0 4px; font-weight:500; }
input, textarea, select { width:100%; background:#fff; color:#1f2433; border:1px solid var(--line);
      border-radius:9px; padding:10px 12px; font:inherit; }
input:focus, textarea:focus, select:focus { outline:none; border-color:var(--acc); }
textarea { min-height:160px; resize:vertical; }
.row { display:flex; gap:12px; } .row > * { flex:1; }
button { background:var(--acc); color:#fff; border:0; border-radius:9px; padding:10px 18px;
      font:inherit; font-weight:600; cursor:pointer; margin-top:14px; transition:background .15s; }
button:hover { background:var(--acc-d); }
button:disabled { opacity:.5; cursor:default; }
.hidden { display:none; }
.summary { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
.chip { padding:5px 12px; border-radius:20px; font-weight:600; font-size:12px; }
.c-pass{background:rgba(46,204,113,.15);color:var(--ok);}
.c-fail{background:rgba(231,76,60,.15);color:var(--fail);}
.c-uncertain{background:rgba(241,196,15,.15);color:var(--unc);}
.c-na{background:rgba(93,107,133,.2);color:var(--na);}
.c-error{background:rgba(231,76,60,.25);color:var(--fail);}
.v { border:1px solid var(--line); border-left-width:4px; border-radius:8px; padding:12px; margin-bottom:10px; }
.v.pass{border-left-color:var(--ok);} .v.fail{border-left-color:var(--fail);}
.v.uncertain{border-left-color:var(--unc);} .v.not_applicable{border-left-color:var(--na);}
.v.error{border-left-color:var(--fail);}
.v-head { display:flex; justify-content:space-between; gap:10px; align-items:baseline; }
.v-title { font-weight:600; color:var(--ink); } .v-id { color:var(--mut); font-size:12px; font-weight:400; }
.badge { font-size:11px; padding:2px 8px; border-radius:10px; }
.b-blocking{background:rgba(231,76,60,.15);color:var(--fail);}
.b-advisory{background:rgba(77,141,255,.15);color:var(--acc);}
.expl { margin:6px 0; } .ev { color:var(--mut); font-size:13px; font-style:italic; }
.needs { color:var(--unc); font-size:12px; margin-top:6px; }
.err { color:var(--fail); }
.status-line { color:var(--mut); font-size:12px; margin-top:10px; }
.sect { margin-bottom:10px; border:1px solid var(--line); border-radius:8px; padding:6px 10px; }
.sect > summary { cursor:pointer; font-weight:600; padding:4px 0; }
.crit { border:1px solid var(--line); border-radius:8px; padding:10px 12px; margin-bottom:8px; }
.crit-off { opacity:.5; }
.crit-head { display:flex; gap:10px; align-items:baseline; }
.crit-title { font-weight:600; }
.crit-en { font-size:12px; color:var(--mut); white-space:nowrap; }
.crit-ctrls { display:flex; gap:14px; align-items:center; flex-wrap:wrap; margin-top:8px; font-size:13px; }
.crit-ctrls select { width:auto; padding:4px 8px; }
.crit-types { color:var(--mut); font-size:12px; }
.btn-save { margin:0; padding:5px 12px; font-size:12px; }
.save-st { font-size:12px; }
.crit-prompt { margin-top:8px; }
.crit-prompt summary { cursor:pointer; color:var(--mut); font-size:12px; }
.crit-prompt textarea { margin-top:6px; min-height:70px; font-size:12px; }
.rv-bar { display:flex; align-items:center; gap:14px; margin-bottom:12px; }
.btn-back { margin:0; background:var(--card); border:1px solid var(--line); color:var(--ink); }
.report-grid { display:grid; grid-template-columns: 1fr 1fr; gap:16px; align-items:start; }
@media (max-width:900px){ .report-grid{ grid-template-columns:1fr; } }
.panel { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:16px;
         max-height:calc(100vh - 130px); overflow:auto; }
.material-panel h2 { font-size:18px; margin:0 0 8px; color:var(--ink); }
.rv-meta { margin-bottom:10px; }
.seg { padding:6px 8px; border-radius:6px; margin-bottom:4px; white-space:pre-wrap; border-left:2px solid transparent; }
.seg:hover { background:#faf7f2; }
.seg-label { color:var(--mut); font-size:12px; font-weight:600; }
.seg mark { background:#ffe0b2; color:#7a3e00; padding:0 2px; border-radius:3px; box-shadow:0 0 0 2px #ffe0b2; }
.ev-link { display:block; cursor:pointer; color:var(--acc); font-style:normal; margin:4px 0; border-bottom:1px dashed transparent; }
.ev-link:hover { border-bottom-color:var(--acc); }
.img-row { display:flex; flex-wrap:wrap; gap:8px; margin:2px 0 10px 8px; }
.img-row .mat-img img { height:130px; width:auto; max-width:240px; }
.img-gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:8px; margin-top:12px; }
.mat-img { margin:0; border:1px solid var(--line); border-radius:8px; padding:4px; background:#fff; }
.mat-img img { width:100%; height:110px; object-fit:contain; border-radius:4px; background:#faf7f2; }
.mat-img figcaption { font-size:11px; color:var(--mut); margin-top:4px; max-height:46px; overflow:hidden; }
.mat-img.hit { border-color:var(--acc); box-shadow:0 0 0 3px rgba(246,115,25,.25); }
.arb-panel { border:1px solid var(--acc); background:rgba(246,115,25,.06); border-radius:10px; padding:12px 14px; margin-bottom:14px; }
.arb-h { font-weight:700; color:var(--ink); margin-bottom:6px; }
.arb-sum { margin-bottom:6px; }
.arb-sub { font-size:12px; color:var(--mut); font-weight:600; margin-top:6px; }
.arb-panel ul { margin:4px 0 0; padding-left:18px; } .arb-panel li { margin:2px 0; }
.arb-panel ul.cov li { color:var(--mut); }
.arb-note { font-size:12px; color:var(--acc-d); background:rgba(246,115,25,.08); border-radius:6px; padding:4px 8px; margin-top:6px; }
.lbl { display:flex; align-items:center; gap:6px; margin-top:8px; }
.lbl-q { font-size:12px; color:var(--mut); }
.lbl button { margin:0; padding:3px 10px; font-size:12px; font-weight:600; border:1px solid var(--line); background:#fff; color:var(--mut); border-radius:14px; }
.lbl button:hover { border-color:var(--acc); }
.lbl button.on { color:#fff; }
.lbl button[data-lbl="correct"].on { background:var(--ok); border-color:var(--ok); }
.lbl button[data-lbl="incorrect"].on { background:var(--fail); border-color:var(--fail); }
.decision { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:12px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.dec-btn { margin:0; padding:6px 12px; font-size:13px; background:#fff; color:var(--ink); border:1px solid var(--line); border-radius:8px; }
.dec-btn.on.c-pass { background:var(--ok); color:#fff; border-color:var(--ok); }
.dec-btn.on.c-uncertain { background:var(--unc); color:#fff; border-color:var(--unc); }
.dec-btn.on.c-fail { background:var(--fail); color:#fff; border-color:var(--fail); }
/* соц-иконки в шапке */
.socials { display:flex; gap:10px; align-items:center; }
.socials a { color:var(--mut); display:flex; align-items:center; transition:color .15s; }
.socials a:hover { color:var(--acc); }
.socials .social-badge { font:700 12px/1.4 inherit; border:1.5px solid currentColor; border-radius:6px;
                         padding:1px 5px; text-decoration:none; letter-spacing:.3px; }
/* блог / SEO-статьи */
.article { max-width:760px; }
.crumb { font-size:13px; color:var(--mut); margin-bottom:10px; }
.crumb a { color:var(--acc); text-decoration:none; }
.article h1 { font-size:30px; line-height:1.25; color:var(--ink); margin:6px 0 8px; }
.article-meta { color:var(--mut); font-size:13px; margin-bottom:18px; }
.article h2 { font-size:21px; color:var(--ink); margin:26px 0 8px; }
.article p, .article li { font-size:16px; line-height:1.7; color:#2a3043; }
.article ul, .article ol { padding-left:22px; } .article li { margin:6px 0; }
.article-cta { background:#fffaf3; border:1px solid #e4c9a8; border-radius:14px; padding:18px 20px;
               margin:28px 0; text-align:center; }
.article-cta b { color:var(--ink); font-size:17px; }
.article-cta a.cta-btn { display:inline-block; margin-top:10px; background:var(--acc); color:#fff;
               text-decoration:none; font-weight:600; padding:11px 22px; border-radius:9px; }
.article-cta a.cta-btn:hover { background:var(--acc-d); }
.bloglist { max-width:760px; }
.bloglist h1 { font-size:26px; color:var(--ink); margin:4px 0 16px; }
.post-card { display:block; background:#fff; border:1px solid var(--line); border-radius:12px;
             padding:16px 18px; margin-bottom:12px; text-decoration:none; transition:border-color .15s; }
.post-card:hover { border-color:var(--acc); }
.post-card b { color:var(--ink); font-size:17px; } .post-card span { color:var(--mut); font-size:14px; display:block; margin-top:4px; }
/* режим «Текст / Документ» для загруженных файлов */
.modebar { display:flex; gap:6px; margin-bottom:10px; }
.mode-btn { margin:0; padding:5px 14px; font-size:13px; font-weight:600; background:#fff;
            color:var(--mut); border:1px solid var(--line); border-radius:20px; }
.mode-btn:hover { border-color:var(--acc); color:var(--ink); }
.mode-btn.on { background:var(--acc); color:#fff; border-color:var(--acc); }
.rv-doc { display:flex; flex-direction:column; gap:10px; }
.rv-doc.hidden { display:none; }   /* перебивает .rv-doc display:flex */
.doc-page { width:100%; height:auto; border:1px solid var(--line); border-radius:6px;
            background:#fff; box-shadow:0 1px 3px rgba(22,33,88,.06); }
/* индикатор загрузки */
.loading { text-align:center; padding:36px 16px; }
.spinner { width:44px; height:44px; margin:0 auto 16px; border:4px solid #f0e4d4;
           border-top-color:var(--acc); border-radius:50%; animation:spin 0.9s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.load-msg { font-size:15px; font-weight:600; color:var(--ink); min-height:22px; transition:opacity .3s; }
.load-sub { font-size:12px; color:var(--mut); margin-top:8px; line-height:1.6; }