/* ------------------------------------------------------------------ Альтернативная тема «Минимал»: типографика, воздух, тонкие линии. Включается атрибутом data-theme="minimal" на . Ничего не ломает: переопределяет только внешний слой базовой темы. ------------------------------------------------------------------ */ :root[data-theme="minimal"]{ --bg:#FFFFFF; --surface:#FFFFFF; --surface-2:#F6F6F7; --ink:#0B0B0C; --muted:#8C8C93; --line:#E7E7EA; --navy:#0B0B0C; --navy-2:#0B0B0C; --blue:#0B0B0C; --sky:#0B0B0C; --good:#15734C; --good-bg:transparent; --warn:#8A6100; --warn-bg:transparent; --bad:#A82A22; --bad-bg:transparent; --r:0px; --r-sm:0px; --sh:none; --sh-lg:none; } [data-theme="minimal"] body{font-size:16.5px;line-height:1.62} [data-theme="minimal"] .wrap{max-width:760px} [data-theme="minimal"] .wrap-wide{max-width:1180px} /* заголовки крупнее и плотнее */ [data-theme="minimal"] h1{font-size:clamp(34px,7vw,62px);letter-spacing:-.045em;font-weight:800} [data-theme="minimal"] h2{font-size:clamp(22px,3.6vw,32px);letter-spacing:-.035em} [data-theme="minimal"] h3{font-size:15px;font-weight:700;letter-spacing:.04em;text-transform:uppercase} [data-theme="minimal"] h4{font-size:14px;letter-spacing:.02em} [data-theme="minimal"] .lead{font-size:clamp(17px,2.4vw,21px);line-height:1.5;color:var(--muted)} /* карточки превращаются в разделы, разделённые волосяной линией */ [data-theme="minimal"] .card{ background:transparent;border:0;border-top:1px solid var(--line); border-radius:0;box-shadow:none;padding:30px 0 32px;margin:0 } [data-theme="minimal"] .card.tight{padding:22px 0;border-top:1px solid var(--line)} [data-theme="minimal"] .card.flat{background:transparent} [data-theme="minimal"] .grid2,[data-theme="minimal"] .grid3{gap:0 40px} [data-theme="minimal"] .section{margin:56px 0 4px} /* шапка — не тёмный блок, а разворот на белом */ [data-theme="minimal"] .hero{ background:none;color:var(--ink);border-radius:0;box-shadow:none; padding:64px 0 34px;margin:0 0 4px;border-bottom:1px solid var(--ink) } [data-theme="minimal"] .hero::before,[data-theme="minimal"] .hero::after{display:none} [data-theme="minimal"] .hero h1{color:var(--ink)} [data-theme="minimal"] .hero p,[data-theme="minimal"] .hero .lead, [data-theme="minimal"] .hero-role,[data-theme="minimal"] .hero-meta{color:var(--muted)} /* метки — капслок вместо заливки */ [data-theme="minimal"] .pill{ background:transparent;border:1px solid var(--line);color:var(--muted); border-radius:0;text-transform:uppercase;letter-spacing:.09em;font-size:10.5px; font-weight:700;padding:5px 9px } [data-theme="minimal"] .pill.light{border-color:var(--line);color:var(--muted)} [data-theme="minimal"] .pill.good{color:var(--good);border-color:var(--good)} [data-theme="minimal"] .pill.bad{color:var(--bad);border-color:var(--bad)} [data-theme="minimal"] .pill.warn{color:var(--warn);border-color:var(--warn)} [data-theme="minimal"] .pill.dot::before{display:none} /* кнопки — строгие прямоугольники */ [data-theme="minimal"] button,[data-theme="minimal"] .btn{ background:var(--ink);color:#fff;border-radius:0;box-shadow:none; border:1px solid var(--ink);font-weight:600;padding:13px 22px } [data-theme="minimal"] button:hover,[data-theme="minimal"] .btn:hover{background:#2A2A2E} [data-theme="minimal"] .btn-ghost,[data-theme="minimal"] .btn-light{ background:transparent;color:var(--ink);border-color:var(--ink) } [data-theme="minimal"] .btn-ghost:hover,[data-theme="minimal"] .btn-light:hover{background:var(--surface-2)} [data-theme="minimal"] .btn-sm{padding:8px 14px} /* поля */ [data-theme="minimal"] input,[data-theme="minimal"] select,[data-theme="minimal"] textarea{ border-radius:0;border-width:0 0 1px 0;border-color:var(--line); background:transparent;padding:11px 2px } [data-theme="minimal"] input:focus,[data-theme="minimal"] select:focus, [data-theme="minimal"] textarea:focus{box-shadow:none;border-color:var(--ink)} [data-theme="minimal"] label.field > span{text-transform:uppercase;letter-spacing:.08em;font-size:10.5px} /* варианты ответа */ [data-theme="minimal"] .opt{ border-radius:0;border-width:0 0 1px 0;border-color:var(--line); background:transparent;padding:18px 2px } [data-theme="minimal"] .opt:hover{background:var(--surface-2)} [data-theme="minimal"] .opt.sel{background:transparent;border-color:var(--ink)} [data-theme="minimal"] .opt b{border-radius:0;background:transparent;border-color:var(--line);font-weight:700} [data-theme="minimal"] .opt.sel b{background:var(--ink);border-color:var(--ink)} /* прогресс и шкалы — волосяные */ [data-theme="minimal"] .progress{height:1px;background:var(--line);border-radius:0} [data-theme="minimal"] .progress > i{background:var(--ink);border-radius:0} [data-theme="minimal"] .qbar{background:rgba(255,255,255,.94)} [data-theme="minimal"] .track{height:10px;border-radius:0;border:0;background:var(--surface-2)} [data-theme="minimal"] .track > i{border-radius:0;background:var(--ink)} [data-theme="minimal"] .track > i.under{background:var(--bad)} [data-theme="minimal"] .track > i.over{background:var(--good)} [data-theme="minimal"] .track .tick{background:#fff} [data-theme="minimal"] .track .goal{width:1px;background:var(--ink);box-shadow:none;top:-7px;bottom:-7px} [data-theme="minimal"] .comp{padding:22px 0} [data-theme="minimal"] .comp-head b{font-size:17px;text-transform:none;letter-spacing:-.02em} /* кольцо соответствия */ [data-theme="minimal"] .donut{ width:128px;height:128px; background:conic-gradient(var(--ink) calc(var(--p)*1%),var(--line) 0) } [data-theme="minimal"] .donut > div{background:var(--bg);width:112px;height:112px} [data-theme="minimal"] .donut b{color:var(--ink);font-size:30px} [data-theme="minimal"] .donut span{color:var(--muted)} /* таблицы */ [data-theme="minimal"] th{background:transparent;border-bottom:1px solid var(--ink);color:var(--ink)} [data-theme="minimal"] th:first-child,[data-theme="minimal"] th:last-child{border-radius:0} [data-theme="minimal"] tbody tr:hover td{background:var(--surface-2)} [data-theme="minimal"] .mtx td:first-child{background:var(--bg);box-shadow:none;border-right:1px solid var(--line)} /* админка */ [data-theme="minimal"] .topbar{ background:transparent;color:var(--ink);border-bottom:1px solid var(--ink);box-shadow:none } [data-theme="minimal"] .topbar .tiny{color:var(--muted)} [data-theme="minimal"] .tabs button{border-radius:0;background:transparent;border-color:transparent; border-bottom:1px solid transparent;color:var(--muted)} [data-theme="minimal"] .tabs button.on{background:transparent;color:var(--ink);border-bottom-color:var(--ink)} [data-theme="minimal"] .kpi{border:0;border-left:1px solid var(--line);border-radius:0;padding:6px 0 6px 18px} [data-theme="minimal"] .kpi b{font-size:34px} [data-theme="minimal"] .seg{border-radius:0} [data-theme="minimal"] .seg button.on{background:var(--ink)} [data-theme="minimal"] .chip{border-radius:0} [data-theme="minimal"] .chip.on{background:var(--ink);border-color:var(--ink)} [data-theme="minimal"] .pane-intro{background:transparent;border:0;border-left:2px solid var(--ink);border-radius:0} [data-theme="minimal"] .note{background:transparent;border:0;border-left:2px solid var(--ink);border-radius:0;padding-left:16px} [data-theme="minimal"] .savebar{border-radius:0} /* переключатель тем */ .theme-switch{ position:fixed;right:18px;bottom:18px;z-index:80; padding:9px 16px;font-size:12.5px;font-weight:650;border-radius:999px; background:var(--ink);color:#fff;border:1px solid var(--ink); box-shadow:0 10px 24px -10px rgba(0,0,0,.5);cursor:pointer } .theme-switch:hover{background:var(--ink);opacity:.88} [data-theme="minimal"] .theme-switch{border-radius:0;box-shadow:none} @media print{.theme-switch{display:none}} /* верный вариант ответа: в минимал-теме заливки нет, помечаем цветом цифры */ [data-theme="minimal"] .qrow.correct input{border-color:var(--good);background:transparent} [data-theme="minimal"] .qrow.correct input[type="number"]{color:var(--good)}