body.p-admin{margin:0;overflow:hidden;background:var(--page)}
.admin-shell{min-height:100vh;display:grid;grid-template-columns:238px minmax(0,1fr);color:var(--ink);background:var(--page);font-family:var(--font-ui)}
.admin-sidebar{height:100vh;display:flex;flex-direction:column;padding:27px 18px 20px;background:var(--ink);color:#fff;border-right:1px solid color-mix(in srgb,var(--line) 18%,transparent)}
.admin-wordmark{display:flex;align-items:baseline;gap:8px;padding:0 10px 27px;color:#fff;font-family:var(--font-display);font-size:20px;font-weight:600;letter-spacing:-.06em}
.admin-wordmark span{color:#aeb6c2;font-family:var(--font-ui);font-size:10px;font-weight:500;letter-spacing:.12em;text-transform:uppercase}
.admin-sidebar nav{display:grid;gap:5px}
.admin-sidebar nav button{width:100%;display:grid;grid-template-columns:21px 1fr auto;align-items:center;gap:10px;padding:12px 11px;border:0;color:#b7b9b9;background:transparent;text-align:left;cursor:pointer;transition:background .16s ease,color .16s ease;clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%)}
.admin-sidebar nav button:hover{color:#fff;background:rgba(255,255,255,.06)}
.admin-sidebar nav button.is-active{color:#fff;background:var(--blue)}
.admin-sidebar nav button b{min-width:21px;padding:3px 6px;color:var(--ink);background:#fff;font-size:10px;text-align:center}
.admin-sidebar__security{display:grid;grid-template-columns:20px 1fr;gap:10px;margin-top:auto;padding:15px 11px;color:#96a79f;border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)}
.admin-sidebar__security span,.admin-profile>span:nth-child(2){min-width:0;display:grid;gap:2px}
.admin-sidebar__security b,.admin-profile b{color:#e9e9e5;font-size:11px;font-weight:500}
.admin-sidebar__security small,.admin-profile small{overflow:hidden;color:#8f9292;font-size:10px;text-overflow:ellipsis;white-space:nowrap}
.admin-profile{width:100%;display:grid;grid-template-columns:34px minmax(0,1fr) 18px;align-items:center;gap:10px;margin-top:14px;padding:8px;border:0;color:#fff;background:transparent;text-align:left;cursor:pointer}
.admin-profile>span:first-child{width:34px;height:34px;display:grid;place-items:center;background:var(--coral);font-size:11px;font-weight:600}
.admin-main{height:100vh;min-width:0;overflow:auto;padding:0 36px 48px}
.admin-topbar{min-height:112px;display:flex;align-items:center;justify-content:space-between;gap:32px;border-bottom:1px solid var(--line)}
.admin-eyebrow{display:block;color:var(--coral);font-size:10px;font-weight:600;letter-spacing:.15em;text-transform:uppercase}
.admin-topbar h1{margin:8px 0 0;font-family:var(--font-display);font-size:25px;font-weight:600;line-height:1.15;letter-spacing:-.045em}
.admin-refresh{display:flex;align-items:center;gap:18px}
.admin-refresh>span{display:grid;gap:2px;color:var(--muted);font-size:11px;text-align:right}
.admin-refresh small{font-size:10px}
.admin-button{min-height:42px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 15px;border:1px solid var(--line);color:var(--ink);background:var(--surface);font:500 13px/1 var(--font-ui);cursor:pointer;clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%)}
.admin-button:disabled{opacity:.55;cursor:wait}
.admin-button--ghost:hover{border-color:var(--blue);color:var(--blue)}
.admin-button--primary{color:#fff;background:var(--blue);border-color:var(--blue)}
.admin-button--danger{color:#fff;background:var(--danger-ink);border-color:var(--danger-ink)}
.admin-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:25px 0 18px}
.admin-stat{position:relative;min-height:132px;display:grid;grid-template-columns:1fr auto;gap:6px;padding:19px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%)}
.admin-stat:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--blue)}
.admin-stat>svg{grid-column:2;grid-row:1/3;color:var(--blue)}
.admin-stat>span{color:var(--muted);font-size:11px}
.admin-stat>strong{font-family:var(--font-display);font-size:25px;font-weight:600;letter-spacing:-.04em}
.admin-stat>small{grid-column:1/3;color:var(--muted);font-size:10px}
.admin-stat--green:before{background:var(--success)}.admin-stat--green>svg{color:var(--success)}
.admin-stat--red:before{background:var(--danger-ink)}.admin-stat--red>svg{color:var(--danger-ink)}
.admin-stat--coral:before{background:var(--coral)}.admin-stat--coral>svg{color:var(--coral)}
.admin-table-card{background:var(--surface);border:1px solid var(--line)}
.admin-table-tools{min-height:68px;display:flex;align-items:center;gap:14px;padding:12px 15px;border-bottom:1px solid var(--line)}
.admin-search{width:min(320px,31%);height:42px;display:flex;align-items:center;gap:9px;padding:0 12px;background:var(--surface-strong);border:1px solid var(--line)}
.admin-search svg{color:var(--blue);flex:0 0 auto}
.admin-search input{min-width:0;flex:1;border:0;outline:0;color:var(--ink);background:transparent;font:13px var(--font-ui)}
.admin-search button{padding:3px;border:0;color:var(--muted);background:none;cursor:pointer}
.admin-filters{display:flex;gap:5px;overflow:auto}
.admin-filters button{padding:9px 11px;border:1px solid transparent;color:var(--muted);background:transparent;font:12px var(--font-ui);white-space:nowrap;cursor:pointer}
.admin-filters button.is-active{color:var(--blue);background:var(--blue-soft);border-color:color-mix(in srgb,var(--blue) 28%,transparent)}
.admin-result-count{margin-left:auto;color:var(--muted);font-size:11px;white-space:nowrap}
.admin-table-scroll{overflow-x:auto}
.admin-users-table{width:100%;border-collapse:collapse;table-layout:fixed}
.admin-users-table th{padding:11px 13px;color:var(--muted);background:var(--surface-sunken);font-size:9px;font-weight:600;letter-spacing:.1em;text-align:left;text-transform:uppercase}
.admin-users-table th:nth-child(1){width:25%}.admin-users-table th:nth-child(2){width:18%}.admin-users-table th:nth-child(3){width:25%}.admin-users-table th:nth-child(4){width:14%}.admin-users-table th:nth-child(5){width:11%}.admin-users-table th:last-child{width:34px}
.admin-users-table td{height:68px;padding:11px 13px;border-top:1px solid var(--soft-line);font-size:12px;vertical-align:middle}
.admin-users-table tbody tr{cursor:pointer;transition:background .14s ease}
.admin-users-table tbody tr:hover{background:color-mix(in srgb,var(--blue-soft) 64%,transparent)}
.admin-users-table td:last-child{color:var(--muted);text-align:right}
.admin-user-cell{min-width:0;display:flex;align-items:center;gap:10px}
.admin-avatar{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;color:var(--blue);background:var(--blue-soft);font-size:10px;font-weight:600}
.admin-avatar--large{width:52px;height:52px;color:#fff;background:var(--blue);font-size:14px}
.admin-user-cell>span:last-child,.admin-access-cell{min-width:0;display:grid;gap:3px}
.admin-user-cell b,.admin-access-cell b{overflow:hidden;font-size:12px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}
.admin-user-cell small,.admin-access-cell small{overflow:hidden;color:var(--muted);font-size:10px;text-overflow:ellipsis;white-space:nowrap}
.admin-user-cell em{color:var(--coral);font-style:normal}
.admin-usage-cell{display:grid;grid-template-columns:minmax(70px,1fr) minmax(64px,1.4fr) 34px;align-items:center;gap:9px}
.admin-usage-cell>span{display:grid;gap:2px}.admin-usage-cell b{font-size:11px}.admin-usage-cell small{color:var(--muted);font-size:9px}
.admin-usage-cell>div{height:5px;overflow:hidden;background:var(--surface-sunken)}
.admin-usage-cell>div i{display:block;height:100%;background:var(--blue)}
.admin-usage-cell>em{color:var(--muted);font-size:10px;font-style:normal;text-align:right}.admin-usage-cell>em.is-warning{color:var(--coral);font-weight:600}
.admin-payment{display:inline-flex;align-items:center;gap:7px;width:max-content;padding:6px 8px;font-size:10px;font-weight:500;white-space:nowrap}
.admin-payment i{width:6px;height:6px;border-radius:50%}
.admin-payment--paid{color:#315e4c;background:#edf5f0}.admin-payment--paid i{background:var(--success)}
.admin-payment--unpaid{color:var(--danger-ink);background:var(--red-100)}.admin-payment--unpaid i{background:var(--danger)}
.admin-payment--not_required{color:var(--muted);background:var(--surface-sunken)}.admin-payment--not_required i{background:var(--muted)}
.admin-ticket-count{display:inline-flex;align-items:center;gap:5px;color:var(--coral);font-weight:600}.admin-muted{color:var(--muted)}
.admin-empty{min-height:220px;display:grid;place-items:center;align-content:center;gap:8px;color:var(--muted)}
.admin-empty b{color:var(--ink)}
.admin-error{display:flex;align-items:center;gap:10px;margin:18px 0;padding:13px 15px;color:var(--danger-ink);background:var(--red-100);border:1px solid var(--red-200)}
.admin-error span{margin-right:auto}.admin-error button{border:0;color:inherit;background:none;text-decoration:underline;cursor:pointer}
.admin-icon-button{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);color:var(--ink);background:var(--surface);cursor:pointer}
.admin-drawer-backdrop,.admin-dialog-backdrop{position:fixed;inset:0;z-index:200;background:color-mix(in srgb,#090909 34%,transparent);backdrop-filter:blur(2px)}
.admin-user-drawer{position:absolute;right:0;top:0;width:min(580px,100%);height:100%;display:grid;grid-template-rows:auto auto 1fr;background:var(--surface-strong);border-left:1px solid var(--blue);box-shadow:-16px 0 50px rgba(0,0,0,.13)}
.admin-user-drawer>header{display:grid;grid-template-columns:38px 52px 1fr;gap:13px;align-items:center;padding:22px 24px 17px;border-bottom:1px solid var(--line)}
.admin-user-drawer>header>div:last-child{min-width:0}.admin-user-drawer>header span{color:var(--coral);font-size:9px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.admin-user-drawer h2{margin:4px 0 3px;font-family:var(--font-display);font-size:19px;font-weight:600;letter-spacing:-.04em}
.admin-user-drawer header a{color:var(--muted);font-size:12px}
.admin-drawer__actions{display:flex;align-items:center;gap:8px;padding:13px 24px;border-bottom:1px solid var(--line)}
.admin-text-danger{margin-left:auto;padding:9px;border:0;color:var(--danger-ink);background:none;font:500 12px var(--font-ui);cursor:pointer}
.admin-drawer__scroll{overflow:auto;padding:0 24px 40px}
.admin-detail-section{padding:23px 0;border-bottom:1px solid var(--line)}
.admin-section-title{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:15px}
.admin-section-title h3{margin:0;font-family:var(--font-display);font-size:14px;font-weight:600;letter-spacing:-.035em}
.admin-section-title>span,.admin-section-title>b{color:var(--muted);font-size:10px}
.admin-description-list{display:grid;grid-template-columns:1fr 1fr;margin:0;border:1px solid var(--line)}
.admin-description-list>div{padding:12px 13px;border-right:1px solid var(--soft-line);border-bottom:1px solid var(--soft-line)}
.admin-description-list>div:nth-child(2n){border-right:0}.admin-description-list>div:nth-last-child(-n+2){border-bottom:0}
.admin-description-list dt{color:var(--muted);font-size:9px;text-transform:uppercase}.admin-description-list dd{margin:5px 0 0;font-size:11px;font-weight:500}
.admin-usage-large{height:7px;overflow:hidden;background:var(--surface-sunken)}.admin-usage-large span{display:block;height:100%;background:var(--blue)}
.admin-usage-total{display:flex;align-items:baseline;gap:7px;margin-top:10px}.admin-usage-total strong{font-family:var(--font-display);font-size:23px}.admin-usage-total span{color:var(--muted);font-size:11px}
.admin-usage-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:15px;border:1px solid var(--line)}
.admin-usage-grid>div{display:grid;gap:3px;padding:11px;border-right:1px solid var(--soft-line)}.admin-usage-grid>div:last-child{border:0}
.admin-usage-grid span,.admin-usage-grid small{color:var(--muted);font-size:9px}.admin-usage-grid b{font-size:11px}
.admin-timeline{display:grid}.admin-timeline>div{display:grid;grid-template-columns:8px 1fr 16px;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--soft-line)}
.admin-timeline>div:last-child{border:0}.admin-timeline i{width:7px;height:7px;background:var(--success)}.admin-timeline span{display:grid;gap:2px}.admin-timeline b{font-size:11px}.admin-timeline small{color:var(--muted);font-size:9px}.admin-timeline svg{color:var(--success)}
.admin-empty-mini{padding:15px;color:var(--muted);background:var(--surface-sunken);font-size:11px;text-align:center}
.admin-link-row{width:100%;display:grid;grid-template-columns:20px 1fr 18px;align-items:center;gap:10px;padding:13px;border:1px solid var(--line);color:var(--blue);background:var(--surface);text-align:left;cursor:pointer}.admin-link-row span{color:var(--ink)}
.admin-dialog-backdrop{display:grid;place-items:center;padding:18px}
.admin-dialog{position:relative;width:min(480px,100%);display:grid;gap:15px;padding:30px;background:var(--surface-strong);border:1px solid var(--blue);box-shadow:0 24px 70px rgba(0,0,0,.16);clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%)}
.admin-dialog--danger{border-color:var(--danger-ink)}
.admin-dialog__close{position:absolute;right:16px;top:16px}
.admin-dialog h2{max-width:80%;margin:-5px 0 0;font-family:var(--font-display);font-size:21px;font-weight:600;letter-spacing:-.04em}
.admin-dialog>p{margin:-7px 0 2px;color:var(--muted);font-size:12px}
.admin-field{display:grid;gap:6px;color:var(--muted);font-size:10px;font-weight:500;letter-spacing:.04em}
.admin-field input,.admin-field select,.admin-field textarea{width:100%;min-height:43px;padding:10px 11px;color:var(--ink);background:var(--surface);border:1px solid var(--line);outline:0;font:12px var(--font-ui)}
.admin-field textarea{min-height:75px;resize:vertical}.admin-field input:focus,.admin-field select:focus,.admin-field textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px var(--focus-ring)}
.admin-neutral-note,.admin-danger-note{display:flex;gap:9px;padding:11px 12px;color:var(--muted);background:var(--surface-sunken);font-size:10px;line-height:1.45}.admin-neutral-note svg{color:var(--success);flex:0 0 auto}
.admin-danger-note{color:var(--danger-ink);background:var(--red-100)}.admin-danger-note svg{flex:0 0 auto}
.admin-dialog__actions{display:flex;justify-content:flex-end;gap:8px;padding-top:4px}.admin-form-error{padding:10px!important;margin:0!important;color:var(--danger-ink)!important;background:var(--red-100)}
.admin-toast{position:fixed;right:24px;bottom:22px;z-index:300;max-width:460px;display:flex;align-items:center;gap:10px;padding:13px 15px;color:#fff;background:var(--ink);box-shadow:0 14px 40px rgba(0,0,0,.18)}
.admin-toast>svg{color:var(--green-200)}.admin-toast span{font-size:12px}.admin-toast button{margin-left:auto;border:0;color:#fff;background:none;cursor:pointer}
.admin-inbox{height:calc(100vh - 142px);display:grid;grid-template-columns:minmax(300px,39%) 1fr;margin-top:24px;background:var(--surface);border:1px solid var(--line)}
.admin-inbox__list{overflow:auto;border-right:1px solid var(--line)}
.admin-inbox__list>button{width:100%;display:grid;grid-template-columns:8px 1fr 18px;gap:10px;padding:17px;border:0;border-bottom:1px solid var(--soft-line);color:var(--ink);background:transparent;text-align:left;cursor:pointer}
.admin-inbox__list>button:hover{background:var(--blue-soft)}.admin-inbox__list span:nth-child(2){min-width:0;display:grid;gap:5px}.admin-inbox__list small{color:var(--muted);font-size:9px}.admin-inbox__list b{font-size:12px}.admin-inbox__list p{overflow:hidden;margin:0;color:var(--muted);font-size:10px;text-overflow:ellipsis;white-space:nowrap}
.admin-inbox__list>button.is-active{background:var(--blue-soft);box-shadow:inset 3px 0 0 var(--blue)}
.admin-inbox__dot{width:7px;height:7px;margin-top:4px;background:var(--muted)}.admin-inbox__dot--open{background:var(--coral)}.admin-inbox__dot--waiting_user{background:var(--success)}
.admin-inbox__empty{display:grid;place-items:center;align-content:center;gap:10px;padding:36px;text-align:center}.admin-inbox__empty>svg{color:var(--blue)}.admin-inbox__empty h2{margin:4px 0 0;font-family:var(--font-display);font-size:20px}.admin-inbox__empty p{max-width:52ch;margin:0;color:var(--muted);font-size:12px;line-height:1.55}.admin-inbox__empty>div{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap;justify-content:center}.admin-inbox__empty button{padding:7px 9px;border:1px solid var(--line);color:var(--blue);background:var(--surface);font-size:10px}
.admin-support-chat{min-width:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;overflow:hidden}
.admin-support-chat>header{display:flex;align-items:center;gap:16px;padding:16px 18px;border-bottom:1px solid var(--line)}.admin-support-chat>header>div{min-width:0;display:grid;gap:3px}.admin-support-chat>header span{color:var(--muted);font-size:9px}.admin-support-chat>header h2{overflow:hidden;margin:0;font-family:var(--font-display);font-size:15px;text-overflow:ellipsis;white-space:nowrap}.admin-support-chat>header button{margin-left:auto;padding:8px 10px;border:1px solid var(--line);color:var(--muted);background:var(--surface);font-size:9px;cursor:pointer}.admin-support-chat>header button:disabled{color:var(--success);cursor:default}
.admin-support-chat__messages{display:flex;flex-direction:column;gap:12px;overflow:auto;padding:20px}.admin-support-chat__messages>div{width:min(72%,520px);display:grid;gap:5px;padding:12px 14px;background:var(--surface-sunken)}.admin-support-chat__messages>div.is-admin{align-self:flex-end;background:var(--blue-soft);border-right:3px solid var(--blue)}.admin-support-chat__messages>div.is-user{align-self:flex-start;border-left:3px solid var(--coral)}.admin-support-chat__messages span,.admin-support-chat__messages small{color:var(--muted);font-size:8px}.admin-support-chat__messages p{margin:0;font-size:11px;line-height:1.55}.admin-support-chat__messages small{text-align:right}
.admin-support-chat__quick{display:flex;align-items:center;gap:5px;padding:9px 13px;border-top:1px solid var(--soft-line);overflow:auto}.admin-support-chat__quick span{color:var(--muted);font-size:9px;white-space:nowrap}.admin-support-chat__quick button{padding:6px 8px;border:1px solid var(--line);color:var(--blue);background:var(--surface);font-size:9px;white-space:nowrap;cursor:pointer}
.admin-support-chat__reply{display:grid;grid-template-columns:1fr 44px;gap:8px;padding:12px 13px;border-top:1px solid var(--line)}.admin-support-chat__reply textarea{min-height:46px;max-height:100px;padding:10px;border:1px solid var(--line);outline:0;resize:none;font:11px var(--font-ui)}.admin-support-chat__reply textarea:focus{border-color:var(--blue)}.admin-support-chat__reply button{display:grid;place-items:center;border:0;color:#fff;background:var(--blue);cursor:pointer}.admin-support-chat__reply button:disabled{opacity:.45;cursor:not-allowed}
.admin-audit-list{margin-top:24px;background:var(--surface);border:1px solid var(--line)}
.admin-audit-list article{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:13px;padding:15px 17px;border-bottom:1px solid var(--soft-line)}.admin-audit-list article:last-child{border:0}
.admin-audit-list article>span{width:34px;height:34px;display:grid;place-items:center;color:var(--blue);background:var(--blue-soft)}.admin-audit-list article>div{display:grid;gap:3px}.admin-audit-list b{font-size:12px}.admin-audit-list p{margin:0;color:var(--muted);font-size:10px}.admin-audit-list time{color:var(--muted);font-size:10px}
.admin-security-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px}.admin-security-grid article{min-height:230px;display:flex;flex-direction:column;padding:24px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%)}
.admin-security-grid article>svg{margin-bottom:25px;color:var(--blue)}.admin-security-grid h2{margin:9px 0 10px;font-family:var(--font-display);font-size:18px}.admin-security-grid p{margin:0;color:var(--muted);font-size:12px;line-height:1.6}.admin-security-grid b{display:flex;align-items:center;gap:7px;margin-top:auto;padding-top:18px;color:var(--success);font-size:11px}.admin-security-grid b.is-neutral{color:var(--coral)}
.admin-security-events{margin:18px 0 34px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%)}.admin-security-events>header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px 22px;border-bottom:1px solid var(--line);background:var(--surface-sunken)}.admin-security-events>header h2{margin:5px 0 4px;font-family:var(--font-display);font-size:18px}.admin-security-events>header p{margin:0;color:var(--muted);font-size:10px}.admin-security-events>header>div:last-child{display:grid;grid-template-columns:auto auto;align-items:baseline;gap:2px 8px;text-align:right}.admin-security-events>header strong{color:var(--ink);font:600 18px var(--font-display)}.admin-security-events>header>div:last-child span{color:var(--muted);font-size:9px}
.admin-security-events__list article{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:13px;padding:13px 17px;border-bottom:1px solid var(--soft-line)}.admin-security-events__list article:last-child{border-bottom:0}.admin-security-events__list article>div{min-width:0;display:grid;gap:3px}.admin-security-events__list b{font-size:11px}.admin-security-events__list p{overflow:hidden;margin:0;color:var(--muted);font:9px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;text-overflow:ellipsis;white-space:nowrap}.admin-security-events__list time{color:var(--muted);font-size:9px;white-space:nowrap}.admin-risk{width:40px;height:32px;display:grid;place-items:center;font:600 11px var(--font-display);border:1px solid}.admin-risk--critical{color:var(--danger-ink);background:var(--red-100);border-color:color-mix(in srgb,var(--danger-ink) 35%,var(--line))}.admin-risk--high{color:var(--coral);background:var(--coral-soft);border-color:color-mix(in srgb,var(--coral) 40%,var(--line))}.admin-security-events__empty{min-height:150px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;color:var(--muted)}.admin-security-events__empty svg{color:var(--success)}.admin-security-events__empty b{color:var(--ink);font-size:12px}.admin-security-events__empty span{font-size:10px}
.admin-gate{min-height:100vh;display:grid;place-items:center;align-content:center;gap:13px;padding:30px;color:var(--ink);background:var(--page);text-align:center}
.admin-gate__mark{width:62px;height:62px;display:grid;place-items:center;margin-bottom:7px;color:#fff;background:var(--blue);clip-path:polygon(0 0,calc(100% - 13px) 0,100% 13px,100% 100%,0 100%)}
.admin-gate h1{max-width:18ch;margin:0;font-family:var(--font-display);font-size:27px;letter-spacing:-.045em}.admin-gate p{max-width:52ch;margin:0 0 8px;color:var(--muted);font-size:13px;line-height:1.6}.admin-gate>a{margin-top:8px;color:var(--muted);font-size:11px;text-decoration:underline}
.is-spinning{animation:admin-spin .8s linear infinite}@keyframes admin-spin{to{transform:rotate(360deg)}}
@media(max-width:1180px){.admin-shell{grid-template-columns:78px minmax(0,1fr)}.admin-sidebar{padding-inline:12px}.admin-wordmark{padding-inline:0;font-size:15px}.admin-wordmark span,.admin-sidebar nav button span,.admin-sidebar__security span,.admin-profile>span:nth-child(2),.admin-profile>svg{display:none}.admin-sidebar nav button{grid-template-columns:1fr;place-items:center}.admin-sidebar nav button b{position:absolute;margin:0 0 30px 28px}.admin-sidebar__security{display:grid;place-items:center;grid-template-columns:1fr}.admin-profile{grid-template-columns:1fr;place-items:center}.admin-main{padding-inline:24px}.admin-stats{grid-template-columns:1fr 1fr}.admin-users-table{min-width:980px}}
@media(max-width:760px){body.p-admin{overflow:auto}.admin-shell{display:block}.admin-sidebar{position:sticky;top:0;z-index:30;width:100%;height:auto;display:grid;grid-template-columns:auto 1fr auto;align-items:center;padding:10px 14px}.admin-wordmark{padding:0}.admin-sidebar nav{display:flex;justify-content:center}.admin-sidebar nav button{width:44px}.admin-sidebar__security{display:none}.admin-profile{width:40px;margin:0}.admin-main{height:auto;min-height:calc(100vh - 60px);padding:0 14px 35px}.admin-topbar{min-height:128px;align-items:flex-start;padding-top:20px}.admin-topbar h1{font-size:21px}.admin-refresh{align-items:flex-end;flex-direction:column-reverse;gap:7px}.admin-refresh>span{font-size:9px}.admin-refresh small{display:none}.admin-refresh .admin-button{min-height:38px;padding:8px 10px;font-size:0}.admin-refresh .admin-button svg{width:18px}.admin-stats{grid-template-columns:1fr 1fr;padding-top:15px}.admin-stat{min-height:112px;padding:14px}.admin-stat>strong{font-size:20px}.admin-table-tools{align-items:stretch;flex-direction:column}.admin-search{width:100%}.admin-result-count{display:none}.admin-filters{width:100%}.admin-inbox{height:auto;min-height:600px;grid-template-columns:1fr}.admin-inbox__list{border-right:0}.admin-inbox__empty{display:none}.admin-support-chat{min-height:520px}.admin-support-chat__messages>div{width:86%}.admin-security-grid{grid-template-columns:1fr}.admin-security-events>header{align-items:flex-start;flex-direction:column}.admin-security-events>header>div:last-child{text-align:left}.admin-security-events__list article{grid-template-columns:44px minmax(0,1fr)}.admin-security-events__list time{grid-column:2}.admin-user-drawer>header{grid-template-columns:38px 1fr}.admin-user-drawer>header .admin-avatar{display:none}.admin-drawer__actions{flex-wrap:wrap}.admin-description-list{grid-template-columns:1fr}.admin-description-list>div{border-right:0}.admin-description-list>div:nth-last-child(2){border-bottom:1px solid var(--soft-line)}.admin-dialog{padding:25px 20px}.admin-toast{left:14px;right:14px;bottom:14px}.admin-audit-list article{grid-template-columns:36px 1fr}.admin-audit-list time{grid-column:2}}
.support-launcher{position:fixed;right:24px;bottom:22px;z-index:118;min-height:46px;display:flex;align-items:center;gap:8px;padding:11px 15px;border:1px solid var(--blue);color:#fff;background:var(--blue);font:500 13px var(--font-ui);box-shadow:0 10px 28px rgba(37,49,59,.18);cursor:pointer;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}
.support-launcher.is-open{color:var(--blue);background:var(--surface-strong)}
.support-panel{position:fixed;right:24px;bottom:80px;z-index:118;width:min(390px,calc(100vw - 32px));height:min(610px,calc(100vh - 110px));display:grid;grid-template-rows:auto 1fr;color:var(--ink);background:var(--surface-strong);border:1px solid var(--blue);box-shadow:0 22px 60px rgba(0,0,0,.17);clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}
.support-panel>header{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:17px 18px;color:#fff;background:var(--blue)}
.support-panel>header button{width:32px;height:32px;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.35);color:#fff;background:transparent;cursor:pointer}
.support-panel>header span{display:block;color:#cbd1d9;font-size:9px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}.support-panel>header h2{margin:3px 0 0;font-family:var(--font-display);font-size:16px;font-weight:600;letter-spacing:-.035em}
.support-panel>header>i{width:8px;height:8px;background:var(--green-200);border-radius:50%;box-shadow:0 0 0 4px rgba(126,240,193,.12)}
.support-panel__body{min-height:0;overflow:auto;padding:18px}
.support-intro{margin:0 0 14px;color:var(--muted);font-size:12px;line-height:1.55}
.support-assistant-entry{display:grid;gap:11px;margin-bottom:17px;padding:14px;border:1px solid color-mix(in srgb,var(--blue) 52%,var(--line));background:linear-gradient(145deg,var(--blue-soft),var(--surface) 72%);clip-path:polygon(0 0,calc(100% - 11px) 0,100% 11px,100% 100%,0 100%)}
.support-assistant-entry>div{display:flex;align-items:center;gap:9px;color:var(--blue)}.support-assistant-entry>div>span{display:grid;gap:2px}.support-assistant-entry b{color:var(--ink);font-size:12px}.support-assistant-entry small{color:var(--muted);font-size:9px}
.support-assistant-entry form,.support-assistant-compose{display:grid;grid-template-columns:minmax(0,1fr) 42px;gap:7px}.support-assistant-entry textarea,.support-assistant-compose textarea{width:100%;min-height:48px;max-height:92px;padding:10px 11px;border:1px solid var(--line);outline:0;color:var(--ink);background:var(--surface-strong);font:11px/1.45 var(--font-ui);resize:none}.support-assistant-entry textarea:focus,.support-assistant-compose textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px var(--focus-ring)}.support-assistant-entry form button,.support-assistant-compose button{display:grid;place-items:center;border:0;color:#fff;background:var(--blue);cursor:pointer}.support-assistant-entry form button:disabled,.support-assistant-compose button:disabled{opacity:.45;cursor:not-allowed}
.support-assistant-entry>p{display:flex;align-items:flex-start;gap:6px;margin:0;color:var(--muted);font-size:9px;line-height:1.4}.support-assistant-entry>p svg{flex:0 0 auto;color:var(--coral)}.support-assistant-resume{display:flex;align-items:center;justify-content:space-between;padding:8px 0 0;border:0;border-top:1px solid var(--soft-line);color:var(--blue);background:transparent;font:500 10px var(--font-ui);cursor:pointer}
.support-assistant-chat{height:100%;min-height:0;display:grid;grid-template-rows:auto minmax(180px,1fr) auto auto;gap:10px}.support-assistant-notice{display:flex;align-items:center;gap:8px;padding:9px 10px;color:var(--blue);background:var(--blue-soft)}.support-assistant-notice>span{display:grid;gap:2px}.support-assistant-notice b{color:var(--ink);font-size:10px}.support-assistant-notice small{color:var(--muted);font-size:8px;line-height:1.35}
.support-assistant-messages{min-height:0;display:flex;flex-direction:column;gap:10px;overflow:auto;padding:2px 3px 4px 0;scrollbar-width:thin}.support-assistant-messages article{width:89%;display:grid;gap:5px;padding:10px 11px;background:var(--surface-sunken);border-left:3px solid var(--blue)}.support-assistant-messages article.is-user{align-self:flex-end;background:var(--blue-soft);border-left:0;border-right:3px solid var(--blue)}.support-assistant-messages article.is-blocked{border-left-color:var(--coral);background:var(--coral-soft)}.support-assistant-messages article>span{color:var(--muted);font-size:8px;font-weight:600;letter-spacing:.04em}.support-assistant-messages article>p{margin:0;color:var(--ink);font-size:11px;line-height:1.52;white-space:pre-line;overflow-wrap:anywhere}.support-assistant-messages article>div{display:grid;gap:5px;margin-top:2px}.support-assistant-messages article a{display:flex;align-items:center;justify-content:space-between;gap:7px;padding:7px 8px;color:var(--blue);background:var(--surface-strong);font-size:9px}.support-assistant-empty{margin:auto;color:var(--muted);font-size:11px;line-height:1.5;text-align:center}
.support-assistant-typing{width:max-content;display:flex;align-items:center;gap:4px;padding:10px 12px;background:var(--surface-sunken)}.support-assistant-typing i{width:5px;height:5px;background:var(--blue);border-radius:50%;animation:support-dot 1s ease-in-out infinite}.support-assistant-typing i:nth-child(2){animation-delay:.13s}.support-assistant-typing i:nth-child(3){animation-delay:.26s}@keyframes support-dot{0%,100%{opacity:.35;transform:translateY(0)}50%{opacity:1;transform:translateY(-2px)}}
.support-assistant-compose{padding-top:10px;border-top:1px solid var(--line)}.support-assistant-human{padding:8px;border:0;color:var(--coral);background:transparent;font:500 10px var(--font-ui);cursor:pointer}
.support-quick-list{display:grid;border:1px solid var(--line)}.support-quick-list>button{display:grid;grid-template-columns:20px 1fr 17px;align-items:center;gap:9px;padding:12px;border:0;border-bottom:1px solid var(--soft-line);color:var(--ink);background:var(--surface);font:12px var(--font-ui);text-align:left;cursor:pointer}.support-quick-list>button:last-child{border:0}.support-quick-list>button:hover{background:var(--blue-soft)}.support-quick-list svg:first-child{color:var(--blue)}.support-quick-list svg:last-child{color:var(--muted)}
.support-human{width:100%;display:grid;grid-template-columns:24px 1fr 18px;align-items:center;gap:10px;margin-top:12px;padding:14px;border:1px solid color-mix(in srgb,var(--coral) 45%,var(--line));color:var(--coral);background:var(--coral-soft);text-align:left;cursor:pointer}.support-human>span{display:grid;gap:3px}.support-human b{color:var(--ink);font-size:12px}.support-human small{color:var(--muted);font-size:9px}
.support-threads{margin-top:20px}.support-threads h3{margin:0 0 8px;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.support-threads>button{width:100%;display:flex;align-items:center;gap:10px;padding:10px 0;border:0;border-bottom:1px solid var(--soft-line);color:var(--ink);background:none;text-align:left;cursor:pointer}.support-threads>button>span{display:grid;gap:3px;min-width:0}.support-threads b{overflow:hidden;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.support-threads small{color:var(--muted);font-size:9px}.support-threads em{margin-left:auto;color:var(--blue);font-size:9px;font-style:normal;white-space:nowrap}
.support-answer{display:grid;gap:15px}.support-answer>svg{color:var(--success)}.support-answer p{margin:0;color:var(--ink);font-size:13px;line-height:1.65}.support-answer a{display:flex;align-items:center;gap:7px;padding:12px;color:var(--blue);background:var(--blue-soft);font-size:11px}.support-answer button{padding:11px;border:1px solid var(--line);color:var(--ink);background:var(--surface);font:11px var(--font-ui);cursor:pointer}
.support-form{display:grid;gap:13px}.support-form label{display:grid;gap:6px;color:var(--muted);font-size:10px}.support-form input,.support-form select,.support-form textarea{width:100%;min-height:42px;padding:10px 11px;border:1px solid var(--line);outline:0;color:var(--ink);background:var(--surface);font:12px var(--font-ui)}.support-form textarea{min-height:110px;resize:vertical}.support-form input:focus,.support-form select:focus,.support-form textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px var(--focus-ring)}.support-form>small{color:var(--muted);font-size:9px;line-height:1.45}.support-submit{min-height:42px;display:flex;align-items:center;justify-content:center;gap:8px;border:0;color:#fff;background:var(--blue);font:500 12px var(--font-ui);cursor:pointer}.support-submit:disabled{opacity:.5;cursor:not-allowed}
.support-conversation{height:100%;display:grid;grid-template-rows:auto minmax(260px,1fr) auto}.support-conversation__meta{display:flex;align-items:center;gap:10px;padding-bottom:12px;border-bottom:1px solid var(--line)}.support-conversation__meta b{font-size:11px}.support-conversation__meta span{margin-left:auto;color:var(--success);font-size:9px}.support-messages{display:flex;flex-direction:column;gap:10px;overflow:auto;padding:14px 0}.support-messages>div{max-width:84%;display:grid;gap:4px;padding:10px 11px;background:var(--surface-sunken)}.support-messages>div.is-user{align-self:flex-end;background:var(--blue-soft)}.support-messages>div.is-admin{align-self:flex-start;border-left:3px solid var(--coral)}.support-messages span,.support-messages small{color:var(--muted);font-size:8px}.support-messages p{margin:0;font-size:11px;line-height:1.5}.support-messages small{text-align:right}.support-reply{display:grid;grid-template-columns:1fr 40px;gap:7px;padding-top:10px;border-top:1px solid var(--line)}.support-reply textarea{min-height:42px;max-height:90px;padding:10px;border:1px solid var(--line);outline:0;resize:none;font:11px var(--font-ui)}.support-reply button{display:grid;place-items:center;border:0;color:#fff;background:var(--blue);cursor:pointer}.support-reply button:disabled{opacity:.45}
.support-loading,.support-error{margin-top:10px;padding:10px;color:var(--muted);background:var(--surface-sunken);font-size:10px}.support-error{color:var(--danger-ink);background:var(--red-100)}
@media(prefers-reduced-motion:reduce){.support-assistant-typing i{animation:none}}
@media(max-width:600px){.support-launcher{right:16px;bottom:max(16px,env(safe-area-inset-bottom))}.support-panel{right:16px;bottom:calc(72px + env(safe-area-inset-bottom));width:calc(100vw - 32px);height:min(650px,calc(100dvh - 94px - env(safe-area-inset-bottom)))}}
.upcoming-lab {
  font-family: "Golos Text", system-ui, sans-serif;
  color: #202326;
  background: #f2eee5;
  font-synthesis: none;
  --paper: #f8f5ed;
  --ink: #202326;
  --muted: #6f716d;
  --line: #c9c6bc;
  --blue: #526c80;
  --blue-dark: #344b5d;
  --terracotta: #bd674d;
  --success: #326757;
  --danger: #9b3d32;
}

.upcoming-lab, .upcoming-lab * { box-sizing: border-box; }
.upcoming-lab button, .upcoming-lab input, .upcoming-lab select { font: inherit; }
.upcoming-lab button, .upcoming-lab a { -webkit-tap-highlight-color: transparent; }
.upcoming-lab button:focus-visible, .upcoming-lab a:focus-visible, .upcoming-lab input:focus-visible, .upcoming-lab select:focus-visible { outline: 3px solid rgba(189, 103, 77, .45); outline-offset: 2px; }
.upcoming-lab .visually-hidden { position: absolute; width: 1px; height: 1px; clip: rect(0 0 0 0); overflow: hidden; }
.lab-skip { position: fixed; top: -60px; left: 16px; z-index: 100; background: #fff; color: var(--ink); padding: 12px 18px; }
.lab-skip:focus { top: 12px; }

.upcoming-lab { position: fixed; inset: 0; z-index: 2400; width: 100%; height: 100dvh; display: grid; grid-template-rows: 84px 34px minmax(0, 1fr); background: var(--paper); }
.lab-header { display: grid; grid-template-columns: 220px minmax(0, 1fr) auto; align-items: center; gap: 24px; padding: 12px 22px; border-bottom: 1px solid var(--line); }
.lab-wordmark { font-family: "Unbounded", sans-serif; color: var(--ink); font-weight: 700; font-size: 25px; letter-spacing: -.04em; text-decoration: none; }
.lab-header > div p, .lab-kicker { margin: 0 0 5px; color: var(--terracotta); font-size: 10px; font-weight: 700; letter-spacing: .16em; }
.lab-header h1 { margin: 0; font-family: "Unbounded", sans-serif; font-size: clamp(18px, 2vw, 27px); letter-spacing: -.04em; }
.lab-help { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; color: var(--ink); border: 1px solid var(--line); text-decoration: none; padding: 0 14px; clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 9px 100%, 0 calc(100% - 9px)); }
.lab-header__actions { display: flex; align-items: center; gap: 8px; }
.lab-header__actions .lab-help { background: transparent; cursor: pointer; }
.lab-progress { position: relative; display: flex; align-items: center; min-width: 0; padding: 0 22px; background: #e7e2d8; color: #4e504e; font-size: 12px; overflow: hidden; }
.lab-progress i { position: absolute; inset: auto auto 0 0; height: 3px; background: var(--terracotta); transition: width .28s ease; }
.lab-progress span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

.lab-workspace { min-height: 0; display: grid; grid-template-columns: 244px minmax(360px, 1fr) 348px; }
.lab-tools, .lab-inspector { min-height: 0; background: #eae5dc; }
.lab-tools { display: flex; flex-direction: column; border-right: 1px solid var(--line); padding: 16px 12px; overflow-y: auto; }
.lab-tools > .lab-kicker { padding: 0 8px 8px; }
.lab-tools > button:not(.lab-add) { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 8px; align-items: center; width: 100%; min-height: 51px; border: 0; border-bottom: 1px solid rgba(100, 99, 93, .18); background: transparent; color: var(--ink); text-align: left; cursor: pointer; }
.lab-tools > button:not(.lab-add):hover { background: rgba(255, 255, 255, .42); }
.lab-tools > button:not(.lab-add).is-active { background: var(--blue-dark); color: white; clip-path: polygon(0 0, calc(100% - 11px) 0, 100% 11px, 100% 100%, 0 100%); }
.lab-tools > button span { font-family: "Unbounded", sans-serif; font-size: 10px; opacity: .65; }
.lab-tools > button b { font-size: 12px; line-height: 1.2; }
.lab-tools > button small { font-size: 9px; opacity: .67; }
.lab-file-list { margin-top: 18px; padding: 12px 7px; border-top: 1px solid var(--line); }
.lab-file-list > b { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; }
.lab-file-list > div { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 3px 8px; margin-top: 9px; padding: 8px 31px 8px 8px; background: rgba(255, 255, 255, .52); }
.lab-file-list span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.lab-file-list small { font-size: 9px; color: var(--muted); }
.lab-file-list button { position: absolute; right: 5px; top: 8px; border: 0; background: transparent; color: var(--danger); cursor: pointer; }
.lab-add { margin-top: auto; min-height: 43px; display: flex; align-items: center; justify-content: center; gap: 8px; border: 1px dashed var(--blue); background: transparent; color: var(--blue-dark); cursor: pointer; }

.lab-stage { min-width: 0; min-height: 0; display: grid; grid-template-rows: 52px auto auto; background: #d7d5cf; overflow: auto; }
.lab-stage--single-upload { grid-template-rows: auto auto; }
.lab-stage__top { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; justify-content: space-between; padding: 0 18px; background: rgba(248, 245, 237, .96); border-bottom: 1px solid var(--line); }
.lab-stage__top > span { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }
.lab-stage__top button { min-height: 34px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--line); background: white; cursor: pointer; }
.lab-stage__top button:disabled { opacity: .5; cursor: not-allowed; }
.lab-preview { min-height: 370px; display: grid; place-items: center; padding: 26px; overflow: auto; }
.lab-empty, .lab-summary-preview { width: min(580px, 92%); min-height: 300px; display: grid; place-items: center; align-content: center; text-align: center; padding: 36px; background: var(--paper); border: 1px dashed #9f9d96; clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px)); }
.lab-empty h2, .lab-summary-preview h2 { margin: 16px 0 6px; font-family: "Unbounded", sans-serif; font-size: 19px; }
.lab-empty p, .lab-summary-preview p { max-width: 470px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.lab-empty--action { color: var(--ink); cursor: pointer; transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.lab-empty--action:hover { border-color: var(--terracotta); box-shadow: 0 18px 44px rgba(43, 46, 45, .12); transform: translateY(-2px); }
.lab-empty--action > svg { color: var(--terracotta); }
.lab-empty__title { margin: 16px 0 6px; font-family: "Unbounded", sans-serif; font-size: 19px; font-weight: 700; }
.lab-empty__copy { max-width: 470px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.lab-empty__cta { min-height: 42px; display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; padding: 0 18px; color: white; background: var(--terracotta); font-size: 12px; font-weight: 700; clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 0 100%); }
.lab-empty--action small { margin-top: 8px; color: var(--muted); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.pdf-preview { display: grid; gap: 8px; width: min(780px, 95%); }
.pdf-page-controls { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 7px 9px; background: rgba(248, 245, 237, .96); border: 1px solid var(--line); }
.pdf-page-controls label { display: flex; align-items: center; gap: 7px; font-size: 10px; font-weight: 700; }
.pdf-page-controls input { width: 62px; min-height: 34px; padding: 5px 7px; border: 1px solid #aaa9a3; background: white; }
.pdf-page-controls button { min-height: 34px; padding: 5px 10px; border: 1px solid var(--line); background: var(--paper); cursor: pointer; }
.pdf-page-controls button:disabled { opacity: .45; cursor: not-allowed; }
.pdf-page-controls > span { color: var(--muted); font-size: 10px; }
.pdf-canvas { position: relative; width: max-content; max-width: 100%; max-height: calc(100vh - 270px); justify-self: center; user-select: none; touch-action: none; box-shadow: 0 18px 50px rgba(43, 46, 45, .18); }
.pdf-canvas canvas { display: block; max-width: 100%; max-height: calc(100vh - 230px); background: white; }
.pdf-region { position: absolute; border: 2px solid var(--terracotta); background: rgba(189, 103, 77, .08); pointer-events: none; }
.pdf-region:not(.is-active) { border-style: dashed; opacity: .62; }
.pdf-detected-table { position: absolute; z-index: 2; border: 2px solid #4f6c86; background: rgba(79, 108, 134, .09); pointer-events: none; }
.pdf-detected-table.is-ocr { border-color: #7a5aa6; background: rgba(122, 90, 166, .1); }
.pdf-detected-table > span { position: absolute; right: 0; top: -21px; padding: 2px 6px; color: white; background: #4f6c86; font-size: 9px; }
.pdf-detected-table > i { position: absolute; display: block; background: rgba(79, 108, 134, .8); }
.pdf-detected-table > i.is-column { top: 0; bottom: 0; width: 1px; }
.pdf-detected-table > i.is-row { left: 0; right: 0; height: 1px; }
.pdf-region { z-index: 3; }
.lab-region-list { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 10px; }
.lab-region-list button { border: 1px solid var(--line); border-radius: 8px; background: var(--paper); padding: 7px 9px; color: var(--ink); }
.lab-region-list button.is-active { border-color: var(--terracotta); background: rgba(189, 103, 77, .12); }
.comparison-preview { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; width: min(1000px, 96%); align-items: start; }
.comparison-preview figure { margin: 0; padding: 10px; background: var(--paper); border: 1px solid var(--line); box-shadow: 0 12px 34px rgba(43, 46, 45, .12); }
.comparison-preview figcaption { padding: 2px 2px 9px; font-size: 12px; font-weight: 700; }
.comparison-preview img, .print-preview img { display: block; max-width: 100%; max-height: calc(100vh - 280px); object-fit: contain; margin: auto; }
.print-preview { width: min(760px, 94%); padding: 12px; background: var(--paper); border: 1px solid var(--line); box-shadow: 0 18px 50px rgba(43, 46, 45, .18); }
.print-preview__header { display: flex; justify-content: space-between; gap: 16px; padding: 0 0 10px; }
.print-preview .pdf-page-controls { margin-bottom: 10px; }
.thumbnail-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(105px, 1fr)); gap: 8px; width: 100%; }
.thumbnail-grid > div { display: grid; gap: 4px; min-width: 0; padding: 7px; text-align: left; background: #f7f3e9; border: 1px solid var(--line); }
.thumbnail-grid img { width: 100%; height: 96px; object-fit: contain; background: white; }
.thumbnail-grid b, .thumbnail-grid span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.thumbnail-grid span, .estimate { color: var(--muted); }
.estimate { margin: 8px 0 0; font-size: 11px; }
.pdf-region::before, .pdf-region::after { content: ""; position: absolute; inset: 0; border-top: 1px dashed rgba(189, 103, 77, .75); border-bottom: 1px dashed rgba(189, 103, 77, .75); transform: scaleY(.34); }
.pdf-region::after { border-top: 0; border-bottom: 0; border-left: 1px dashed rgba(189, 103, 77, .75); border-right: 1px dashed rgba(189, 103, 77, .75); transform: scaleX(.34); }
.pdf-region span, .photo-crop span { position: absolute; left: 0; top: -23px; padding: 3px 7px; background: var(--terracotta); color: white; font-size: 9px; white-space: nowrap; }
.image-preview { position: relative; max-width: min(720px, 94%); max-height: calc(100vh - 230px); background: #bbb8b0; box-shadow: 0 18px 50px rgba(43, 46, 45, .18); }
.image-preview img { display: block; max-width: 100%; max-height: calc(100vh - 230px); object-fit: contain; }
.photo-crop { position: absolute; border: 2px solid var(--terracotta); box-shadow: 0 0 0 999px rgba(24, 26, 27, .38); pointer-events: none; }
.photo-crop i { position: absolute; left: 10%; width: 80%; border-top: 1px dashed white; }
.photo-crop .eye-line { top: 40%; }
.photo-crop .head-line { top: 16%; }
.preview-error { position: absolute; inset: auto 10px 10px; margin: 0; padding: 8px; background: #fff; color: var(--danger); }
.lab-preview-result { min-width: 0; overflow: hidden; padding: 14px 18px; background: var(--paper); border-top: 1px solid var(--line); }
.lab-preview-result > b { text-transform: uppercase; letter-spacing: .1em; font-size: 10px; }
.table-preview { overflow: auto; }
.table-preview > p { margin: 8px 0; font-size: 12px; }
.table-preview__table { margin: 7px 0; border: 1px solid var(--line); }
.table-preview__table > summary { padding: 7px; cursor: pointer; font-size: 11px; font-weight: 700; }
.table-preview__row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(90px, 1fr); }
.table-preview__row > span { position: relative; display: grid; gap: 3px; padding: 5px; border: 1px solid #d5d2c8; font-size: 10px; }
.table-preview__types { display: flex; flex-wrap: wrap; gap: 5px; margin: 6px 0 8px; }
.table-preview__types span, .cell-type { width: max-content; padding: 2px 5px; border-radius: 999px; background: #ece8df; color: #4e5355; font-size: 8px; font-style: normal; line-height: 1.2; }
.table-preview__types .is-number, .cell-type.is-number { background: #dce9f0; color: #244a60; }
.table-preview__types .is-date, .cell-type.is-date { background: #e5e1f2; color: #4e3f73; }
.table-preview__types .is-percentage, .cell-type.is-percentage { background: #dcecdf; color: #2f5e3a; }
.table-preview__types .is-currency, .cell-type.is-currency { background: #f1e6cb; color: #6d531c; }
.table-preview__types .is-empty, .cell-type.is-empty { background: #eee; color: #707070; }
.summary-list { display: grid; gap: 5px; margin-top: 8px; }
.summary-list > div { display: flex; justify-content: space-between; gap: 15px; padding: 6px 8px; background: rgba(82, 108, 128, .08); font-size: 11px; }
.lab-font-warning, .lab-font-ok { display: flex; gap: 8px; margin-top: 9px; padding: 9px; background: #f5e7d8; border-left: 3px solid #b56848; color: #563d32; font-size: 10px; line-height: 1.45; }
.lab-font-ok { background: #e3eee8; border-color: var(--success); color: #345344; }
.lab-font-warning svg, .lab-font-ok svg { flex: 0 0 auto; margin-top: 1px; }
.lab-font-warning p { margin: 3px 0; }
.lab-font-warning details { margin-top: 5px; }
.lab-font-warning summary { cursor: pointer; font-weight: 700; }
.archive-preflight { display: grid; gap: 4px; padding: 9px; background: #e3eee8; border-left: 3px solid var(--success); font-size: 10px; }
.archive-preflight p { margin: 2px 0 0; }
.lab-json { box-sizing: border-box; width: 100%; min-width: 0; max-width: 100%; max-height: 180px; overflow: auto; overflow-wrap: anywhere; word-break: break-word; margin: 8px 0 0; padding: 8px; background: #ece8df; font: 10px/1.4 ui-monospace, monospace; white-space: pre-wrap; }
.lab-muted { color: var(--muted); font-size: 12px; }
.lab-result, .lab-error { position: sticky; bottom: 0; z-index: 5; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 14px 18px; background: #e3eee8; border-top: 1px solid #99b4a8; }
.lab-error { grid-template-columns: auto 1fr; background: #f6dfd7; border-color: #c6907d; }
.lab-result b, .lab-error b { font-family: "Unbounded", sans-serif; font-size: 13px; }
.lab-error p { margin: 3px 0 8px; color: #505451; font-size: 10px; line-height: 1.4; }
.lab-result > a { min-height: 38px; display: inline-flex; align-items: center; gap: 7px; padding: 0 13px; background: var(--success); color: white; text-decoration: none; }
.lab-result__body { min-width: 0; }
.lab-result__file { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 5px 14px; margin: 4px 0 8px; color: #46514b; font-size: 10px; }
.lab-result__file span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.lab-result-facts, .lab-result-technical dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 10px; margin: 0; }
.lab-result-facts > div, .lab-result-technical dl > div { display: grid; grid-template-columns: minmax(100px, 1fr) minmax(0, 1.2fr); gap: 7px; padding: 4px 6px; background: rgba(255, 255, 255, .48); font-size: 9px; }
.lab-result dt, .lab-result dd { min-width: 0; margin: 0; overflow-wrap: anywhere; }
.lab-result dt { color: #59635e; }
.lab-result dd { font-weight: 700; }
.lab-result-warnings { margin-top: 7px; }
.lab-result-warnings p { display: flex; gap: 6px; margin: 3px 0; color: #684936; font-size: 9px; line-height: 1.35; }
.lab-result-warnings svg { flex: 0 0 auto; }
.lab-result-technical { margin-top: 7px; font-size: 9px; }
.lab-result-technical summary { width: max-content; cursor: pointer; font-weight: 700; }
.lab-result-technical dl { max-height: 150px; overflow: auto; margin-top: 6px; padding-right: 3px; }
.lab-recovery-label { display: block; margin-bottom: 5px; color: #6b3e31; font-size: 10px; font-weight: 700; }
.lab-recovery-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.lab-recovery-actions button, .lab-recovery-actions a { min-height: 34px; display: inline-flex; align-items: center; padding: 0 10px; border: 1px solid #a86c56; background: rgba(255, 255, 255, .52); color: #6b3525; font: inherit; font-size: 10px; font-weight: 700; text-decoration: none; cursor: pointer; }
.lab-recovery-actions button:first-child { background: var(--terracotta); color: #fff; }
.lab-recovery-actions button:focus-visible, .lab-recovery-actions a:focus-visible { outline: 3px solid rgba(181, 104, 72, .28); outline-offset: 2px; }

.lab-inspector { display: grid; grid-template-rows: 62px minmax(0, 1fr) auto; border-left: 1px solid var(--line); }
.lab-inspector__title { display: flex; align-items: center; gap: 10px; padding: 10px 16px; border-bottom: 1px solid var(--line); }
.lab-inspector__title div { display: grid; }
.lab-inspector__title b { font-family: "Unbounded", sans-serif; font-size: 13px; }
.lab-inspector__title span { margin-top: 3px; color: var(--muted); font-size: 10px; }
.lab-inspector__scroll { min-height: 0; overflow-y: auto; padding: 14px 15px 28px; }
.lab-field { display: grid; gap: 6px; margin: 0 0 14px; }
.lab-field > span, .lab-segments legend, .lab-checklist legend { color: #424543; font-size: 11px; font-weight: 700; }
.lab-field input, .lab-field select, .lab-field textarea { width: 100%; min-height: 38px; border: 1px solid #aaa9a3; border-radius: 0; background: var(--paper); color: var(--ink); padding: 7px 9px; }
.lab-field textarea { min-height: 130px; resize: vertical; font: inherit; line-height: 1.45; }
.lab-field input[type="range"] { padding: 0; accent-color: var(--terracotta); }
.lab-field input[type="color"] { padding: 3px; }
.lab-field small, .lab-toggle small { color: var(--muted); font-size: 9px; line-height: 1.35; }
.lab-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.lab-toggle { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 2px 9px; align-items: center; margin: 0 0 14px; cursor: pointer; }
.lab-toggle input { position: absolute; opacity: 0; }
.lab-toggle > span { position: relative; width: 34px; height: 19px; grid-row: span 2; border-radius: 20px; background: #b2b2ac; }
.lab-toggle > span::after { content: ""; position: absolute; width: 15px; height: 15px; left: 2px; top: 2px; border-radius: 50%; background: white; transition: transform .16s ease; }
.lab-toggle input:checked + span { background: var(--blue); }
.lab-toggle input:checked + span::after { transform: translateX(15px); }
.lab-toggle input:focus-visible + span { outline: 3px solid rgba(189, 103, 77, .55); outline-offset: 3px; }
.lab-toggle b { font-size: 11px; }
.lab-advanced-options { margin: 2px 0 14px; border: 1px solid #aaa9a3; background: rgba(255, 255, 255, .26); }
.lab-advanced-options > summary { min-height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 11px; color: #424543; cursor: pointer; font-size: 11px; font-weight: 700; list-style: none; }
.lab-advanced-options > summary::-webkit-details-marker { display: none; }
.lab-advanced-options > summary::after { content: "+"; flex: 0 0 auto; color: var(--terracotta); font-size: 19px; font-weight: 400; line-height: 1; }
.lab-advanced-options[open] > summary { border-bottom: 1px solid rgba(100, 99, 93, .22); }
.lab-advanced-options[open] > summary::after { content: "−"; }
.lab-advanced-options > summary:focus-visible { outline: 3px solid rgba(189, 103, 77, .45); outline-offset: -3px; }
.lab-advanced-options__body { padding: 12px 11px 11px; }
.lab-advanced-options__body > :last-child { margin-bottom: 0; }
.lab-options-reset { width: 100%; min-height: 36px; border: 1px solid #a86c56; background: transparent; color: #6b3525; cursor: pointer; font: inherit; font-size: 10px; font-weight: 700; line-height: 1.25; padding: 7px 9px; }
.lab-options-reset:focus-visible { outline: 3px solid rgba(181, 104, 72, .28); outline-offset: 2px; }
.lab-segments { margin: 0 0 14px; padding: 0; border: 0; }
.lab-segments legend { margin-bottom: 6px; }
.lab-segments > div { display: grid; grid-template-columns: repeat(auto-fit, minmax(76px, 1fr)); }
.lab-segments button { min-height: 36px; border: 1px solid #aaa9a3; border-right: 0; background: transparent; color: var(--ink); cursor: pointer; font-size: 10px; }
.lab-segments button:last-child { border-right: 1px solid #aaa9a3; }
.lab-segments button.is-active, .lab-segments button[aria-checked="true"] { background: var(--blue-dark); color: white; }
.lab-section { margin: 18px -3px 0; padding: 12px; border: 1px solid var(--line); background: rgba(255, 255, 255, .35); }
.lab-section > b { font-size: 11px; }
.lab-section > p { margin: 4px 0 12px; color: var(--muted); font-size: 9px; }
.lab-checklist { margin: 0 0 14px; padding: 0; border: 0; }
.lab-checklist label { display: grid; grid-template-columns: auto minmax(0, 1fr) 28px 28px; align-items: center; gap: 5px; min-height: 34px; border-bottom: 1px solid rgba(100, 99, 93, .16); font-size: 11px; }
.lab-checklist button { border: 0; background: transparent; color: var(--blue-dark); cursor: pointer; }
.lab-inline-warning { display: flex; gap: 8px; align-items: flex-start; margin: 10px 0 14px; padding: 9px; background: #f4e5cc; color: #6c4a2c; font-size: 10px; line-height: 1.4; }
.lab-inline-warning svg { flex: 0 0 auto; }
.lab-notice { display: flex; gap: 12px; align-items: flex-start; padding: 15px; background: #f4e5cc; }
.lab-notice.is-compact { margin: 12px 0; padding: 10px; font-size: 10px; }
.lab-notice p { display: grid; gap: 4px; margin: 0; line-height: 1.45; }
.lab-related { display: block; color: var(--blue-dark); font-size: 11px; font-weight: 700; }
.lab-actions { display: grid; grid-template-columns: 1fr auto; gap: 8px; padding: 12px 15px; border-top: 1px solid var(--line); background: rgba(248, 245, 237, .9); }
.lab-actions button, .lab-primary { min-height: 43px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid var(--line); background: transparent; color: var(--ink); cursor: pointer; text-decoration: none; }
.lab-actions .lab-primary, .lab-primary { border: 0; background: var(--terracotta); color: white; clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 9px 100%, 0 calc(100% - 9px)); }
.lab-actions .lab-primary:disabled { opacity: .42; cursor: not-allowed; }
.lab-actions .lab-cancel { background: var(--danger); color: white; border: 0; }
.lab-mobile-tabs { display: none; }

.lab-options-fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.lab-options-fieldset:disabled { opacity: .68; }
.lab-region-controls { margin: 0 0 16px; padding: 11px; border: 1px solid var(--line); background: rgba(255,255,255,.35); }
.lab-region-controls legend { padding: 0 4px; font-size: 11px; font-weight: 700; }
.lab-region-controls > p { margin: 2px 0 10px; color: var(--muted); font-size: 9px; line-height: 1.4; }
.lab-region-controls > div { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.lab-region-controls label { display: grid; gap: 4px; font-size: 10px; }
.lab-region-controls input { width: 100%; min-height: 36px; border: 1px solid #aaa9a3; background: var(--paper); padding: 6px 8px; }
.lab-stale { position: sticky; bottom: 0; z-index: 5; display: grid; grid-template-columns: auto 1fr; gap: 11px; align-items: start; padding: 13px 18px; background: #f4e5cc; border-top: 1px solid #c9a67c; }
.lab-stale b { font-family: "Unbounded", sans-serif; font-size: 12px; }
.lab-stale p { margin: 3px 0 8px; color: #65503b; font-size: 11px; }
.lab-stale button { min-height: 34px; border: 1px solid #9c7653; background: transparent; color: #563e2a; font-weight: 700; cursor: pointer; }
.lab-sheet-order, .lab-sheet-available { display: grid; }
.lab-sheet-order label { grid-template-columns: auto minmax(0, 1fr) 32px 32px; }
.lab-sheet-order button:disabled { opacity: .28; cursor: not-allowed; }
.lab-sheet-available { margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--line); }
.lab-sheet-available > b { margin-bottom: 4px; color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.lab-sheet-available label { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 8px; min-height: 32px; font-size: 11px; }
.photo-preset-reference { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; margin: -5px 0 14px; padding: 10px; border: 1px solid var(--line); background: rgba(255,255,255,.35); font-size: 10px; }
.photo-preset-reference a { color: var(--blue-dark); font-weight: 700; }
.photo-preset-reference span { color: var(--muted); }
.photo-preset-reference p { grid-column: 1 / -1; margin: 5px 0 0; color: var(--muted); line-height: 1.45; }
.photo-preview-disclaimer { position: absolute; left: 8px; right: 8px; bottom: 8px; z-index: 4; margin: 0; padding: 7px 9px; background: rgba(32,35,38,.84); color: white; font-size: 9px; line-height: 1.35; }
.photo-workspace-preview { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(240px, .7fr); gap: 18px; align-items: start; width: min(1180px, 100%); }
.photo-output-preview { min-width: 0; margin: 0; padding: 10px; border: 1px solid var(--line); background: var(--paper); }
.photo-output-preview figcaption { margin-bottom: 8px; font-size: 11px; font-weight: 700; }
.photo-output-preview > img { display: block; max-width: 100%; max-height: 58vh; margin: auto; object-fit: contain; }
.photo-sheet-preview { position: relative; width: min(100%, 360px); margin: auto; overflow: hidden; border: 1px solid #aaa; background: #fff; box-shadow: 0 8px 24px rgba(30,34,36,.14); }
.photo-sheet-preview > span { position: absolute; display: block; border: 1px solid rgba(45,50,52,.35); background-repeat: no-repeat; background-position: center; background-size: cover; }
.photo-dimension-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; margin: -5px 0 12px; padding: 8px; background: rgba(82,108,128,.08); font-size: 10px; }
.lab-page-operations { display: grid; gap: 6px; margin: 0 0 14px; padding: 0; border: 0; }
.lab-page-operations > article { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 6px; align-items: center; padding: 5px; border: 1px solid var(--line); }
.lab-page-operations article > div { display: flex; align-items: center; gap: 5px; }
.lab-page-operations img { width: 38px; height: 48px; object-fit: contain; background: #fff; }
.lab-page-operations span { display: grid; font-size: 10px; }
.lab-page-operations button { min-width: 28px; min-height: 28px; }
.table-selector label { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 6px; }
.table-selector button { min-height: 32px; text-align: left; }
.table-selector button.is-active { border-color: var(--terracotta); background: #f6e7df; }
.exif-viewer { display: grid; gap: 12px; width: 100%; max-height: min(58vh, 620px); overflow: auto; text-align: left; }
.exif-file-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px; }
.exif-file { min-width: 0; padding: 11px; border: 1px solid var(--line); background: #f8f5ed; }
.exif-file > header { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.exif-file > header b { min-width: 0; overflow: hidden; text-overflow: ellipsis; font-size: 11px; }
.exif-file > header span { flex: none; color: var(--muted); font-size: 9px; }
.exif-file section { margin-top: 10px; }
.exif-file section.exif-format { padding: 8px; border: 1px solid var(--line); background: #fffdf8; }
.exif-format > p { align-items: center; color: var(--blue-dark); }
.exif-format ul { display: grid; gap: 4px; margin: 6px 0 0; padding-left: 17px; color: var(--muted); font-size: 9px; line-height: 1.4; }
.exif-format .exif-format__conflict { color: #8b3f2c; }
.exif-file section.is-gps { padding: 8px; background: #f4e5cc; }
.exif-file h3 { margin: 0 0 5px; color: var(--blue-dark); font-size: 10px; text-transform: uppercase; letter-spacing: .06em; }
.exif-file section > p { display: flex; gap: 6px; margin: 0 0 7px; color: #6c4a2c; font-size: 9px; line-height: 1.35; }
.exif-file dl, .exif-technical dl { display: grid; grid-template-columns: minmax(90px, .8fr) minmax(0, 1.2fr); gap: 4px 8px; margin: 0; font-size: 10px; }
.exif-file dt { color: var(--muted); }
.exif-file dd { min-width: 0; margin: 0; overflow-wrap: anywhere; }
.exif-technical { margin-top: 10px; }
.exif-technical summary { cursor: pointer; color: var(--blue-dark); font-size: 10px; font-weight: 700; }
.exif-technical dl { max-height: 220px; overflow: auto; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line); }
.exif-disclaimer { margin: 10px 0 0; color: var(--muted); font-size: 9px; line-height: 1.4; }
.exif-compare { overflow: auto; border: 1px solid var(--line); background: #f8f5ed; }
.exif-compare table { width: 100%; border-collapse: collapse; font-size: 10px; }
.exif-compare caption { padding: 9px; text-align: left; font-weight: 700; }
.exif-compare th, .exif-compare td { min-width: 120px; padding: 6px 8px; border-top: 1px solid var(--line); border-right: 1px solid var(--line); vertical-align: top; overflow-wrap: anywhere; }
.exif-compare th { background: #ebe6dd; text-align: left; }
.exif-compare tbody th { position: sticky; left: 0; z-index: 1; }


.lab-guide { min-height: 100vh; max-width: 920px; margin: 0 auto; padding: 42px 30px 80px; }
.lab-guide .lab-wordmark { display: inline-block; margin-bottom: 70px; }
.lab-guide h1 { max-width: 760px; margin: 8px 0 18px; font-family: "Unbounded", sans-serif; font-size: clamp(35px, 6vw, 68px); line-height: .98; letter-spacing: -.06em; }
.lab-guide__lead { max-width: 720px; color: #555854; font-size: 20px; line-height: 1.5; }
.lab-guide ol { margin: 55px 0; padding: 0; list-style: none; counter-reset: steps; }
.lab-guide li { display: grid; grid-template-columns: 64px 1fr; align-items: start; padding: 22px 0; border-top: 1px solid var(--line); }
.lab-guide li > span { font-family: "Unbounded", sans-serif; color: var(--terracotta); font-size: 16px; }
.lab-guide li p { margin: 0; font-size: 17px; line-height: 1.45; }
.lab-guide__back { margin-top: 25px; padding: 0 22px; }

@media (max-width: 1120px) {
  .lab-workspace { grid-template-columns: 210px minmax(320px, 1fr) 316px; }
  .lab-header { grid-template-columns: 190px minmax(0, 1fr) auto; }
  .lab-tools > button:not(.lab-add) { flex: 0 0 auto; grid-template-columns: 30px minmax(0, 1fr); grid-template-rows: auto auto; align-content: center; align-items: start; gap: 3px 8px; min-height: 66px; padding: 8px 6px 8px 0; }
  .lab-tools > button:not(.lab-add) > span { grid-column: 1; grid-row: 1 / 3; align-self: center; }
  .lab-tools > button:not(.lab-add) > b { grid-column: 2; grid-row: 1; min-width: 0; line-height: 1.25; overflow-wrap: anywhere; }
  .lab-tools > button:not(.lab-add) > small { grid-column: 2; grid-row: 2; min-width: 0; line-height: 1.25; overflow-wrap: anywhere; }
}

@media (max-width: 820px) {
  body { overflow: auto; }
  .upcoming-lab { height: 100dvh; min-height: 0; grid-template-rows: auto 36px auto minmax(0, 1fr); }
  .lab-header { position: sticky; top: 0; z-index: 20; grid-template-columns: 1fr auto; gap: 10px; min-height: 72px; padding: 10px 14px; background: rgba(248, 245, 237, .98); }
  .lab-header > .lab-wordmark { font-size: 20px; }
  .lab-header > div:not(.lab-header__actions) { grid-column: 1 / 2; grid-row: 2; }
  .lab-header h1 { font-size: 17px; }
  .lab-header__actions { grid-column: 2; grid-row: 1 / 3; }
  .lab-help { padding: 0 10px; font-size: 0; }
  .lab-help svg { width: 22px; height: 22px; }
  .lab-progress { position: sticky; top: 92px; z-index: 19; padding: 0 14px; }
  .lab-mobile-tabs { position: sticky; top: 128px; z-index: 18; display: grid; grid-template-columns: repeat(3, 1fr); background: var(--paper); border-bottom: 1px solid var(--line); }
  .lab-mobile-tabs button { min-height: 43px; border: 0; border-right: 1px solid var(--line); background: transparent; font-size: 11px; }
  .lab-mobile-tabs button.is-active { background: var(--blue-dark); color: white; }
  .lab-workspace { display: block; min-height: 620px; }
  .lab-tools, .lab-stage, .lab-inspector { display: none; min-height: calc(100vh - 171px); border: 0; }
  .lab-tools.is-mobile-active { display: flex; }
  .lab-stage.is-mobile-active { display: grid; grid-template-rows: 52px minmax(400px, 1fr) auto; }
  .lab-stage.lab-stage--single-upload.is-mobile-active { grid-template-rows: minmax(400px, 1fr) auto; }
  .lab-inspector.is-mobile-active { display: grid; grid-template-rows: 62px minmax(450px, auto) auto; }
  .lab-tools { padding-bottom: 90px; }
  .lab-tools .lab-add { position: fixed; z-index: 30; left: 14px; right: 14px; bottom: 14px; background: var(--paper); }
  .lab-preview { min-height: 430px; padding: 16px 10px; }
  .pdf-canvas, .pdf-canvas canvas, .image-preview, .image-preview img { max-height: 56vh; }
  .lab-actions { position: sticky; bottom: 0; z-index: 12; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}

@media (max-width: 760px) {
  .photo-workspace-preview { grid-template-columns: 1fr; }
  .comparison-preview { grid-template-columns: 1fr; }
  .comparison-preview img, .print-preview img { max-height: 42vh; }
  .thumbnail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lab-region-controls > div { grid-template-columns: 1fr; }
  .exif-file-grid { grid-template-columns: 1fr; }
  .lab-result { grid-template-columns: auto minmax(0, 1fr); }
  .lab-result > a { grid-column: 2; width: 100%; justify-content: center; }
  .lab-result-facts, .lab-result-technical dl { grid-template-columns: 1fr; }
}
.photo-mask-editor { display: grid; gap: 12px; width: min(100%, 860px); margin: 0 auto; }
.photo-mask-toolbar { display: flex; flex-wrap: wrap; align-items: end; gap: 8px; padding: 10px; border: 1px solid var(--line); background: rgba(248,245,237,.94); }
.photo-mask-toolbar fieldset { display: flex; gap: 4px; min-width: 0; margin: 0; padding: 0; border: 0; }
.photo-mask-toolbar legend { position: absolute; width: 1px; height: 1px; clip: rect(0 0 0 0); overflow: hidden; }
.photo-mask-toolbar button { min-height: 38px; padding: 7px 11px; border: 1px solid var(--line); background: #fff; color: var(--ink); cursor: pointer; }
.photo-mask-toolbar button[aria-checked="true"], .photo-mask-toolbar button.is-active { border-color: var(--terracotta); background: #f6e7df; }
.photo-mask-toolbar button:disabled { opacity: .45; cursor: not-allowed; }
.photo-mask-size { display: grid; gap: 3px; min-width: 150px; font-size: 12px; }
.photo-mask-size input { width: 100%; }
.photo-mask-surface { position: relative; width: min(100%, calc(67vh * var(--photo-mask-ratio))); min-height: 0; max-height: min(67vh, 720px); margin-inline: auto; overflow: hidden; border: 1px solid var(--line); background: #d9d7cf; touch-action: none; user-select: none; }
.photo-mask-surface canvas { display: block; width: 100%; height: 100%; max-height: min(67vh, 720px); object-fit: contain; touch-action: none; cursor: crosshair; }
.photo-mask-surface.is-crop canvas { cursor: default; }
.photo-mask-crop { position: absolute; border: 2px solid #fff; box-shadow: 0 0 0 9999px rgba(21,30,34,.48), 0 0 0 1px rgba(32,35,38,.7); cursor: move; touch-action: none; }
.photo-mask-crop::before, .photo-mask-crop::after { content: ""; position: absolute; left: 0; right: 0; border-top: 1px dashed rgba(255,255,255,.9); }
.photo-mask-crop::before { top: 39%; }
.photo-mask-crop::after { top: 55%; }
.photo-mask-crop-label { position: absolute; left: 7px; top: 7px; padding: 3px 6px; color: #fff; background: rgba(32,35,38,.72); font-size: 11px; pointer-events: none; }
.photo-mask-output-frame { position: absolute; overflow: visible; border: 1px dashed #f0b44d; pointer-events: none; }
.photo-mask-output-frame > i { position: absolute; display: block; pointer-events: none; }
.photo-guide-center { left: 50%; top: 0; bottom: 0; border-left: 1px dashed rgba(255,255,255,.9); }
.photo-guide-eye { left: 7%; right: 7%; border-top: 1px solid #65d3ee; }
.photo-guide-head { left: 19%; right: 19%; top: 7%; border: 1px dashed rgba(255,255,255,.95); border-radius: 50% 50% 44% 44%; }
.photo-mask-output-frame > span { position: absolute; left: 0; bottom: calc(100% + 4px); width: max-content; max-width: 260px; padding: 2px 5px; background: rgba(32,35,38,.78); color: #fff; font-size: 9px; line-height: 1.25; }
.photo-mask-handle { position: absolute; width: 26px; height: 26px; padding: 0; border: 2px solid #fff; border-radius: 50%; background: var(--terracotta); box-shadow: 0 1px 4px rgba(0,0,0,.35); }
.photo-mask-handle[data-handle="nw"] { left: -13px; top: -13px; cursor: nwse-resize; }
.photo-mask-handle[data-handle="ne"] { right: -13px; top: -13px; cursor: nesw-resize; }
.photo-mask-handle[data-handle="sw"] { left: -13px; bottom: -13px; cursor: nesw-resize; }
.photo-mask-handle[data-handle="se"] { right: -13px; bottom: -13px; cursor: nwse-resize; }
.photo-mask-keyboard-cursor { position: absolute; width: 18px; height: 18px; margin: -9px 0 0 -9px; border: 2px solid #fff; border-radius: 50%; box-shadow: 0 0 0 1px #202326; pointer-events: none; }
.photo-mask-status { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin: 0; color: var(--muted); font-size: 12px; }
.photo-mask-status b { color: var(--ink); }
.photo-mask-help { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.photo-mask-loading { display: grid; min-height: 260px; place-items: center; color: var(--muted); }
@media (max-width: 720px) {
  .photo-mask-toolbar { align-items: stretch; }
  .photo-mask-toolbar > * { flex: 1 1 auto; }
  .photo-mask-toolbar button { min-height: 44px; }
  .photo-mask-surface { width: min(100%, calc(56vh * var(--photo-mask-ratio))); min-height: 0; max-height: 56vh; }
  .photo-mask-surface canvas { max-height: 56vh; }
}
/* unbounded-cyrillic-ext-600-normal */
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(data:font/woff2;base64,d09GMgABAAAAAAQ8ABAAAAAACCQAAAPiAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGhYbgQwcLgZgP1NUQVQqAFwRCAqDJIJvCxQAATYCJAMiBCAFhQwHZwwHG8IGIK4KbGN6UBdhJpEWQy2Toz3zeWyACp7/16Pu+8kA9BItK5ZERbPbbs7mr/3aQ1SS2Ik66n9PbO8r4o2hiSc6oaiHRCM0pkM0uXtOJNKIo7byH74wHw1xI27+L8f3js7WsN0WKNJE5uYx6Y5+gaS9M2xQuAYGMoW2Hl6WBhQIpVM3ecy+RsYKIJp/V4sA1gCAQhA0BAEsiaSQUVzqGYTKXabiUPlzTBIqZQIYBgLI5BEqCbmAAIKOBeYI5ggKMEfhLRNI1SYdDcB4PaJJKyagwoIpFKTnpRwqWo93bQ2gpFUAunql2skCtVRIoKof6UWUVuBhBijOVjs+gPP492Htk2EF+l/xBWT1vfugMtVfwF8G8nqO4CwNzpM+fyzMpOmAQgDEQrUDgAI0wFmG02dkUg6wxRyFKf6MLrggyv+wAUxmGJ+dN6KAvGskDVxIEAN2AFgA4AiwAsYAqwFvQIMoZUhpzildUPMEvc22z0q3nD+FSTZYK6BN7Og9y3KrCZaTB3afPpWFh+49a2v7eaSDTy2XPva2fIblVsuePGHB/sePm5vfru9mwRNb/Zmf1WNos8SBlcmuVrNlYe2NLeSWV8B19dPyP8f+HrP5c/Tv0QN/xreN75Q/xL1Va03XLm7t+LsRvikzbNPNzj9csZuwPqs5au1Y/vcdKZrkbi6+GBLZKPT0+6TslUlxR/g8czR0nN44b+y6zI9MtgwW9bt1vdszql3sHxoT3p8wKe2JXmTaObcMDkkNe63Nw5C//fbjnTtOI073vPYLCY27zbVtq7VnYruV9FDSADPMpAYw7DbnIcQDUKDt1m6rx7uHAHJors9L5/vssv+Za9p3gHd5K5cAvO8O6oN0Y/p0MEUBIPBXAdo+1H9TgiFfVDfX2nBesQfPOCynbSEU4KZMGmBBhkw8ZQTZTyGANavQEN0C2CvlS0UITrCisBVXRSPdb69OU0xotaOYEoxQbEnFU+yVa5QdlCp0Ex1rSMl97ELaIBEhYYwBSEKECRZHGJI0D2MlERBifD9GCk2Fj4+2gBKRwqDx0CLieDBKCJ+fjSeUcW86fRhChfipsKRWQjxyAkJqIUEMDIujTRDgUeIRUeAhIBypbiEIQURJTokwFWj0PkY+6oKg/vFCWHFzKCffrd1mWMoyqqHv3EpEQESk1aAwpDXYpAAKFoUsOJpvxGKEYRRaq47Gl0IiJI01jyclLLFhdQwLiUOCsCQGjY9N2+qUDvwaG0h0AAsg2LcoNNFEFxMxNS0YpBCHcuZOiwgEBQL1RZGgUFI8MMQy6GQboSNuFAvnMkri+NR155UY7ddXAA==) format('woff2'), url(data:font/woff;base64,d09GRgABAAAAAAZIAA8AAAAAB8gAAQABAAAAAAAAAAAAAAAAAAAAAAAAAABHREVGAAABWAAAABYAAAAWABEABEdQT1MAAAFwAAAAYAAAAIyO+5dmR1NVQgAAAdAAAAAtAAAALiN2JIJPUy8yAAACAAAAAEoAAABgYdt+TlNUQVQAAAJMAAAAJwAAACp5nGrlY21hcAAAAnQAAABCAAAAXEHQ4ltnYXNwAAACuAAAAAgAAAAIAAAAEGdseWYAAALAAAABawAAAYhwFPywaGVhZAAABCwAAAA2AAAANiSMqbNoaGVhAAAEZAAAAB8AAAAkCb8CyWhtdHgAAASEAAAAIAAAACIUDQCMbG9jYQAABKQAAAAUAAAAFAFtAfxtYXhwAAAEuAAAABwAAAAgABsA8W5hbWUAAATUAAABIwAAAmIy3lZmcG9zdAAABfgAAABQAAAAZ1ZaGUUAAQAAAAwAAAAAAAAAAgABAAEAAwABAAB42iWJJQJCURBFzwiaX6SiHelIIrIAtOAue2Ut30euIkCdHiNsMpsvCJvf/Ug4rp5nAg4Qxwggh939TBUKh1OjiuSvQBWlgQMDWigGEP+LRxGEElCw5Kt57kWbALJODYB42mNgZGBg4GLQAUJmFzefEAaJ5MqiHAaRnMSSPAYRBhBgARH//4NIAJZPBzwAAAB42mNgYZZgimBgZWBg6gLSDAzeEJoxjsGIMYwBFbADMROM4+fox8BwgEFBYQvz4//cDAws7xjlgPqmg+SYrJjeASkFBmYAxUMLAAAAeNpjYARCDiBmYBABkzIMTOXpGSWMLEA2E1iEgZGTKYKBAQAsXwJlAHjaY2BgYAJiZiAWAZKMYJqFwQNI8zFwAOXYGBQYHBkWMBxkZFLY8v8/UByF///J/wP/U/87/me8HwTUjQIAZb8SQgAAAAEAAf//AA942jxLJXBDQRB9uzf9YQZ/uYApfyqjKTPX6/r6eBkvC75+ytwm3quAnzAu7wMw1gHh4xIEHEBEhmQkJEPr/FSbe6BTLtXCvFU/oVtwKyHuW0oH3ACRykiHoogQfEAX76v1q9UPumxks21PLsel+gqN1AuNRtcnvjgNAuCAg7aBAf47wJ3ItzYh3aiIa65jFhhKpNOmYStTt2zLtqUpLdNIq4TmUAusT8bjsahDjynNoTkcMia1WDSuT1q27md6aS5jTiiLd7ecvmUEy7/JTF7cwT5B/hw72KJmp6VPD2YPWSKlZBGqwNj7dwN3pH9oFM9OtriFAjbZrmLCoYK8/HyMYULiWkZmaq6Z1pbJjrISYTxcAnwcoULi2iZGeu7Z1kB3ijOrM9Yxn2FgBoabMbvyqiur9zCfWQrygSCzAuMv5vMMvCAZMYiT2NiUldQE+/mMVNWMefvFG2Ojm5jPyyooyEaEhzMAAEGZV+oAAAEAAAABs3X7Ap9BXw889QADA+gAAAAA3z+OhAAAAADgXCNR/r/+yQcaBL0AAAAGAAIAAAAAAAB42mNgZGBgfvyfm4GB3ejf/j/N7FJAEVTAAQCM0AWRAHjaYw5n8GRez8AEwwx/GBhAmHkBgxqQJc4gCABt9QWpAAAAFQAxAD0ASQBJAEkAnQCqAMR42mNgZGBg4GSYz8DOEMDABuYhAAsDIwAYegENeNqM0EOCHVEUANATm9PY/oqTSTyJbRdb7zvOkrKS7Cmorjbfu/a9WOunZZYsX4NfS86U8hL7l2wt5aU2Llleysuc87uUlxuPscIT/VJeab8HpbzRGdtH5SXLrbe5lNfYjIdiw3JXBEMiT8VyqUy3wK6mjguqqjo+ass1dXVUdOSGVARtqaq7brjlsREfBD0jIrHIiRldnoi1i/xgxG51FWfV1F2USnSFIrLjpZqK8yoazqmIxPpOOyYVizScd9Z5kddTqtxx2R0XFzXNA7FUz5D32rNk7J6RcVXQ9EV7/Fa7NdQ0NOz2SCa2e9ZK97QFA2Ifi6zLesWlg7aO3Q7PuHoqLyJ6Pqj4KBgurEGQGhJL/B0wFEFxAhQvxbBTEwCrLltzAHjaY2BiAIP/cxiMGLABTiBWYTjJyMTAzMjMyMLIysjG5phUlFqWyl6al2lg4GgAoo0MnEz4EpNLS1KT83OT9JITi1N5QNLGBmZgDgCJKRMC) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* unbounded-cyrillic-600-normal */
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/assets/unbounded-cyrillic-600-normal-DW6uzIMB.woff2) format('woff2'), url(/assets/unbounded-cyrillic-600-normal-B-s5c2Kn.woff) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* unbounded-vietnamese-600-normal */
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/assets/unbounded-vietnamese-600-normal-Cx2bTSHN.woff2) format('woff2'), url(/assets/unbounded-vietnamese-600-normal-BzfrgZ_C.woff) format('woff');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* unbounded-latin-ext-600-normal */
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/assets/unbounded-latin-ext-600-normal-0iZLtTDV.woff2) format('woff2'), url(/assets/unbounded-latin-ext-600-normal-ClMPf-bu.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* unbounded-latin-600-normal */
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/assets/unbounded-latin-600-normal-oRSANpZr.woff2) format('woff2'), url(/assets/unbounded-latin-600-normal-BPdB_PEv.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}/* unbounded-cyrillic-ext-700-normal */
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(data:font/woff2;base64,d09GMgABAAAAAAQMABAAAAAAB+AAAAOwAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGhYbgQwcLgZgP1NUQVQqAFwRCAqDJIJtCxQAATYCJAMiBCAFhEYHZwwHG3oGIxFmfM0O8M/D2IE2KXexlvRX30jl4k0ByoIFW5Pm075+YpPjCMK6+K9Osusn4APwSeKJ0ARA/zfCdz9c0xILi5BPgVU7UACUe6B7QO0mZzupNnE5/rFs1LZf+AIRJzI3rkEf/YdjYxmFr42NC6Q839aFT4hla06fRTcFxCDqdm5WoAtIQshCoG2qheXlV1x9ff23O2Tf3fXffZv999RfgYpA7LbDvntqIhCKlqbQFBKakuEKFjRRkqFa83rN1eChoJIElHjEY5huuu3gAmICbC/po/SQGunUtDFWwzixpbmxkUXUQPIDWHOZNbnM6NF35U+qPOX7GEmc+8KL0mLpe0bLQmgK9BcYLh200877R0ESEO30EEjI6C8L9FesjJ6akrrRlnGZxyONvquC7hvVp36BZcQH6wr9MiEqeoEW6IsOdsLZGE6GrFIlg3cIFZDNOUXRc6tOqd0+aDK79tBNso2ily0l1fLOzu3dtjn19dfjmDtfeGOjjZ54RZC/3j711eHtN2h557TXXnP0bc++uv76dz15k6NfUxbfGNV5tUv7Rp9Dp/mw/PrtxPn3nxHPDHPcXf36Ct89+f2Tje/23z91xXc/3/HzqVjujbOurV17wOv637034uzFR579nnBtnuy168WLbaSuOOngf6u8aXGPIY/sU520Wn+lk5VnbvNXW36zXS5edGfh/IXW+1526gV/71vZuLT1kLeOvGbQ5HWHq56vO+2+Z2orOW6525WL9O+72eabLfDYWeME7e2e//Kma5/3ycsXfv1vY1z36wsHbXrixltthQ+kiQINjVibZnfTK2ZDkB/Kz/Pgy2cRdx5w/rdL9t6q1+K/NXP+Eh8sdebx8OHm49YR1e2n1SUQ/FSq88Piv9/zQx+02sybW9HCt1v9qbl8jQnop6dAyyKKofJT9ksCbUfKorRwSwyVhdA3mkLSDEI224tCMdxdQs2GthTqhluW72lBXVEUXTa3NYM5G4EkiA7+YY5hrznO/rYkw7GJLakELYE7Pz651b/Q1Rmw4Q5VdgeWLaFeGZEFHW0E3kFU7WdKVmS8JAy8WV8ANl4tVuzVK1rp9ZI622L0TZRefpBd5wEaoZUjZWVMx8RUbsThlXgmXVgow/fNzNbNsHq07Eon2xlBspLcL0IZ1E60jiiowKPu2Jzrt9KNWexWFxnv2cL4fSQ5cpSoRb2+zFcd/nVpV5co3VL+zTHdTUvbfLsOlKThqk0jWXBNMhM6V9T+hBNuKwEAAA==) format('woff2'), url(data:font/woff;base64,d09GRgABAAAAAAY4AA8AAAAAB6wAAQABAAAAAAAAAAAAAAAAAAAAAAAAAABHREVGAAABWAAAABYAAAAWABEABEdQT1MAAAFwAAAAYAAAAIyO/ZdmR1NVQgAAAdAAAAAtAAAALiN2JIJPUy8yAAACAAAAAEwAAABgYkB+OlNUQVQAAAJMAAAAJwAAACp5nWtJY21hcAAAAnQAAABCAAAAXEHQ4ltnYXNwAAACuAAAAAgAAAAIAAAAEGdseWYAAALAAAABZQAAAYjaD+9haGVhZAAABCgAAAA2AAAANiSlqbdoaGVhAAAEYAAAAB8AAAAkCdcC1GhtdHgAAASAAAAAIAAAACIUNwCBbG9jYQAABKAAAAAUAAAAFAFwAf5tYXhwAAAEtAAAABwAAAAgABsA8W5hbWUAAATQAAABGAAAAkYwbVNucG9zdAAABegAAABQAAAAZ1ZaGUUAAQAAAAwAAAAAAAAAAgABAAEAAwABAAB42iWJJQJCURBFzwiaX6SiHelIIrIAtOAui2Ur30euIkCdHiNsMpsvCJvf/Ug4rp5nAg4Qxwggh939TBUKh1OjiuSvQBWlgQMDWigGEP+LRxGEElCw5Kt57kWbALKgDYJ42mNgZGBg4GLQAUJmFzefEAaJ5MqiHAaRnMSSPAYRBhBgARH//4NIAJZPBzwAAAB42mNgYVZm2sPAysDA1MUUwcDA4A2hGeMYjBjDGVABOxAzwTh+jn4MDAsYFBS2MD/+z83AwPKOUQ6obzpIjsma6R2QUmBgBgDo+gtReNpjYARCDiBmYBABkzIMTOXpGSWMLEA2E1iEgZGLaQ8DAwAtkALKAHjaY2BgYAJiZiAWAZKMYJqFwQNI8zFwAOXYGBQYHBkWMBxkZFLY8v8/UByF///J/wP/U/87/me8HwTUjQIAZb8SQgAAAAEAAf//AA942kTLgQbCUBQG4P+cq50ErNoi4Ha1ANHaRjKBCAj2DL1BWCCAwB6oBwhEBWAAAaYX2F0SBfDxgbEG1IArKAjQ067uudpd862eXmjFVd3lpd3TCQwC1JkrCDoAkZloMURK8Y6yMrWHtKSMVJ5/UlFwZTc0tE80zXeqKwcgAAKhLf5+/3kbDwCEcfNSR7ZYAK1REETzxERhnMSJjnQczQMzcsSkHM583+tL6BlHHBHtacfr++EsTt4z5mNiPJk1L4LZvV9G29Dr33omJy4fdx9P9lNsMfMy0meFsAWtFpe1imRnrPy7lTPYyz+Y5zRb/BIBm1w3YcFoPh4+nmhBEXUdfSXXLGuLFCcZ8WguDkF+pmhBYQ09HU2PHCuQK4WZ1Rj7mM8xMAPDzZhdedmLteeYz60AyfAxyzFxMV9i4AXJiEFcxMamrKTGN5vfQEXZkH+2RHt8fDvzJWlZWenoyEgGAKVMVfYAAAAAAQAAAAGzdSpivz9fDzz1AAMD6AAAAADfP46EAAAAAOBcI1H+uv7ABzcEygABAAYAAgAAAAAAAHjaY2BkYGB+/J+bgYHd/9+uP4Xs5kARVMABAI/fBbQAeNpjjmFwY97LwAjDDD8YGECYeRmDKpAlzMAHAHG6BcgAAAAVADIAPgBKAEoASgCdAKoAxHjaY2BkYGDgZJjPwM4QwMAG5iEACwMjABh6AQ142n2QhU5DYQxGD+4axYni7lsEj+DuLvPdOc4jEeNBeCS+/Jlbmqan3hSo5ZsySsprgJ+S9jiX0FpSHedSqkuIcxnj/MW5nE5+41zBMddxrlR8Oc6NzFKP4ZJyEXGuNTNPeMKFAycRpJIAYWyMScI8EFI2QEQ8SljslbUUdSi/wzqbHOHnXrGo7CNP0hHttvCKjuWHTJ+lbC8TjDLHuKwdB89EsExlmAtFR1mQTjLPqJkUY4YhHGbmpHJz0keu8mzsJb4xY8M2S1J70QvjNk/NirwAb4SS/+llknHppOhQkSfZfLfsElLELe/BdC0RNd+1FA/L78/5tAOXqYhq1qi6LHwmakkceHni2XwwQljxaM7OgX9fg1YKeNpjYGIAg/9zGIwYsAFOIFZhOMnIxMDMyMzIwsjKyMbmmFSUWpbKXpqXaWDgaACijQycTPgSk0tLUpPzc5P0khOLU3lA0sYGZmAOAIkpEwI=) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* unbounded-cyrillic-700-normal */
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(/assets/unbounded-cyrillic-700-normal-BnWDpkfm.woff2) format('woff2'), url(/assets/unbounded-cyrillic-700-normal-BKv7sql3.woff) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* unbounded-vietnamese-700-normal */
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(/assets/unbounded-vietnamese-700-normal-CjKRcRIV.woff2) format('woff2'), url(/assets/unbounded-vietnamese-700-normal-Bvu7IMCd.woff) format('woff');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* unbounded-latin-ext-700-normal */
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(/assets/unbounded-latin-ext-700-normal-BLzWLLjG.woff2) format('woff2'), url(/assets/unbounded-latin-ext-700-normal-C5zWdd_U.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* unbounded-latin-700-normal */
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(/assets/unbounded-latin-700-normal-CaoNriVp.woff2) format('woff2'), url(/assets/unbounded-latin-700-normal-CZtriu5h.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}/* golos-text-cyrillic-ext-400-normal */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/assets/golos-text-cyrillic-ext-400-normal-Bo67NYBq.woff2) format('woff2'), url(/assets/golos-text-cyrillic-ext-400-normal-D592xEk3.woff) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* golos-text-cyrillic-400-normal */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/assets/golos-text-cyrillic-400-normal-C7us6pn1.woff2) format('woff2'), url(/assets/golos-text-cyrillic-400-normal-BwL4n7Pb.woff) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* golos-text-latin-ext-400-normal */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/assets/golos-text-latin-ext-400-normal-BjKcJWKY.woff2) format('woff2'), url(/assets/golos-text-latin-ext-400-normal-BXgyX_iE.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* golos-text-latin-400-normal */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/assets/golos-text-latin-400-normal-Coi1FYaD.woff2) format('woff2'), url(/assets/golos-text-latin-400-normal-DOuJOmdK.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}/* golos-text-cyrillic-ext-500-normal */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(/assets/golos-text-cyrillic-ext-500-normal-CLsu_eDI.woff2) format('woff2'), url(/assets/golos-text-cyrillic-ext-500-normal-InHNvB7v.woff) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* golos-text-cyrillic-500-normal */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(/assets/golos-text-cyrillic-500-normal-BSLQUuP1.woff2) format('woff2'), url(/assets/golos-text-cyrillic-500-normal-hXinzVVQ.woff) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* golos-text-latin-ext-500-normal */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(/assets/golos-text-latin-ext-500-normal-9vZPKadr.woff2) format('woff2'), url(/assets/golos-text-latin-ext-500-normal-BmtMVntR.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* golos-text-latin-500-normal */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(/assets/golos-text-latin-500-normal-BznAvurO.woff2) format('woff2'), url(/assets/golos-text-latin-500-normal-BQo4s7Kn.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}/* golos-text-cyrillic-ext-600-normal */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/assets/golos-text-cyrillic-ext-600-normal-uuhKjiyO.woff2) format('woff2'), url(/assets/golos-text-cyrillic-ext-600-normal-rSWq63aw.woff) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* golos-text-cyrillic-600-normal */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/assets/golos-text-cyrillic-600-normal-lpQ9rVRR.woff2) format('woff2'), url(/assets/golos-text-cyrillic-600-normal-BgvEFMNR.woff) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* golos-text-latin-ext-600-normal */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/assets/golos-text-latin-ext-600-normal-DLLCs_GQ.woff2) format('woff2'), url(/assets/golos-text-latin-ext-600-normal-C6iohuVX.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* golos-text-latin-600-normal */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/assets/golos-text-latin-600-normal-Bhk8uV1U.woff2) format('woff2'), url(/assets/golos-text-latin-600-normal-B_o32mE8.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}/* DOKIVO webfonts — кириллица и латиница отдельными сабсетами с собственного домена.
   Файлы пакета переноса содержали только кириллицу и заглавную «A»: латинские
   PDF, JPG и DOKIVO падали в резервный шрифт и в жирных заголовках выглядели
   тонкими. Здесь сабсеты из @fontsource — те же, что использует React-клиент,
   поэтому статические страницы и приложение рисуют буквы одинаково. */
@font-face{font-family:"Golos Text";src:url("/assets/fonts/golos-text-cyrillic-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Golos Text";src:url("/assets/fonts/golos-text-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Golos Text";src:url("/assets/fonts/golos-text-cyrillic-500-normal.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Golos Text";src:url("/assets/fonts/golos-text-latin-500-normal.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Golos Text";src:url("/assets/fonts/golos-text-cyrillic-600-normal.woff2") format("woff2");font-weight:600 800;font-style:normal;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Golos Text";src:url("/assets/fonts/golos-text-latin-600-normal.woff2") format("woff2");font-weight:600 800;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Unbounded";src:url("/assets/fonts/unbounded-cyrillic-600-normal.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Unbounded";src:url("/assets/fonts/unbounded-latin-600-normal.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Unbounded";src:url("/assets/fonts/unbounded-cyrillic-700-normal.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Unbounded";src:url("/assets/fonts/unbounded-latin-700-normal.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  /* ---- Base ramp: warm paper neutrals ---- */
  --paper-0:#ffffff;         /* pure white — modals, inspector, mega menu */
  --paper-1:#fffefa;         /* surface — cards, tool rows, inputs */
  --paper-2:#f7f7f2;         /* page — app background */
  --paper-3:#f6f5ef;         /* page (marketing/SEO build) */
  --paper-4:#ecece8;         /* editor chrome background */
  --paper-5:#deded9;         /* editor stage checkerboard base */
  --ink-900:#171717;         /* app ink */
  --ink-850:#181b20;         /* marketing ink */
  --ink-700:#25313b;         /* logo mark ground */
  --ink-500:#6f706f;         /* app muted */
  --ink-450:#666c73;         /* marketing muted */
  --line-300:#d9d9d2;        /* rules, card borders */
  --line-200:#e9e9e3;        /* soft rules inside lists */
  --line-250:#dcded9;        /* marketing rules */

  /* ---- Brand: slate blue (primary) ---- */
  --blue-700:#3d4a5d;
  --blue-600:#4a596f;        /* THE blue — primary actions, active state */
  --blue-500:#53647a;        /* marketing blue */
  --blue-100:#eff1f4;        /* blue-soft — active/hover wash */
  --blue-050:#e7ebef;        /* marketing blue-soft */

  /* ---- Brand: coral (accent, never a primary action) ---- */
  --coral-600:#a65f52;       /* THE coral — eyebrows, Pro CTA, counters */
  --coral-500:#a87362;       /* marketing coral */
  --coral-400:#b87861;       /* logo mark spine */
  --coral-100:#f6eeeb;       /* coral-soft — format tags */
  --coral-050:#f3e9e4;

  /* ---- Semantic status ---- */
  --green-600:#4d7667;       /* success — "files are not stored" */
  --green-500:#557369;
  --green-200:#7ef0c1;       /* toast checkmark on dark */
  --red-600:#a43d31;         /* destructive text */
  --red-500:#c83e34;         /* destructive action */
  --red-100:#fff5f3;
  --red-200:#dfaaa2;

  /* ================= Semantic aliases ================= */
  --page:var(--paper-2);
  --surface:var(--paper-1);
  --surface-strong:var(--paper-0);
  --surface-sunken:var(--paper-4);
  --ink:var(--ink-900);
  --muted:var(--ink-500);
  --line:var(--line-300);
  --soft-line:var(--line-200);

  --blue:var(--blue-600);
  --blue-soft:var(--blue-100);
  --coral:var(--coral-600);
  --coral-soft:var(--coral-100);
  --success:var(--green-600);
  --danger:var(--red-500);
  --danger-ink:var(--red-600);

  --text-body:var(--ink-900);
  --text-muted:var(--ink-500);
  --text-accent:var(--coral-600);
  --text-link:var(--blue-600);
  --text-on-brand:#ffffff;

  --surface-card:var(--paper-1);
  --surface-overlay:var(--paper-0);
  --surface-wash:var(--blue-100);
  --surface-tag:var(--coral-100);

  --border-default:var(--line-300);
  --border-strong:var(--blue-600);
  --border-dashed:var(--blue-600);

  --scrim:color-mix(in srgb, #090909 50%, transparent);
  --scrim-panel:color-mix(in srgb, #090909 45%, transparent);
  --focus-ring:color-mix(in srgb, var(--blue-600) 35%, transparent);
}
:root{
  /* Families — two, no third. */
  --font-display:"Unbounded","Arial Black",sans-serif;   /* headings, brand, big numbers */
  --font-ui:"Golos Text",Arial,sans-serif;               /* everything else */
  --font-body:var(--font-ui);

  /* Weights actually shipped */
  --weight-regular:400; /* @kind font */
  --weight-medium:500; /* @kind font */
  --weight-semibold:600; /* @kind font */
  --weight-bold:700; /* @kind font */

  /* Display scale — Unbounded, always negative tracking */
  --text-hero:clamp(44px,4.05vw,58px);      /* app h1 */
  --text-hero-seo:clamp(40px,6.4vw,76px);   /* marketing h1 */
  --text-display-lg:clamp(30px,4vw,55px);   /* pricing headline */
  --text-display-md:clamp(26px,2.6vw,38px); /* section headline */
  --text-display-sm:clamp(21px,2.3vw,31px); /* card headline */
  --text-title:25px;                        /* mega-menu / modal title */
  --text-title-sm:19px;

  /* Body scale — Golos Text */
  --text-lead:clamp(17px,1.4vw,21px);
  --text-base:16px;
  --text-sm:15px;
  --text-body-sm:14px;
  --text-xs:13px;
  --text-2xs:12px;
  --text-3xs:11px;
  --text-micro:10px;

  /* Tracking — the DOKIVO signature is very tight display type */
  --track-brand:-0.08em; /* @kind font */ /* wordmark only */
  --track-hero:-0.045em; /* @kind font */
  --track-display:-0.04em; /* @kind font */
  --track-title:-0.03em; /* @kind font */
  --track-tight:-0.035em; /* @kind font */
  --track-eyebrow:0.08em; /* @kind font */ /* uppercase micro-labels */
  --track-eyebrow-wide:0.16em; /* @kind font */

  /* Line height */
  --leading-hero:1.04; /* @kind font */
  --leading-display:1.12; /* @kind font */
  --leading-tight:1.18; /* @kind font */
  --leading-body:1.55; /* @kind font */
  --leading-prose:1.65; /* @kind font */
  --leading-snug:1.45; /* @kind font */
}
:root{
  /* Raw scale — the codebase is deliberately off-grid (17, 22, 27, 34, 39). Do not snap to 4/8. */
  --space-1:4px;
  --space-2:7px;
  --space-3:9px;
  --space-4:11px;
  --space-5:13px;
  --space-6:14px;
  --space-7:18px;
  --space-8:22px;
  --space-9:24px;
  --space-10:28px;
  --space-11:32px;
  --space-12:34px;
  --space-13:42px;
  --space-14:54px;
  --space-15:72px;
  --space-16:78px;

  /* Layout */
  --container-app:1360px; /* @kind spacing */
  --container-seo:1240px; /* @kind spacing */
  --container-menu:1320px; /* @kind spacing */
  --gutter:32px;
  --gutter-mobile:16px;

  /* Fixed chrome */
  --header-height:82px; /* @kind spacing */
  --header-height-mobile:68px; /* @kind spacing */
  --editor-top:68px; /* @kind spacing */
  --rail-width:220px; /* @kind spacing */
  --inspector-width:340px; /* @kind spacing */

  /* Control sizing */
  --control-height:44px; /* @kind spacing */ /* notched button min-height */
  --control-height-sm:42px; /* @kind spacing */ /* editor buttons, form fields */
  --control-height-lg:46px; /* @kind spacing */ /* run button, tool rows */
  --icon-tile:52px; /* @kind spacing */
}
:root{
  /* DOKIVO's signature: square corners with one machined notch (top-right). */
  --notch-xs:12px;
  --notch-sm:15px;
  --notch-md:18px;
  --notch-lg:24px;
  --notch-xl:32px;

  --clip-notch-sm:polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%); /* @kind other */
  --clip-notch-md:polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%); /* @kind other */
  --clip-notch-lg:polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%); /* @kind other */
  --clip-notch-xl:polygon(0 0, calc(100% - 32px) 0, 100% 32px, 100% 100%, 0 100%); /* @kind other */
  /* Two opposite notches — the research strip */
  --clip-notch-diag:polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 24px 100%, 0 calc(100% - 24px)); /* @kind other */
  /* Four cut corners — the dropzone */
  --clip-notch-quad:polygon(28px 0, calc(100% - 28px) 0, 100% 28px, 100% calc(100% - 28px), calc(100% - 28px) 100%, 28px 100%, 0 calc(100% - 28px), 0 28px); /* @kind other */
  /* Small chamfered tile — icon chips, chevron box */
  --clip-chip:polygon(0 0, 72% 0, 100% 28%, 100% 100%, 0 100%); /* @kind other */

  /* Marketing/guides build softens the notch into an asymmetric radius. */
  --radius-seo-sm:9px 9px 3px 9px;
  --radius-seo-md:13px 13px 4px 13px;
  --radius-seo-lg:16px 16px 5px 16px;
  --radius-seo-xl:22px 22px 7px 22px;
  --radius-pill:999px;
  --radius-none:0;

  --border-width:1px; /* @kind spacing */
  --border-width-accent:2px; /* @kind spacing */
  --border-width-bar:5px; /* @kind spacing */      /* left accent bar on .home-help / .business-plan */
}
:root{
  /* Shadows are rare and always cool-grey, never black-on-white default. */
  --shadow-none:none;
  --shadow-card:0 8px 24px rgba(37,45,53,.04);
  --shadow-raise:0 10px 24px rgba(37,45,53,.07);
  --shadow-lift:0 16px 34px rgba(37,45,53,.08);
  --shadow-seo:0 24px 60px rgba(37,45,53,.09);
  --shadow-search:0 16px 50px color-mix(in srgb, var(--ink) 14%, transparent);
  --shadow-menu:0 24px 70px color-mix(in srgb, var(--ink) 16%, transparent);
  --shadow-lg:var(--shadow-menu);
  --shadow-toast:0 12px 40px color-mix(in srgb, var(--ink) 22%, transparent);
  --shadow-panel:-20px 0 60px rgba(0,0,0,.16);
  --shadow-document:0 16px 50px rgba(0,0,0,.17);

  /* Inset "borders" used instead of outlines on ghost buttons + featured cards */
  --inset-hairline:inset 0 0 0 1px var(--line); /* @kind shadow */
  --inset-tab-active:inset 0 -2px 0 var(--blue); /* @kind shadow */
  --inset-bar-blue:inset 4px 0 0 var(--blue); /* @kind shadow */
  --inset-bar-coral:inset 4px 0 0 var(--coral); /* @kind shadow */

  --blur-header:blur(16px); /* @kind other */
  --blur-scrim:blur(5px); /* @kind other */
  --blur-panel:blur(4px); /* @kind other */

  --z-header:60; /* @kind other */
  --z-mega:55; /* @kind other */
  --z-search:80; /* @kind other */
  --z-toast:110; /* @kind other */
  --z-modal:120; /* @kind other */
  --z-panel:130; /* @kind other */
  --z-editor:250; /* @kind other */
  --z-consent:320; /* @kind other */
}
:root{
  /* One easing, short durations. No bounce, no spring, no scale-in. */
  --ease:ease; /* @kind other */
  --duration-fast:140ms; /* @kind other */
  --duration-base:150ms; /* @kind other */
  --duration-mid:180ms; /* @kind other */
  --duration-slow:200ms; /* @kind other */

  --transition-button:transform 140ms ease, filter 140ms ease; /* @kind other */
  --transition-card:transform 150ms ease, border-color 150ms ease; /* @kind other */
  --transition-theme:color 180ms ease, background-color 180ms ease; /* @kind other */
  --transition-nav:background .2s ease, color .2s ease; /* @kind other */

  /* The only movement primitive: a 2-3px lift on hover. */
  --hover-lift:translateY(-2px); /* @kind other */
  --hover-lift-lg:translateY(-3px); /* @kind other */
  --hover-filter:brightness(0.98); /* @kind other */
  --disabled-opacity:0.55; /* @kind other */
}
/* DOKIVO — реальный визуальный язык продукта.
   Основа: readme.md §5 VISUAL FOUNDATIONS + §6 ICONOGRAPHY, токены из ../styles.css.
   Тёплая бумага, машинные углы. Ни чёрных плит, ни градиентов, ни радиусов по кругу. */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scrollbar-gutter:stable}
body{background:var(--page);color:var(--ink);font-family:var(--font-ui);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--text-link);text-decoration:none;transition:color .16s ease}
a:hover{color:var(--ink)}
button,input,select{font:inherit}
img{display:block;max-width:100%}
.num{font-variant-numeric:tabular-nums}

/* смягчённый маркетинговый радиус — три круглых угла, один поджатый */
:root{--r-xs:9px 9px 3px 9px;--r-sm:13px 13px 4px 13px;--r-md:16px 16px 5px 16px;--r-lg:22px 22px 6px 22px;
--shadow-soft:0 8px 24px rgba(37,45,53,.04);--shadow-float:0 16px 50px rgba(37,45,53,.09);--shadow-mega:0 24px 70px rgba(37,45,53,.13)}
/* вырезы приложения — из tokens/shape.css: одиночная засечка сверху справа */
.notch24{clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%)}
.wrap{width:min(1240px,100% - 64px);margin:0 auto}

/* ─── шапка: бумага под блюром, не плита ─── */
.hdr{position:sticky;top:0;z-index:60;height:var(--header-height);display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:30px;padding:0 34px;background:color-mix(in srgb,var(--page) 94%,transparent);border-bottom:1px solid var(--soft-line);backdrop-filter:blur(16px)}
.wordmark{font-family:var(--font-display);font-size:26px;font-weight:700;letter-spacing:var(--track-brand);color:var(--ink)}
.wordmark:hover{color:var(--ink)}
.site-primary-nav{min-width:0;font-size:14.5px;font-weight:500}
.site-nav-items{display:flex;align-items:center;gap:3px;min-width:0}
.mobile-nav-trigger{display:none;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}
.nav-context{margin-right:5px;color:var(--muted);font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.nav-separator{width:1px;height:24px;margin:0 7px;background:var(--line)}
.nav-menu{position:relative}
.nav-menu>summary{display:flex;align-items:center;gap:6px;min-height:44px;padding:0 9px;border-bottom:2px solid transparent;color:var(--ink);list-style:none;white-space:nowrap;cursor:pointer;transition:color .16s ease,background-color .16s ease,border-color .16s ease}
.nav-menu>summary::-webkit-details-marker{display:none}
.nav-menu>summary:hover,.nav-menu[open]>summary{color:var(--blue);background:var(--blue-soft);border-bottom-color:var(--blue)}
.nav-menu.is-current>summary{color:var(--blue);border-bottom-color:var(--blue)}
.nav-caret{flex:0 0 auto;color:var(--blue);transition:transform .16s ease}
.nav-menu[open] .nav-caret{transform:rotate(180deg)}
.nav-pricing,.nav-scan{min-height:44px;display:flex;align-items:center;gap:6px;padding:0 9px;color:var(--ink);white-space:nowrap;border-bottom:2px solid transparent}
.nav-pricing:hover,.nav-pricing[aria-current],.nav-scan:hover,.nav-scan[aria-current]{color:var(--blue);border-bottom-color:var(--blue)}
.nav-popover{position:absolute;top:calc(100% + 12px);left:0;z-index:70;width:min(660px,calc(100vw - 40px));padding:20px 22px 17px;background:var(--surface-strong);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%);box-shadow:var(--shadow-mega);font-weight:400}
.nav-popover-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:11px;padding:0 2px 14px;border-bottom:1px solid var(--blue);color:var(--blue)}
.nav-popover-head>i{font-size:22px}
.nav-popover-head>div{display:grid;gap:3px}
.nav-popover-head strong{font-family:var(--font-display);font-size:15px;font-weight:600;color:var(--ink)}
.nav-popover-head span:not(.cnt){max-width:48ch;color:var(--muted);font-size:12px;line-height:1.4}
.nav-popover-head .cnt{color:var(--muted);font-size:12px;white-space:nowrap}
.nav-tool-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:20px;padding-top:5px}
.nav-tool-item{min-height:43px}
.nav-tool-item .nm{font-size:13.5px}
.nav-all{display:inline-flex;align-items:center;gap:7px;margin-top:12px;padding:6px 2px;color:var(--blue);font-size:13.5px;font-weight:500}
.nav-all:hover{color:var(--ink)}
.nav-menu--help .nav-popover{left:auto;right:0;width:min(470px,calc(100vw - 40px));padding:10px 12px}
.help-link{display:grid;grid-template-columns:34px minmax(0,1fr) 20px;align-items:center;gap:10px;padding:12px 8px;color:var(--ink);border-bottom:1px solid var(--soft-line)}
.help-link:last-child{border-bottom:0}
.help-link:hover,.help-link[aria-current]{background:var(--blue-soft);color:var(--blue)}
.help-link>i:first-child{font-size:21px;color:var(--blue)}
.help-link>span{display:grid;gap:2px;white-space:normal}
.help-link strong{font-size:14px;font-weight:600}
.help-link small{color:var(--muted);font-size:11.5px;line-height:1.35}
.help-link .ar{color:var(--blue)}
.hdr .sp{display:flex;align-items:center;gap:15px}
.hdr .sp .divider{width:1px;height:29px;background:var(--line)}
.hdr .sp .btn.ghost{width:156px}
.hdr .sp .btn.ghost .auth-label{display:block;width:84px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* ─── IconButton.jsx: bare вариант — padding 8, без рамки и заливки ─── */
.iconbtn{display:grid;place-items:center;padding:8px;border:0;background:none;color:var(--ink);cursor:pointer;transition:color .16s ease}
.iconbtn:hover{color:var(--blue)}
.iconbtn i{font-size:22px}
.iconbtn.bordered{width:40px;height:40px;padding:0;border:1px solid var(--line);background:transparent}
.iconbtn.bordered:hover{border-color:var(--blue)}

/* ─── кнопки: подъём и промывка, не потемнение ─── */
/* ─── Button.jsx: засечка, а не радиус ─── */
.btn{min-height:var(--control-height);display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:0 22px;border:0;clip-path:polygon(0 0,calc(100% - 15px) 0,100% 15px,100% 100%,0 100%);font-family:var(--font-ui);font-size:var(--text-sm);font-weight:var(--weight-semibold);line-height:1;text-decoration:none;cursor:pointer;transition:var(--transition-button)}
.btn:hover{transform:translateY(-2px);filter:brightness(.98)}
.btn i{font-size:18px}
.btn.primary{background:var(--blue);color:#fff;min-width:220px}
.btn.accent{background:var(--coral);color:#fff}
.btn.ghost{background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.btn.ghost:hover{box-shadow:inset 0 0 0 1px var(--blue);color:var(--blue)}
.btn.quiet{background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.btn.quiet:hover{background:var(--blue-soft);color:var(--blue);box-shadow:inset 0 0 0 1px var(--blue)}
.btn.sm{min-height:42px;padding:0 15px;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}
.btn.sm.primary{min-width:0}
.btn.sm i{font-size:16px}
.btn.block{display:flex;width:100%;min-width:0}

/* ─── страница ─── */
/* ─── Breadcrumbs.jsx: разделитель — слэш ─── */
.crumb{display:flex;flex-wrap:wrap;align-items:center;gap:7px;padding:22px 0 0;color:var(--muted);font-family:var(--font-ui);font-size:13px}
.crumb a{color:var(--blue-500)}
.crumb a:hover{color:var(--ink)}
.crumb .sep{color:#a2a4a6}
/* ─── Eyebrow.jsx: единственный uppercase в бренде, набран Golos Text ─── */
.eyebrow{display:inline-flex;align-items:center;gap:7px;color:var(--coral);font-family:var(--font-ui);font-size:11px;font-weight:700;letter-spacing:var(--track-eyebrow-wide);text-transform:uppercase}
.eyebrow i{font-size:14px}
.eyebrow.narrow{font-size:12px;font-weight:600;letter-spacing:var(--track-eyebrow)}
/* приглушённая микро-метка — отдельный элемент, не перекрашенный Eyebrow */
.microlabel{display:block;color:var(--muted);font-family:var(--font-ui);font-size:11px;font-weight:600;letter-spacing:var(--track-eyebrow);text-transform:uppercase}
h1.pg{margin-top:12px;font-family:var(--font-display);font-size:clamp(30px,3.1vw,42px);font-weight:600;letter-spacing:var(--track-hero);line-height:1.08;max-width:20ch;text-wrap:balance}
.lede{margin-top:14px;max-width:74ch;color:var(--muted);font-size:16px;line-height:1.62;text-wrap:pretty}
h2.sec{font-family:var(--font-display);font-size:26px;font-weight:600;letter-spacing:var(--track-title);line-height:1.14;text-wrap:balance}
h3.sub{font-family:var(--font-ui);font-size:17px;font-weight:600;letter-spacing:var(--track-tight)}
section.band{padding:46px 0}
.secline{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.secline .cnt{color:var(--coral);font-size:14.5px}
.secline .more{margin-left:auto;font-size:14px}

/* ─── карточка DOKIVO: бумага, волосяная линия, подъём на ховере ─── */
/* ─── NotchPanel.jsx: каждая карточка, меню и полоса — засечка ─── */
.card{background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%);transition:var(--transition-card)}
.card.n-sm{clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}
.card.n-md{clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}
.card.wash{background:var(--blue-soft);border-color:color-mix(in srgb,var(--blue) 38%,var(--line))}
a.card:hover,.card.hov:hover{border-color:var(--blue);transform:translateY(-2px)}

/* плитка инструмента */
.tool{display:grid;grid-template-columns:auto 1fr;gap:13px;align-items:center;padding:15px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);color:var(--ink);transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease}
.tool:hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:var(--shadow-soft)}
.tool i.ic{font-size:23px;color:var(--blue)}
.tool .tx{min-width:0}
.tool b{display:flex;align-items:center;gap:7px;font-size:14.5px;font-weight:600;line-height:1.3}
.tool span{display:block;margin-top:3px;color:var(--muted);font-size:12px;line-height:1.4}
/* ─── FormatTag.jsx ─── */
.fmt,.tag{max-width:66px;overflow:hidden;padding:3px 5px;color:var(--coral);background:var(--coral-soft);font-family:var(--font-ui);font-size:10px;font-weight:600;line-height:1;text-overflow:ellipsis;white-space:nowrap}
/* «новое» — заливка кораллом, белый текст: коралловое на коралловом сливалось */
.tag{max-width:none;padding:3px 6px;background:var(--coral);color:#fff;font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}

/* чамферная плитка-иконка 52px — белый глиф на синем */
.chip{display:grid;place-items:center;width:52px;height:52px;background:var(--blue);color:#fff;clip-path:var(--clip-chip)}
.chip i{font-size:26px}
.chip.sm{width:38px;height:38px}.chip.sm i{font-size:20px}
.chip.coral{background:var(--coral)}

.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:11px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}

/* вкладки категорий — inset подчёркивание */
/* ─── CategoryTabs.jsx: общая рамка, засечка 18px, разделители 1px ─── */
.cats{display:flex;align-items:stretch;width:fit-content;max-width:100%;overflow-x:auto;scrollbar-width:none;border:1px solid var(--line);border-bottom-color:var(--blue);clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}
.cats a{display:flex;align-items:center;justify-content:center;gap:9px;min-width:145px;padding:14px 22px;border-right:1px solid var(--line);color:var(--ink);background:var(--surface);font-size:var(--text-base);font-weight:500;white-space:nowrap;transition:background .16s ease,color .16s ease}
.cats a i{font-size:19px;color:var(--blue)}
.cats a[aria-current] i{color:var(--blue)}
.cats a:last-child{border-right:0}
.cats a:hover{color:var(--blue)}
.cats a[aria-current]{color:var(--blue);background:var(--blue-soft);box-shadow:inset 0 -2px 0 var(--blue);font-weight:600}

/* строки доверия */
.trust{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:var(--r-md);background:color-mix(in srgb,var(--surface) 84%,transparent);overflow:hidden}
.trust>div{display:grid;grid-template-columns:auto 1fr;align-content:center;gap:3px 13px;padding:17px 19px;border-right:1px solid var(--line)}
.trust>div:last-child{border-right:0}
.trust i{grid-row:span 2;font-size:24px;color:var(--blue);align-self:center}
.trust i.ok{color:var(--success)}
.trust b{font-size:14px;font-weight:600}
.trust span{color:var(--muted);font-size:12px;line-height:1.45}

/* заметки */
/* ─── Note.jsx: info · strong · warning. Ни радиуса, ни полосы-акцента ─── */
.note{width:100%;display:flex;align-items:flex-start;gap:10px;padding:12px 14px;color:var(--muted);background:var(--blue-soft);border:0;font-family:var(--font-ui);font-size:13px;line-height:1.45}
.note i{font-size:21px;color:var(--blue);flex:0 0 auto;margin-top:1px}
.note>span{min-width:0}
.note.strong{color:var(--ink);border:1px solid var(--blue)}
.note.green i{color:var(--success)}
.note.coral{color:var(--danger-ink);background:var(--coral-soft);border:1px solid color-mix(in srgb,var(--coral) 45%,var(--line))}
.note.coral i{color:var(--coral)}

/* формы */
/* ─── Field.jsx: 46px, без радиуса, кольцо 3px при фокусе ─── */
.inp{width:100%;min-height:46px;padding:11px 13px;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:0;font-family:var(--font-ui);font-size:var(--text-base);outline:0}
.inp.compact{min-height:42px;padding:9px 10px}
.inp:focus{border-color:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 12%,transparent)}
/* ─── InlineSearch.jsx: засечка 12px, без тени ─── */
.search{width:310px;max-width:40vw;display:flex;align-items:center;gap:9px;padding:10px 13px;border:1px solid var(--line);background:var(--surface);clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}
.search i{font-size:18px;color:var(--ink)}
.search input{min-width:0;width:100%;border:0;outline:0;color:var(--ink);background:transparent;font-family:var(--font-ui);font-size:var(--text-body-sm)}
.search input::placeholder{color:var(--muted)}

/* таблицы */
table.t{width:100%;border-collapse:collapse;font-size:13.5px}
.t th,.t td{padding:11px 13px;text-align:left;border-bottom:1px solid var(--soft-line);vertical-align:top}
.t th{font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);font-weight:600;background:color-mix(in srgb,var(--surface-sunken) 60%,transparent)}
.t td.r,.t th.r{text-align:right;white-space:nowrap}
.t tbody tr:last-child td{border-bottom:0}

/* чипы-ссылки */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips a{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;background:var(--surface);border:1px solid var(--line);color:var(--ink);font-size:13.5px;white-space:nowrap;transition:border-color .16s ease,background .16s ease,color .16s ease,transform .16s ease}
.chips a:hover{border-color:var(--blue);background:var(--blue-soft);color:var(--blue);transform:translateY(-2px)}
.chips a i{font-size:16px;color:var(--blue)}

/* фигура с изображением — как в продукте */
figure.shot{border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface-strong);overflow:hidden}
figure.shot img{width:100%;object-fit:contain}
figure.shot figcaption{padding:11px 14px;border-top:1px solid var(--soft-line);color:var(--muted);font-size:12px;line-height:1.45}

/* подвал: бумага, не чёрная плита */
footer.ft{margin-top:56px;padding:36px 0 30px;background:color-mix(in srgb,var(--surface) 70%,transparent);border-top:1px solid var(--line)}
footer.ft .in{width:min(1240px,100% - 64px);margin:0 auto;display:grid;grid-template-columns:minmax(190px,1.7fr) repeat(3,minmax(118px,1fr));gap:26px}
footer.ft .brand{margin-bottom:13px}
footer.ft p{color:var(--muted);font-size:12.5px;line-height:1.55;max-width:30ch}
footer.ft b{display:block;font-size:13.5px;font-weight:600;margin-bottom:11px}
footer.ft a{display:block;padding:4px 0;color:var(--muted);font-size:12.5px}
footer.ft a:hover{color:var(--blue)}
footer.ft .fine{grid-column:1/-1;margin-top:8px;padding-top:20px;border-top:1px solid var(--line);color:var(--muted);font-size:12px;line-height:1.6}

.hint{position:fixed;right:22px;bottom:22px;z-index:100;display:flex;gap:11px;align-items:flex-start;max-width:310px;padding:14px 16px;background:var(--surface-strong);border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:var(--shadow-mega);font-size:12.5px;line-height:1.5}
.hint i{font-size:19px;color:var(--blue);flex:0 0 auto}
.hint a{font-size:12px}

@media(max-width:1240px){.hint{display:none}}
@media(max-width:1240px){.nav-context{display:none}.nav-menu>summary,.nav-pricing,.nav-scan{padding-inline:7px}}
@media(max-width:1120px){.grid4{grid-template-columns:repeat(3,1fr)}.hdr{gap:18px;padding:0 22px}.site-nav-items{gap:1px}.nav-tool-item[data-nav-index="6"],.nav-tool-item[data-nav-index="7"],.nav-tool-item[data-nav-index="8"],.nav-tool-item[data-nav-index="9"]{display:none}}
@media(max-width:1599px){.mobile-nav-trigger{display:flex}.site-primary-nav{justify-self:end}.site-nav-items{display:none;position:fixed;top:var(--header-height);left:0;right:0;z-index:68;max-height:calc(100dvh - var(--header-height));overflow:auto;padding:16px 22px 24px;background:var(--surface-strong);border-bottom:1px solid var(--line);box-shadow:var(--shadow-float)}.site-primary-nav[data-mobile-open] .site-nav-items{display:flex;align-items:stretch;flex-direction:column;gap:2px}.nav-context{display:block;margin:0 0 7px;padding:0 4px}.nav-separator{width:100%;height:1px;margin:8px 0;background:var(--line)}.nav-menu>summary,.nav-pricing{min-height:48px;justify-content:space-between;padding:0 10px;border-bottom:1px solid var(--soft-line);font-size:16px}.nav-popover,.nav-menu--help .nav-popover{position:static;width:100%;margin:0;padding:14px 16px;clip-path:none;box-shadow:none;border-color:var(--soft-line);background:color-mix(in srgb,var(--page) 48%,var(--surface))}.nav-popover-head{padding-bottom:12px}.nav-pricing{color:var(--coral);font-weight:600}.nav-pricing:hover{color:var(--coral)}}
@media(max-width:1599px){.nav-scan{min-height:48px;justify-content:flex-start;padding:0 10px;border-bottom:1px solid var(--soft-line);font-size:16px}}
@media(max-width:1040px){.grid3{grid-template-columns:1fr 1fr}.hdr .sp .iconbtn,.hdr .sp .divider{display:none}}
@media(max-width:760px){.wrap,footer.ft .in{width:min(1240px,100% - 40px)}.grid4,.grid3,.grid2,.trust,.catcards{grid-template-columns:1fr}footer.ft .in{grid-template-columns:1fr 1fr;gap:20px}footer.ft .in>div:first-child{grid-column:1/-1}.hdr{gap:14px;padding:0 18px}}

/* ─── Dropzone.jsx: четыре срезанных угла, хвост снизу слева ─── */
.dz{position:relative}
.dz .inner{position:relative;min-height:392px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;padding:40px 34px;text-align:center;background:color-mix(in srgb,var(--surface) 75%,transparent);border:2px dashed var(--blue);clip-path:polygon(28px 0,calc(100% - 28px) 0,100% 28px,100% calc(100% - 28px),calc(100% - 28px) 100%,28px 100%,0 calc(100% - 28px),0 28px);transition:background-color 150ms ease,transform 150ms ease}
/* что произойдёт после загрузки — три шага внутри рамки */
.dzflow{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;margin-top:11px;padding-top:19px;border-top:1px solid var(--soft-line);width:100%;color:var(--muted);font-size:12px}
.dzflow>span{display:inline-flex;align-items:center;gap:8px;text-align:left;max-width:19ch;line-height:1.35}
.dzflow b{font-family:var(--font-display);font-size:14.5px;font-weight:600;display:grid;place-items:center;width:21px;height:21px;flex:0 0 auto;background:var(--blue);color:#fff}
.dzflow>i{font-size:15px;color:var(--blue)}
.dz .inner i.big{font-size:76px;color:var(--blue)}
.dz .inner strong{font-size:28px;font-weight:600;color:var(--ink)}
.dz .inner small{color:var(--muted);font-size:13px;line-height:1.5;max-width:46ch}

/* ─── ToolRow.jsx: сетка 27px/1fr/auto/20px, промывка без подъёма ─── */
.trow{width:100%;min-height:46px;display:grid;grid-template-columns:27px minmax(0,1fr) auto auto 20px;align-items:center;gap:8px;padding:7px 4px;border-bottom:1px solid var(--soft-line);color:var(--ink);background:transparent;transition:background .16s ease,color .16s ease}
.trow>.tag{flex:0 0 auto}
.trow:last-child{border-bottom:0}
.trow:hover{background:var(--blue-soft);color:var(--blue)}
.trow>i.g{display:grid;place-items:center;font-size:19px;color:currentColor}
.trow>span.nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
.trow>i.ar{font-size:18px;color:var(--blue)}

/* ─── CategoryColumn.jsx: засечка 24px, синяя подчёркнутая шапка ─── */
.ccol{min-width:0;min-height:282px;padding:17px 14px 10px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%);transition:var(--transition-card)}
.ccol:hover{border-color:var(--blue);transform:translateY(-3px)}
.ccol>.ch{display:flex;align-items:center;gap:11px;padding:0 4px 12px;color:var(--blue);border-bottom:1px solid var(--blue)}
.ccol>.ch i{font-size:22px}
.ccol>.ch h3{font-family:var(--font-display);font-size:14.5px;font-weight:600;color:var(--ink)}
.ccol>.ch .cnt{margin-left:auto;color:var(--coral);font-size:13px}
.ccol>.rows{padding-top:5px}

/* ─── ResearchCard.jsx ─── */
.rcard{min-height:150px;display:flex;flex-direction:column;padding:20px;color:var(--ink);border:1px solid var(--line);background:var(--surface);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%);transition:var(--transition-card)}
.rcard:hover{border-color:var(--blue);transform:translateY(-2px)}
.rcard>.eb{color:var(--coral);font-size:11px;font-weight:700;letter-spacing:var(--track-eyebrow);text-transform:uppercase}
.rcard>strong{font-family:var(--font-display);font-size:17px;font-weight:600;margin-top:16px;line-height:1.18;letter-spacing:var(--track-title)}
.rcard>small{margin-top:auto;padding-top:14px;color:var(--muted);font-size:13px;line-height:1.45}

/* ─── UsageMeter.jsx ─── */
.meter{display:grid;gap:10px;padding:16px;border:1px solid var(--line);background:var(--surface)}
.meter .top{display:flex;align-items:end;justify-content:space-between;gap:14px}
.meter .top span{color:var(--muted);font-size:12px}
.meter .top strong{font-size:14px;white-space:nowrap}
.meter .bar{height:6px;overflow:hidden;background:var(--blue-soft)}
.meter .bar i{display:block;height:100%;background:var(--blue)}
.meter small{color:var(--muted);font-size:12px}

/* ─── засечка вместо мягкого радиуса на карточных контейнерах (NotchPanel) ─── */
.r{min-height:150px;display:flex;flex-direction:column;padding:20px;color:var(--ink);border:1px solid var(--line);background:var(--surface);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%);transition:var(--transition-card)}
.r:hover{border-color:var(--blue);transform:translateY(-2px)}
.r{gap:9px}
.r>.eyebrow{margin-bottom:0}
.r>b{font-family:var(--font-display);font-size:17px;font-weight:600;margin-top:0;line-height:1.24;letter-spacing:var(--track-title);text-wrap:pretty}
.r>p{color:var(--muted);font-size:13px;line-height:1.45}
.tool,.chips a,.filters button{border-radius:0;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}
.prob,.g,.f,.plan,.trust,.panel,.fcard,figure.shot{border-radius:0}
/* Срез угла — форма карточки. Класс `g` носит ещё и глиф строки каталога (.trow>i.g),
   а срезать угол у иконки размером 19px нельзя: она теряет верхний правый угол. */
.prob,.g:not(i):not(svg),.f,.panel{clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}
.plan,.trust,.fcard{clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%)}
figure.shot{clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%)}
.sizer,.offer,.est{border-radius:0}
/* чипы форматов под дропзоной */
.dzfmt{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:2px}
.dzfmt span{padding:3px 6px;color:var(--coral);background:var(--coral-soft);font-size:10px;font-weight:600;line-height:1}

/* графики — соцкарточки 1200×630 со вшитым текстом: отодвигаем от засечки, иначе срез идёт по надписи */
.rcard figure.shot{margin:14px 14px 0;border:1px solid var(--line)!important;background:var(--surface-strong)}
.rcard figure.shot img{width:100%;height:auto;object-fit:contain}
.rcard>span:last-child{padding:15px 17px 17px}
footer.ft .in{padding-bottom:0}

/* ─── компактный список параметров вместо широкой таблицы ─── */
.spec{margin-top:20px;border:1px solid var(--line);background:var(--surface-strong)}
.spec>div{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:22px;padding:11px 15px;border-bottom:1px solid var(--soft-line);font-size:13.5px;line-height:1.45}
.spec>div:last-child{border-bottom:0}
.spec dt{color:var(--muted);white-space:nowrap}
.spec dd{color:var(--ink)}
.spec dd a{margin-left:7px;padding:2px 6px;background:var(--blue-soft);color:var(--blue);font-size:11px;white-space:nowrap}
.spec dd a:first-child{margin-left:0}
@media(max-width:640px){.spec>div{grid-template-columns:1fr;gap:3px}.spec dt{white-space:normal}}
/* карточка замера: три уровня вместо четырёх — надзаголовок, название, пояснение */
.r>.meta{display:none}

/* На телефоне каждая категория остаётся коротким раскрывающимся блоком. */
@media(max-width:700px){.mobile-nav-trigger span{display:none}.site-nav-items{padding:14px 16px 22px}.nav-tool-grid{grid-template-columns:1fr}.nav-popover-head>div>span{display:none}.nav-tool-item[data-nav-index="6"],.nav-tool-item[data-nav-index="7"],.nav-tool-item[data-nav-index="8"],.nav-tool-item[data-nav-index="9"]{display:none}}

/* карточки-сетки: строки по содержимому, иначе заголовки в ряду не совпадают по базовой линии */
.f,.g,.cc,.r{align-content:start}

/* правовая полоса: строка ссылок + реквизиты. на телефоне ссылки переносятся, а не выстраиваются в столбец */
footer.ft .in.legal{display:grid;gap:10px;margin-top:30px;padding-top:18px;border-top:1px solid var(--line);grid-template-columns:1fr}
footer.ft .in.legal nav{display:flex;flex-wrap:wrap;gap:8px 20px}
footer.ft .in.legal a{display:inline;padding:0;color:var(--muted);font-size:12.5px;white-space:nowrap;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
footer.ft .in.legal a:hover{color:var(--blue);text-decoration-color:currentColor}
footer.ft .in.legal p{margin:0;max-width:none;font-size:12px;line-height:1.5}
footer.ft .in.legal p.made-with{color:var(--ink);font-family:var(--font-display,"Unbounded",sans-serif);font-size:11px;font-weight:600;letter-spacing:.01em}
footer.ft .in.legal p.made-with{display:inline-flex;align-items:center;gap:7px}
footer.ft .in.legal .made-with__heart{width:19px;height:19px;overflow:visible;color:#c45643;filter:drop-shadow(0 2px 3px rgb(180 74 58 / 20%))}
footer.ft .in.legal .made-with__heart path{fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
footer.ft .in.legal p.ck{color:color-mix(in srgb,var(--muted) 78%,transparent);font-size:11.5px}
@media(max-width:560px){footer.ft .in.legal nav{gap:8px 16px}footer.ft .in.legal a{font-size:12px}}

/* герой: один цвет в заголовке, один смысловой уровень на элемент */
h1 em{color:inherit;font-style:normal}
.h .cnt,h2 .cnt{display:inline;margin-left:9px;font-family:var(--font-ui);font-size:13px;font-weight:400;color:var(--muted);letter-spacing:0;white-space:nowrap}

/* три обещания в левой колонке героя вместо отдельной полосы ниже */
.promise{list-style:none;margin:30px 0 0;padding:22px 0 0;border-top:1px solid var(--soft-line);display:grid;gap:13px}
.promise li{display:grid;grid-template-columns:20px 1fr;gap:11px;align-items:start;color:var(--muted);font-size:13px;line-height:1.5}
.promise i{font-size:18px;color:var(--blue);line-height:1}
.promise b{color:var(--ink);font-weight:600}

/* надзаголовок плашкой: коралловый на светлой подложке */
.eyebrow.pill{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;background:color-mix(in srgb,var(--coral) 12%,transparent);color:var(--coral);clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,0 100%)}
.eyebrow.pill i{font-size:14px}

/* справки о форматах: код формата плашкой, разбор с замером */
.fbriefs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:16px}
.fbrief{display:flex;flex-direction:column;gap:10px;padding:18px 19px 17px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%);color:var(--ink);transition:border-color .16s ease}
.fbrief:hover{border-color:var(--blue);color:var(--ink)}
.fbrief .ext{align-self:flex-start;padding:3px 8px;background:var(--surface-sunken);border:1px solid var(--line);font-family:var(--font-ui);font-size:10.5px;letter-spacing:.08em;color:var(--muted)}
.fbrief b{font-family:var(--font-display);font-size:14.5px;font-weight:600;line-height:1.32;text-wrap:pretty}
.fbrief .nt{color:var(--muted);font-size:12.5px;line-height:1.5;text-wrap:pretty}
.fbrief .go{display:flex;align-items:center;gap:7px;margin-top:auto;padding-top:6px;color:var(--blue);font-size:12.5px}
.fbrief:hover .go i{transform:translateX(3px)}
.fbrief .go i{font-size:14px;transition:transform .16s ease}
@media(max-width:1120px){.fbriefs{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:860px){.fbriefs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.fbriefs{grid-template-columns:1fr}}

/* подсказка строкой: увести в раздел «Проблемы» */
.hint-line{display:grid;grid-template-columns:20px minmax(0,1fr);gap:12px;align-items:center;margin-top:22px;padding:15px 18px;background:var(--surface-sunken);font-size:14px;line-height:1.55}
.hint-line>i{font-size:18px;color:var(--muted)}

/* тарифы для ИП, компаний и команд */
.biz{margin-top:34px;padding:32px 34px 30px;background:var(--surface-sunken);border-left:4px solid var(--blue)}
.biz .bz-head h2{font-family:var(--font-display);font-size:26px;font-weight:600;margin-top:10px;letter-spacing:var(--track-title);line-height:1.14;max-width:24ch;text-wrap:balance}
.biz .bz-head p{margin-top:13px;max-width:74ch;color:var(--muted);font-size:14.5px;line-height:1.6;text-wrap:pretty}
.bz-routes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:26px}
.bz-routes>div{display:flex;flex-direction:column;padding:20px 22px 18px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}
.bz-routes .rt{display:inline-flex;align-items:center;gap:9px;color:var(--blue);font-family:var(--font-ui);font-size:11px;font-weight:600;letter-spacing:var(--track-eyebrow);text-transform:uppercase}
.bz-routes .rt i{font-size:17px}
.bz-routes b{font-family:var(--font-display);font-size:14.5px;font-weight:600;margin-top:14px;line-height:1.3;text-wrap:balance}
.bz-routes ul{list-style:none;margin:13px 0 0;padding:0;display:grid;gap:8px;color:var(--muted);font-size:13.5px;line-height:1.45}
.bz-routes li{display:grid;grid-template-columns:14px minmax(0,1fr);gap:9px}
.bz-routes li::before{content:"";width:5px;height:5px;margin-top:7px;background:var(--blue)}
.bz-routes>div>a{display:inline-flex;align-items:center;gap:8px;margin-top:auto;padding-top:18px;color:var(--blue);font-size:13.5px}
.bz-routes>div>a i{font-size:15px;transition:transform .16s ease}
.bz-routes>div>a:hover i{transform:translateX(3px)}
.bz-edo{display:grid;grid-template-columns:22px minmax(0,1fr);gap:13px;margin-top:20px;padding:17px 20px;background:var(--surface);border:1px solid var(--line);font-size:14px;line-height:1.6}
.bz-edo>i{font-size:19px;color:var(--blue);line-height:1.3}
@media(max-width:1120px){.bz-routes{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.bz-routes{grid-template-columns:1fr}.biz{padding:24px 22px}}

/* метка новизны — в верхнем углу карточки, не в ряду кнопок */
.prob .mark{position:absolute;top:24px;right:26px;padding:3px 8px;background:color-mix(in srgb,var(--coral) 12%,transparent);color:var(--coral);font-family:var(--font-ui);font-size:9.5px;font-weight:600;letter-spacing:var(--track-eyebrow);text-transform:uppercase}

/* ЕДИНАЯ ЛЕСТНИЦА ЗАГОЛОВКОВ — все уровни Unbounded 600, тело и элементы управления Golos Text.
   1 страница 44 · 2 раздел 26 · 3 подраздел 20 · 4 карточка 17 · 5 плотная строка 14,5.
   Новые заголовки берут один из пяти размеров, промежуточных значений не вводить. */
/* DOKIVO — раскладка страниц.
   Собрано из инлайновых <style> четырнадцати макетов пакета переноса.
   Конфликтующие селекторы ограничены классом страницы на <body>. */

/* ── account.html → body.p-account ── */
.acc{display:grid;grid-template-columns:minmax(230px,268px) minmax(0,1fr);gap:22px;margin-top:26px;align-items:start}
.side{display:grid;gap:12px}
.hist{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.hist .hd{display:flex;align-items:baseline;gap:13px;padding:17px 20px;border-bottom:1px solid var(--soft-line)}
.hist b.t{font-family:var(--font-display);font-size:14.5px;font-weight:600;letter-spacing:var(--track-tight)}
.hist td small{color:var(--muted);font-size:11.5px}
.hist td i.op{font-size:19px;color:var(--blue);vertical-align:-4px;margin-right:7px}
.mainpane{min-width:0}
.setup{background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%)}
.setup .hd{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:start;padding:19px 22px;border-bottom:1px solid var(--soft-line)}
.setup .hd b.t{display:block;font-family:var(--font-display);font-size:15px;font-weight:600;letter-spacing:var(--track-tight)}
.setup .hd p{margin-top:6px;max-width:64ch;color:var(--muted);font-size:12.5px;line-height:1.55}
.setup .hd .cc{white-space:nowrap;padding:6px 12px;background:var(--surface-sunken);border:1px solid var(--line);color:var(--muted);font-size:12px}
.setup .hd .cc b{color:var(--ink);font-family:var(--font-display);font-size:14px;font-weight:700}
.chosen{display:flex;flex-wrap:wrap;gap:8px;padding:16px 22px 0}
.chosen:empty{display:none}
.pick{flex:none;display:inline-flex;align-items:center;gap:9px;min-height:38px;padding:0 8px 0 12px;background:var(--blue-soft);border:1px solid color-mix(in srgb,var(--blue) 35%,transparent);color:var(--ink);font-size:13px;white-space:nowrap;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}
.pick .l{flex:none;white-space:nowrap}
.pick i.h{flex:none;font-size:14px;color:var(--blue);cursor:grab}
.pick button{flex:none;display:grid;place-items:center;width:24px;height:24px;background:none;border:0;color:var(--muted);font-size:15px;cursor:pointer}
.pick button:hover{color:var(--coral)}
.setup .empty{padding:16px 22px 0;color:var(--muted);font-size:12.5px}
.pact{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:16px 22px}
.pact .saved{display:flex;align-items:center;gap:7px;color:var(--success);font-size:12px}
.pact .saved[hidden]{display:none}
.pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--soft-line)}
.pcol{min-width:0;padding:14px 16px;border-right:1px solid var(--soft-line)}
.pcol:last-child{border-right:0}
.pch{display:flex;align-items:center;gap:9px;padding:0 2px 10px;color:var(--blue);border-bottom:1px solid var(--blue)}
.pch i{font-size:18px}
.pch h3{margin:0;color:var(--ink);font-family:var(--font-ui);font-size:14.5px;font-weight:600}
.pch .c{margin-left:auto;color:var(--muted);font-size:11.5px}
body.p-account .prow{display:grid;grid-template-columns:16px 20px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:36px;padding:4px 2px;border-bottom:1px solid var(--soft-line);cursor:pointer}
.prow:last-child{border-bottom:0}
.prow:hover{background:var(--surface-sunken)}
.prow.on{background:var(--blue-soft)}
.prow input{width:15px;height:15px;margin:0;accent-color:var(--blue);cursor:pointer}
.prow i.g{font-size:16px;color:var(--muted)}
.prow.on i.g{color:var(--blue)}
.prow .nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.prow .fmt{color:var(--muted);font-size:10px;letter-spacing:.06em;white-space:nowrap}
.prow.off{opacity:.42;cursor:not-allowed}
.setup .fine{padding:0 22px 18px;color:var(--muted);font-size:11.5px;line-height:1.55}
@media(max-width:1000px){.pgrid{grid-template-columns:1fr 1fr}.pcol:nth-child(2){border-right:0}}
@media(max-width:720px){.acc{grid-template-columns:1fr}.pgrid{grid-template-columns:1fr}.pcol{border-right:0;border-bottom:1px solid var(--soft-line)}}

/* ── apps.html → body.p-apps ── */
.duo2{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:26px}
/* Карточка канала — только на apps.html: тот же `.ch` в каталоге (.tcol, .ccol) значит
   шапку колонки, и без класса страницы карточка протекала бы внутрь неё. */
body.p-apps .ch{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);padding:26px 28px;clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%)}
.ch>.ic{display:grid;place-items:center;width:46px;height:46px;background:var(--blue-soft);color:var(--blue);font-size:23px;clip-path:polygon(0 0,calc(100% - 11px) 0,100% 11px,100% 100%,0 100%)}
.ch h2{margin-top:16px;font-family:var(--font-display);font-size:20px;font-weight:600;letter-spacing:var(--track-title);line-height:1.18}
.ch .one{margin-top:8px;color:var(--blue);font-size:14px}
.ch p{margin-top:12px;color:var(--muted);font-size:14px;line-height:1.6;text-wrap:pretty}
.ch ul{display:grid;gap:9px;margin-top:16px;list-style:none}
.ch li{display:grid;grid-template-columns:17px 1fr;gap:10px;font-size:13.5px;line-height:1.5}
.ch li i{color:var(--success);font-size:15px;margin-top:2px}
.ch .acts{display:flex;flex-wrap:wrap;gap:9px;margin-top:auto;padding-top:20px}
.chat{margin-top:18px;padding:15px 16px;background:var(--surface-sunken);border:1px solid var(--line)}
.msg{display:flex;gap:9px;align-items:flex-start;font-size:13px;line-height:1.45}
.msg+.msg{margin-top:11px}
.msg .av{display:grid;place-items:center;width:26px;height:26px;flex:none;background:var(--surface);border:1px solid var(--line);color:var(--muted);font-size:13px}
.msg.me .av{background:var(--blue);border-color:var(--blue);color:#fff}
.msg b{display:block;font-family:var(--font-display);font-size:11.5px;font-weight:600;letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--muted)}
.msg span{display:block;margin-top:3px}
.msg .file{display:inline-flex;align-items:center;gap:7px;margin-top:6px;padding:6px 10px;background:var(--surface);border:1px solid var(--line);font-size:12.5px;white-space:nowrap}
.msg .file i{color:var(--coral);font-size:15px}
.ctx{margin-top:18px;padding:0;background:var(--surface-sunken);border:1px solid var(--line)}
.ctx .t{padding:9px 14px;border-bottom:1px solid var(--line);color:var(--muted);font-size:11.5px}
.ctx a{display:grid;grid-template-columns:18px 1fr auto;align-items:center;gap:11px;padding:9px 14px;color:var(--ink);font-size:13px;border-bottom:1px solid color-mix(in srgb,var(--line) 55%,transparent)}
.ctx a:last-child{border-bottom:0}
.ctx a:hover{background:var(--blue-soft);color:var(--ink)}
.ctx a i:first-child{color:var(--blue);font-size:15px}
.ctx a em{font-style:normal;color:var(--muted);font-size:11.5px}
@media(max-width:900px){.duo2{grid-template-columns:1fr}}

/* ── editor.html → body.p-workspace ── */
/* В макете это правило жило в инлайновом <style> страницы редактора и действовало
   только там. При переносе в общий файл оно стало глобальным и красило фон всех
   страниц в #ececc8 вместо тёплой бумаги #f7f7f2. Возвращаем область действия. */
body.p-workspace{background:var(--surface-sunken)}
.ebar{display:flex;align-items:center;gap:18px;min-height:68px;padding:0 24px;background:var(--surface);border-bottom:1px solid var(--line)}
.ebar .t{display:flex;align-items:center;gap:11px}
.ebar .t i{font-size:23px;color:var(--blue)}
.ebar .t b{font-family:var(--font-display);font-size:14.5px;font-weight:600;letter-spacing:var(--track-tight)}
.ebar .sp{margin-left:auto;display:flex;align-items:center;gap:11px}
.ws{display:grid;grid-template-columns:220px minmax(430px,1fr) 340px;min-height:calc(100vh - 68px)}
.col{padding:17px;background:var(--surface);overflow:auto}
.col+.col{border-left:1px solid var(--line)}
.col.stage{background:var(--surface-sunken);padding:22px}
.ct{font-size:10.5px;letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:12px}
.fi{display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:center;padding:11px 12px;background:var(--surface-strong);border:1px solid var(--line);border-radius:var(--r-xs);margin-bottom:8px;cursor:pointer;transition:border-color .16s ease,background .16s ease}
.fi:hover{border-color:var(--blue)}
.fi[data-on]{border-color:var(--blue);background:var(--blue-soft)}
.fi i{font-size:21px;color:var(--blue)}
.fi b{font-family:var(--font-display);font-size:14.5px;font-weight:600;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fi span{display:block;color:var(--muted);font-size:11px}
.canvas{display:grid;place-items:center;align-content:center;gap:16px;min-height:440px}
.paper{width:238px;height:318px;background:#fff;box-shadow:0 16px 50px rgba(0,0,0,.17);display:grid;align-content:start;gap:8px;padding:24px 21px}
.paper i{display:block;height:6px;background:var(--line-200,#e9e9e3)}
.paper i.s{width:60%}
.paper i.m{width:86%}
.paper i.t{width:46%;height:11px;background:var(--ink);margin-bottom:6px}
.pager{display:flex;align-items:center;gap:13px;font-size:13px;color:var(--muted)}
.pager button{display:grid;place-items:center;width:30px;height:30px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xs);cursor:pointer;color:var(--ink)}
.pager button:hover{border-color:var(--blue);color:var(--blue)}
.radio{display:flex;gap:10px;align-items:flex-start;padding:11px 13px;background:var(--surface-strong);border:1px solid var(--line);border-radius:var(--r-xs);cursor:pointer;font-size:13px;transition:border-color .16s ease,background .16s ease}
.radio:hover{border-color:var(--blue)}
.radio[data-on]{border-color:var(--blue);background:var(--blue-soft)}
.radio i.dot{font-size:18px;color:var(--line);flex:0 0 auto;margin-top:1px}
.radio[data-on] i.dot{color:var(--blue)}
.est{display:grid;gap:6px;padding:13px 14px;background:var(--blue-soft);border-radius:var(--r-xs);font-size:12.5px}
.est b{font-family:var(--font-display);font-size:14.5px;font-weight:600;letter-spacing:var(--track-tight)}
.q{display:grid;gap:8px;font-size:12.5px}
.q div{display:flex;gap:9px;align-items:center;padding:9px 11px;background:var(--surface-strong);border:1px solid var(--line);border-radius:var(--r-xs)}
.q i{font-size:16px}
.q .st{margin-left:auto;font-size:11px}
.cmp{display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:center;width:100%;max-width:440px}
.cmp>div{padding:17px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);text-align:center}
.cmp b{font-family:var(--font-display);font-size:20px;font-weight:600;display:block;letter-spacing:var(--track-title)}
.cmp span{color:var(--muted);font-size:11.5px}
.sec-note{display:flex;gap:9px;align-items:flex-start;margin-top:13px;padding:11px 13px;background:color-mix(in srgb,var(--success) 8%,var(--surface));border-radius:var(--r-xs);font-size:11.5px;line-height:1.45;color:var(--muted)}
.sec-note i{font-size:17px;color:var(--success);flex:0 0 auto}
@media(max-width:1120px){.ws{grid-template-columns:1fr}.col+.col{border-left:0;border-top:1px solid var(--line)}}

/* ── edu.html → body.p-edu ── */
.wi{padding:19px 20px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%)}
.wi i{font-size:21px;color:var(--blue)}
.wi b{display:block;margin-top:12px;font-family:var(--font-display);font-size:14.5px;font-weight:600;letter-spacing:var(--track-title)}
.wi p{margin-top:6px;color:var(--muted);font-size:12.5px;line-height:1.45}
.gives{display:grid;gap:10px;margin-top:14px}
.gv{display:grid;grid-template-columns:20px 1fr;gap:12px;padding:14px 17px;background:var(--surface);border:1px solid var(--line)}
.gv i{color:var(--success);font-size:17px;margin-top:1px}
.gv b{font-family:var(--font-display);font-size:14.5px;font-weight:600;letter-spacing:var(--track-title)}
.gv p{margin-top:5px;color:var(--muted);font-size:13px;line-height:1.5}
.eduform{position:sticky;top:calc(var(--header-height) + 18px);display:grid;gap:13px;padding:24px 26px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%)}
.eduform h2{font-family:var(--font-display);font-size:21px;font-weight:600;letter-spacing:var(--track-title)}
.eduform .fnote{color:var(--muted);font-size:12.5px;line-height:1.5}
.eduform .fld{display:grid;gap:6px}
.eduform label{font-size:13px;font-weight:500}
.eduform input,.eduform select,.eduform textarea{width:100%;padding:11px 13px;background:var(--surface-strong);border:1px solid var(--line);font-family:var(--font-ui);font-size:14px;color:var(--ink)}
.eduform textarea{resize:vertical;min-height:74px}
.eduform input:focus,.eduform select:focus,.eduform textarea:focus{border-color:var(--blue);outline:0;box-shadow:0 0 0 3px var(--blue-soft)}
.eduform .fstatus{padding:11px 13px;font-size:13px;line-height:1.5;background:var(--blue-soft);border:1px solid var(--blue)}
.eduform .fstatus[data-tone="error"]{background:color-mix(in srgb,var(--coral) 10%,transparent);border-color:var(--coral);color:var(--danger-ink)}

.who{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:24px}
.wi{padding:19px 20px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%)}
.wi i{font-size:21px;color:var(--blue)}
.wi b{display:block;margin-top:12px;font-family:var(--font-display);font-size:14.5px;font-weight:600;letter-spacing:var(--track-title)}
.wi p{margin-top:6px;color:var(--muted);font-size:12.5px;line-height:1.45}
.two2{display:grid;grid-template-columns:1.15fr .85fr;gap:22px;margin-top:30px;align-items:start}
.gives{display:grid;gap:10px}
.gv{display:grid;grid-template-columns:20px 1fr;gap:12px;padding:14px 17px;background:var(--surface);border:1px solid var(--line)}
.gv i{color:var(--success);font-size:17px;margin-top:1px}
.gv b{font-family:var(--font-display);font-size:14.5px;font-weight:600;letter-spacing:var(--track-title)}
.gv p{margin-top:5px;color:var(--muted);font-size:13px;line-height:1.5}
.form{padding:24px 26px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%)}
.form h2{font-family:var(--font-display);font-size:20px;font-weight:600;letter-spacing:var(--track-title)}
.form p.h{margin-top:8px;color:var(--muted);font-size:13px;line-height:1.5}
.fld{margin-top:15px}
.fld label{display:block;font-size:12.5px;color:var(--muted)}
.fld input,.fld select,.fld textarea{width:100%;margin-top:6px;min-height:var(--control-height,44px);padding:0 14px;background:var(--page);border:1px solid var(--line);color:var(--ink);font-family:var(--font-ui);font-size:14px}
.fld textarea{min-height:78px;padding:12px 14px;line-height:1.5;resize:vertical}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-soft)}
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}
/* Карточка шага живёт только на странице «Школам и НКО». Без ограничения по
   странице она красила подпись состояния в строке `/status/` (`.sr .st`)
   в серую плашку с рамкой и ломала её на три строки. */
body.p-edu .st{display:grid;grid-template-columns:26px 1fr;gap:11px;padding:14px 16px;background:var(--surface-sunken);border:1px solid var(--line)}
body.p-edu .st .n{display:grid;place-items:center;width:26px;height:26px;background:var(--ink);color:#fff;font-family:var(--font-display);font-size:12px;font-weight:700}
body.p-edu .st b{font-size:13.5px;font-weight:600}
body.p-edu .st p{margin-top:4px;color:var(--muted);font-size:12.5px;line-height:1.45}
@media(max-width:1120px){.who{grid-template-columns:1fr 1fr}.two2{grid-template-columns:1fr}.steps3{grid-template-columns:1fr}}

/* ── formats.html → body.p-formats ── */
.fhead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.86fr);gap:44px;align-items:center;padding:32px 0 34px;border-bottom:1px solid var(--line)}
.fsearch{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;align-items:center;padding:0 20px;height:64px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}
.fsearch i{font-size:20px;color:var(--muted)}
.fsearch input{width:100%;border:0;background:none;font-family:inherit;font-size:15.5px;color:var(--ink);outline:0}
.fsearch input::placeholder{color:var(--muted)}
.fsearch:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-soft)}
.ftabs{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.ftabs button{display:inline-flex;align-items:center;gap:9px;padding:0 20px;height:50px;background:var(--surface);border:1px solid var(--line);font-family:inherit;font-size:14.5px;color:var(--ink);cursor:pointer;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%);transition:color .16s ease,border-color .16s ease}
.ftabs button:hover{border-color:var(--blue);color:var(--blue)}
.ftabs button[aria-pressed=true]{border-color:var(--blue);color:var(--blue);font-weight:600;box-shadow:inset 0 -2px 0 var(--blue)}
.ftabs button i{font-size:17px}
.fcards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:18px}
body.p-formats .fcard{display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;align-items:center;padding:13px 15px;background:var(--surface);border:1px solid var(--line);color:var(--ink);clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%);transition:border-color .16s ease,background .16s ease}
.fcard:hover{border-color:var(--blue);background:color-mix(in srgb,var(--blue-soft) 45%,var(--surface));color:var(--ink)}
.fcard .tile{display:grid;place-items:center;width:30px;height:30px;color:var(--muted);font-size:20px;background:none}
.fcard:hover .tile{color:var(--blue)}
.fcard .top{display:contents}
.fcard .code,.fcard .go{display:none}
.fcard b{font-family:var(--font-display);font-size:14.5px;font-weight:600;letter-spacing:var(--track-title);line-height:1.1}
.fcard p{margin-top:4px;color:var(--muted);font-size:11.5px;line-height:1.35;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.samplab{display:flex;align-items:center;gap:14px;margin-top:44px}
.samplab .tile{display:grid;place-items:center;width:52px;height:52px;background:var(--blue-soft);color:var(--blue);font-size:26px;clip-path:polygon(0 0,calc(100% - 11px) 0,100% 11px,100% 100%,0 100%)}
.samplab b{font-family:var(--font-display);font-size:31px;font-weight:700;letter-spacing:var(--track-title);line-height:1}
.pairs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:18px}
.pair{display:flex;flex-direction:column;padding:20px 22px 18px;background:var(--surface);border:1px solid var(--line);color:var(--ink);clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%);transition:border-color .16s ease}
.pair:hover{border-color:var(--blue);color:var(--ink)}
.pair .vs{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12.5px}
.pair .vs span{padding:3px 8px;background:var(--surface-sunken);border:1px solid var(--line);font-family:var(--font-ui);font-size:10.5px;letter-spacing:.07em;color:var(--ink)}
.pair p{margin-top:14px;font-size:14px;line-height:1.5;text-wrap:pretty}
.pair .go{display:flex;align-items:center;gap:7px;margin-top:auto;padding-top:16px;color:var(--blue);font-size:13px}
.pair .go i{font-size:14px;transition:transform .16s ease}
.pair:hover .go i{transform:translateX(3px)}
.fcta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:34px;align-items:center;margin-top:40px;padding:38px 40px;background:var(--surface-sunken);clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,0 100%)}
.fcta h2{font-family:var(--font-display);font-size:26px;font-weight:600;letter-spacing:var(--track-title);line-height:1.14;max-width:20ch;text-wrap:balance}
.fcta p{margin-top:12px;max-width:52ch;color:var(--muted);font-size:14.5px;line-height:1.6}
@media(max-width:1120px){.fcards{grid-template-columns:repeat(4,minmax(0,1fr))}.pairs{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1040px){.fhead{grid-template-columns:1fr;gap:26px}}
@media(max-width:860px){.fcards,.pairs{grid-template-columns:repeat(2,minmax(0,1fr))}.fcta{grid-template-columns:1fr;gap:22px}}
@media(max-width:560px){.fcards{grid-template-columns:1fr 1fr}.pairs{grid-template-columns:1fr}}
.f{display:grid;gap:8px;padding:17px 18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);color:var(--ink);transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease}
.f:hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:var(--shadow-soft)}
.f .hd{display:flex;align-items:center;gap:9px}
.f .hd i{font-size:22px;color:var(--blue)}
.f .hd b{font-family:var(--font-display);font-size:14.5px;font-weight:600;letter-spacing:var(--track-tight)}
.f p{color:var(--muted);font-size:12px;line-height:1.5}
body.p-formats h2.h{font-family:var(--font-display);font-size:26px;font-weight:600;margin:40px 0 14px;letter-spacing:var(--track-title)}
.detail{margin-top:46px;padding:30px 32px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg)}

/* ── guides.html → body.p-guides ── */
/* В пакете переноса класс `g` носят два разных элемента: карточка-сетка и декоративный
   глиф строки каталога (`.trow>i.g`). На статических страницах это не сталкивалось —
   там подключён только site.css. В приложении подключены оба слоя, и карточное правило
   накрывало иконку: вместо глифа рисовался пустой светлый прямоугольник со срезом угла.
   Карточкой не может быть ни <i>, ни <svg>, поэтому исключаем их. */
.g:not(i):not(svg){display:grid;gap:9px;padding:18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);color:var(--ink);align-content:start;transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease}
.g:not(i):not(svg):hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:var(--shadow-soft)}
.g i.ic{font-size:23px;color:var(--blue)}
.g b{font-family:var(--font-display);font-size:17px;font-weight:600;line-height:1.35}
.g p{color:var(--muted);font-size:12px;line-height:1.5}
.g .meta{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--muted)}
.g.hot{border-color:var(--blue);background:var(--blue-soft)}
body.p-guides h2.h{font-family:var(--font-display);font-size:26px;font-weight:600;margin:40px 0 14px;letter-spacing:var(--track-title)}
h2.h span{font-family:var(--font-ui);font-size:13.5px;font-weight:400;color:var(--muted);letter-spacing:0}
.walk{margin-top:22px;border:1px solid var(--line);background:var(--surface-strong);clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%)}
.wrail{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-bottom:1px solid var(--line)}
.wrail button{display:grid;grid-template-columns:auto 1fr;align-items:start;gap:9px;min-height:70px;padding:13px 14px;border:0;border-right:1px solid var(--line);background:var(--surface);color:var(--ink);font-family:var(--font-ui);text-align:left;cursor:pointer;transition:background .16s ease,color .16s ease}
.wrail button:last-child{border-right:0}
.wrail button:hover{color:var(--blue)}
.wrail button[data-on]{background:var(--blue-soft);color:var(--blue);box-shadow:inset 0 -3px 0 var(--blue)}
.wrail .sn{display:grid;place-items:center;width:22px;height:22px;flex:0 0 auto;background:var(--line);color:var(--ink);font-family:var(--font-display);font-size:11px;font-weight:600}
.wrail button[data-on] .sn{background:var(--blue);color:#fff}
.wrail .st{font-size:12px;font-weight:500;line-height:1.3}
.wstage{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:26px;padding:26px 28px}
.wstage[hidden]{display:none}
.wmock{display:grid;place-items:center;min-height:236px;padding:20px;background:var(--surface-sunken);border:1px solid var(--line)}
.wbody{display:grid;gap:11px;align-content:start}
.wbody h3{font-family:var(--font-display);font-size:20px;font-weight:600;display:flex;align-items:center;gap:10px;letter-spacing:var(--track-title);line-height:1.2}
.wbody h3 i{font-size:24px;color:var(--blue);flex:0 0 auto}
.wbody p{color:var(--muted);font-size:14px;line-height:1.62;max-width:52ch}
.wbody .btn{justify-self:start;margin-top:3px}
.wself{display:inline-flex;align-items:center;gap:8px;justify-self:start;margin-top:3px;padding:8px 12px;background:var(--coral-soft);color:var(--danger-ink);font-size:12px}
.wself i{font-size:16px;color:var(--coral)}
.wnav{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 20px;border-top:1px solid var(--line);background:var(--surface)}
.wdots{display:flex;gap:6px}
.wdots b{width:22px;height:4px;background:var(--line);cursor:pointer}
.wdots b.on{background:var(--blue)}
.phone{position:relative;width:118px;height:200px;background:var(--ink);padding:9px 8px;display:grid}
.phone .notch{position:absolute;top:5px;left:50%;transform:translateX(-50%);width:34px;height:4px;background:#3a3a3a}
.phone .sheet{background:#fff;display:grid;align-content:start;gap:6px;padding:14px 11px}
.phone .shutter{position:absolute;bottom:-14px;left:50%;transform:translateX(-50%);display:grid;place-items:center;width:34px;height:34px;background:var(--blue);color:#fff}
.phone .shutter i{font-size:18px}
.sheet i{display:block;height:5px;background:#e4e4de}
.sheet i.m{width:84%}
.sheet i.s{width:56%}
.sheet i:first-child{height:9px;width:48%;background:var(--ink)}
.sheet i.hl{background:color-mix(in srgb,var(--blue) 34%,transparent);height:8px}
.pages{position:relative;display:flex;align-items:center;gap:-10px}
.pages .pg{width:52px;height:70px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-soft)}
.pages .pg+.pg{margin-left:-16px}
.pages .merged{display:inline-flex;align-items:center;gap:7px;margin-left:16px;padding:9px 12px;background:var(--blue);color:#fff;font-size:12px}
.pages .merged i{font-size:17px}
.weigh{display:grid;gap:10px;justify-items:center;width:100%;max-width:220px;color:var(--muted);font-size:12px}
.weigh .wr{display:grid;gap:5px;width:100%}
.weigh .wb{display:block;height:11px;background:color-mix(in srgb,var(--line) 60%,transparent)}
.weigh .wb i{display:block;height:100%;background:var(--muted)}
.weigh .wb i.ok{background:var(--blue)}
.weigh .wr.ok{color:var(--ink);font-weight:600}
.weigh>i{font-size:19px;color:var(--blue)}
.ocr{display:grid;gap:11px;justify-items:center}
.ocr .sheet{width:128px;background:#fff;border:1px solid var(--line);display:grid;align-content:start;gap:7px;padding:15px 12px}
.ocr .found{display:inline-flex;align-items:center;gap:7px;padding:8px 11px;background:var(--blue-soft);color:var(--blue);font-size:11.5px}
.ocr .found i{font-size:15px}
@media(max-width:900px){.wrail{grid-template-columns:repeat(5,1fr)}.wrail .st{display:none}.wrail button{justify-items:center;grid-template-columns:1fr}.wstage{grid-template-columns:1fr}}
.step{display:grid;grid-template-columns:34px 1fr;gap:15px;padding:16px 0;border-bottom:1px solid var(--soft-line)}
.step:last-child{border-bottom:0}
.step .n{display:grid;place-items:center;width:34px;height:34px;background:var(--blue);color:#fff;font-family:var(--font-display);font-size:13.5px;font-weight:600;clip-path:var(--clip-chip)}
.step b{font-family:var(--font-display);font-size:15px;font-weight:600;display:block}
.step p{margin-top:5px;color:var(--muted);font-size:13.5px;line-height:1.6}

/* ── index.html → body.p-home ── */
.hero{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:48px;align-items:center;padding:40px 0 0}
.hero h1{font-family:var(--font-display);font-size:clamp(33px,3.5vw,45px);font-weight:600;letter-spacing:var(--track-hero);line-height:1.06;text-wrap:balance}
.hero h1 em{font-style:normal;color:var(--blue)}
.tool-intent-brief{max-width:78ch;margin:14px 0 22px;padding:11px 14px;color:var(--muted);background:var(--blue-soft);border-left:3px solid var(--coral);font-size:13px;line-height:1.5}.tool-intent-brief strong{color:var(--ink)}.tool-intent-brief a{color:var(--blue);font-weight:600;text-decoration:underline;text-underline-offset:3px}
body.p-home .fcard{background:var(--surface-strong);border:1px solid var(--blue);border-radius:var(--r-lg);box-shadow:var(--shadow-soft);overflow:hidden}
.fh{display:flex;align-items:center;gap:13px;padding:17px 22px;border-bottom:1px solid var(--soft-line)}
.fb{padding:18px 22px 22px}
.sizer{display:flex;align-items:center;gap:12px;margin-top:12px;padding:13px 16px;background:var(--blue-soft);border-radius:var(--r-sm)}
.sizer input{width:58px;padding:8px 10px;border:1px solid var(--blue);background:var(--surface-strong);border-radius:6px;font-size:13.5px;text-align:right}
.offer{display:flex;align-items:center;gap:14px;margin-top:12px;padding:15px 17px;background:var(--blue-soft);border-radius:var(--r-sm);box-shadow:inset 3px 0 0 var(--blue)}
.pbar{background:var(--blue-soft);border-bottom:1px solid var(--line)}
.pbar .in{display:flex;align-items:center;gap:12px;width:min(1240px,100% - 64px);margin:0 auto;padding:10px 0;font-size:13.5px}
.pbar i{font-size:18px;color:var(--blue)}
.pbar .ln{margin-left:auto;display:flex;gap:15px;font-size:12.5px}
.catcards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}
.rstrip{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}
@media(max-width:1120px){.hero{grid-template-columns:1fr;gap:32px}.catcards,.rstrip{grid-template-columns:1fr}}

/* ── pricing.html → body.p-pricing ── */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(232px,1fr));gap:16px;margin-top:28px;align-items:start}
.plan{position:relative;padding:26px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%);display:grid;gap:14px;align-content:start}
body.p-pricing .plan.hot{border-color:var(--blue);background:var(--surface-strong);box-shadow:var(--shadow-soft)}
.plan h3{font-family:var(--font-display);font-size:17px;font-weight:600;letter-spacing:var(--track-tight)}
.price{display:flex;align-items:baseline;gap:10px;font-family:var(--font-display);font-size:33px;font-weight:600;letter-spacing:var(--track-title);line-height:1}
.price strong{font:inherit;letter-spacing:inherit}
.price--promo strong{color:var(--coral)}
.price del{font-family:var(--font-ui);font-size:15px;font-weight:500;letter-spacing:0;color:var(--muted);text-decoration-thickness:1.5px}
.price small{font-family:var(--font-ui);font-size:13px;font-weight:400;color:var(--muted);letter-spacing:0}
.plan ul{list-style:none;display:grid;gap:9px;font-size:13.5px;color:var(--muted);line-height:1.45}
.plan ul li{display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start}
.plan ul i{font-size:17px;color:var(--blue);margin-top:1px}
.plan ul b{color:var(--ink);font-weight:600}
.badge{position:absolute;top:14px;left:26px;padding:4px 9px;background:var(--blue);color:#fff;font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
body.p-pricing .plan.has-badge{padding-top:44px}
.plan-alt-payment{display:inline-flex;justify-content:center;align-items:center;min-height:34px;color:var(--blue);font-size:12.5px;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.plan-alt-payment[hidden]{display:none}
.payment-method-note{max-width:760px;margin:18px auto 0;color:var(--muted);font-size:13.5px;line-height:1.55;text-align:center}
@media(max-width:560px){.plans{grid-template-columns:1fr}}

/* ── problems.html → body.p-problems ── */
.filters{display:flex;flex-wrap:wrap;margin-top:24px;border:1px solid var(--line);background:var(--surface);clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%);width:fit-content;max-width:100%}
.filters button{display:inline-flex;align-items:center;gap:8px;padding:0 20px;height:46px;background:none;border:0;border-right:1px solid var(--line);font-family:inherit;font-size:14px;color:var(--muted);cursor:pointer;transition:color .16s ease,background .16s ease}
.filters button:last-child{border-right:0}
.filters button:hover{color:var(--ink);background:var(--surface-sunken)}
.filters button[aria-pressed=true]{color:var(--blue);font-weight:600;background:var(--blue-soft);box-shadow:inset 0 -2px 0 var(--blue)}
.filters button i{font-size:17px}
.probs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:26px;align-items:stretch}
body.p-problems .prob{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);padding:24px 24px 22px;clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%);transition:border-color .16s ease,background .16s ease}
.prob:hover{border-color:var(--blue)}
.prob .ic{display:grid;place-items:center;width:46px;height:46px;background:var(--blue-soft);color:var(--blue);font-size:23px;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}
body.p-problems .prob>b{font-family:var(--font-display);font-size:17px;font-weight:600;margin-top:17px;letter-spacing:var(--track-title);line-height:1.24;text-wrap:balance}
.prob .sym{margin-top:9px;color:var(--muted);font-size:13.5px;line-height:1.5;text-wrap:pretty}
body.p-problems .prob dl{display:grid;grid-template-columns:96px minmax(0,1fr);gap:11px 16px;margin-top:18px;padding-top:17px;border-top:1px solid var(--soft-line);font-size:13.5px;line-height:1.5}
.prob dt{color:var(--muted)}
.prob dd{margin:0;text-wrap:pretty}
body.p-problems .prob .act{display:flex;flex-direction:column;gap:9px;margin-top:auto;padding-top:20px}
.prob .act .btn{justify-content:space-between;width:100%}
.prob .act .btn i{font-size:16px}
.prob .tag{align-self:flex-start}
@media(max-width:1120px){.probs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.probs{grid-template-columns:1fr}.filters{width:auto}.filters button{flex:1 1 auto;justify-content:center;padding:0 14px}}

/* ── research.html → body.p-research ── */
.r{display:grid;gap:9px;padding:20px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);color:var(--ink);align-content:start;transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease}
.r:hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:var(--shadow-soft)}
.r b{font-family:var(--font-display);font-size:17px;font-weight:600;line-height:1.32}
.r p{color:var(--muted);font-size:12.5px;line-height:1.55}
.r .meta{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--muted)}
body.p-research h2.h{font-family:var(--font-display);font-size:26px;font-weight:600;margin:40px 0 14px;letter-spacing:var(--track-title)}
.method{display:grid;grid-template-columns:140px 1fr;gap:9px 17px;margin-top:18px;font-size:13.5px;line-height:1.55}
.method dt{color:var(--muted)}
.brow{display:grid;grid-template-columns:150px minmax(0,1fr) 68px;align-items:center;gap:13px;padding:7px 0;font-size:13.5px}
.brow .bb{height:24px;background:var(--blue);border-radius:0 4px 4px 0;display:flex;align-items:center;padding-left:9px;color:#fff;font-size:12px}
.brow .bb.alt{background:var(--muted)}
.brow .vv{text-align:right;color:var(--muted);font-size:12px}

/* ── scan.html → body.p-scan ── */
.shead{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:44px;align-items:center;padding:34px 0 0}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));margin-top:26px;border:1px solid var(--line);background:var(--surface)}
.facts>div{display:grid;grid-template-columns:26px minmax(0,1fr);gap:12px;align-items:center;padding:16px 18px;border-right:1px solid var(--line)}
.facts>div:last-child{border-right:0}
.facts i{font-size:22px;color:var(--blue);line-height:1}
.facts span{min-width:0}
.facts em{display:block;font-style:normal;color:var(--muted);font-size:10.5px;font-weight:600;letter-spacing:var(--track-eyebrow);text-transform:uppercase}
.facts b{font-family:var(--font-display);font-size:14.5px;font-weight:600;display:block;margin-top:4px}
.keep{display:flex;align-items:center;gap:9px;margin-top:15px;color:var(--muted);font-size:13.5px}
.keep i{color:#1F7A4D;font-size:17px}
.sdz{padding:13px;border:1px dashed color-mix(in srgb,var(--coral) 45%,var(--line));clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,0 100%)}
.sdz .in{display:flex;flex-direction:column;align-items:center;gap:16px;padding:44px 30px;text-align:center;background:color-mix(in srgb,var(--surface) 92%,var(--blue-soft));clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%)}
.sdz .tile{display:grid;place-items:center;width:70px;height:70px;background:var(--ink);color:#fff;font-size:33px;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%)}
.sdz strong{font-family:var(--font-display);font-size:20px;font-weight:600;letter-spacing:var(--track-title);line-height:1.2;text-wrap:balance}
.sdz small{max-width:26ch;color:var(--muted);font-size:12.5px;line-height:1.5}
/* Три карточки шага из scan.html. Селектор в пакете был просто `.steps`, но тем же
   именем назван нумерованный список внутри карточки проблемы — сетка из трёх
   колонок рвала его пункты по колонкам без жёлоба. Карточки — только по div. */
div.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);background:var(--surface);margin-top:18px}
div.steps>div{padding:24px 24px 26px;border-right:1px solid var(--line)}
div.steps>div:last-child{border-right:0}
div.steps .n{display:grid;place-items:center;width:38px;height:38px;background:var(--ink);color:#fff;font-family:var(--font-display);font-size:16px;font-weight:700;clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%)}
div.steps b{font-family:var(--font-display);font-size:17px;font-weight:600;display:block;margin-top:16px;letter-spacing:var(--track-title);line-height:1.24}
div.steps p{margin-top:9px;color:var(--muted);font-size:13.5px;line-height:1.55;text-wrap:pretty}
/* Нумерованный список «Что сделать» в карточке проблемы. */
ol.steps{display:grid;gap:7px;margin:0;padding-left:20px}
ol.steps li{line-height:1.5;text-wrap:pretty}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}
.checks>div{display:grid;grid-template-columns:24px minmax(0,1fr);gap:14px;padding:20px 22px;background:var(--surface);border:1px solid var(--line);border-left:4px solid #1F7A4D}
.checks>div.f{border-left-color:var(--blue)}
.checks i{font-size:21px;color:#1F7A4D;line-height:1}
.checks>div.f i{color:var(--blue)}
.checks b{font-family:var(--font-display);font-size:14.5px;font-weight:600;display:block}
.checks p{margin-top:7px;color:var(--muted);font-size:13.5px;line-height:1.55;text-wrap:pretty}
.after{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:18px}
.after a{display:grid;grid-template-columns:40px minmax(0,1fr);gap:14px;align-items:center;padding:16px 18px;background:var(--surface);border:1px solid var(--line);color:var(--ink);transition:border-color .16s ease}
.after a:hover{border-color:var(--blue);color:var(--ink)}
.after .t{display:grid;place-items:center;width:40px;height:40px;background:var(--blue-soft);color:var(--blue);font-size:20px;clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%)}
.after b{font-family:var(--font-display);font-size:14.5px;font-weight:600;display:block}
.after span{display:block;margin-top:3px;color:var(--muted);font-size:12.5px;line-height:1.4}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:34px}
.duo>section{padding:26px 28px 28px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%)}
.duo h3{font-family:var(--font-display);font-size:20px;font-weight:600;margin-top:12px;letter-spacing:var(--track-title);line-height:1.16;text-wrap:balance}
.duo p{margin-top:13px;color:var(--muted);font-size:14px;line-height:1.6;text-wrap:pretty}
.duo .row{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.req{display:grid;margin-top:18px}
.req>div{display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:13px 0;border-bottom:1px solid var(--soft-line);font-size:14px}
.req>div:last-of-type{border-bottom:0}
.req span:last-child{color:var(--muted);font-size:13.5px;text-align:right}
.hint-note{display:grid;grid-template-columns:22px minmax(0,1fr);gap:13px;margin-top:26px;padding:18px 20px;background:var(--blue-soft);font-size:14px;line-height:1.6}
.hint-note>i{font-size:19px;color:var(--blue);line-height:1.3}
@media(max-width:1040px){.shead{grid-template-columns:1fr;gap:30px}.steps,.after{grid-template-columns:1fr 1fr}.steps>div{border-right:0;border-bottom:1px solid var(--line)}}
@media(max-width:760px){.checks,.duo,.after,.steps{grid-template-columns:1fr}}

/* ── status.html → body.p-status ── */
.sum{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:16px;margin-top:24px;padding:22px 26px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%)}
.sum .dot{width:14px;height:14px;background:var(--success);border-radius:50%;box-shadow:0 0 0 5px color-mix(in srgb,var(--success) 18%,transparent)}
.sum b{font-family:var(--font-display);font-size:20px;font-weight:600;letter-spacing:var(--track-title)}
.sum p{margin-top:5px;color:var(--muted);font-size:13px}
.grp{margin-top:26px}
.grp h2{font-family:var(--font-display);font-size:20px;font-weight:600;letter-spacing:var(--track-title)}
.srv{margin-top:13px;border:1px solid var(--line);background:var(--surface)}
.sr{display:grid;grid-template-columns:22px minmax(0,1fr) auto auto;align-items:center;gap:14px;padding:13px 18px;border-bottom:1px solid color-mix(in srgb,var(--line) 55%,transparent)}
.sr:last-child{border-bottom:0}
.sr .d{width:9px;height:9px;border-radius:50%;background:var(--success);justify-self:center}
.sr.warn .d{background:var(--coral)}
.sr .nm{font-size:14px}
.sr .bar{display:flex;gap:2px}
.sr .bar i{width:4px;height:20px;background:color-mix(in srgb,var(--success) 40%,transparent)}
.sr .bar i.w{background:var(--coral)}
.sr .st{color:var(--muted);font-size:12.5px;min-width:104px;text-align:right}
.sr.warn .st{color:var(--coral)}
.leg{display:flex;flex-wrap:wrap;gap:18px;margin-top:12px;color:var(--muted);font-size:12px}
.leg span{display:flex;align-items:center;gap:7px}
.leg i{width:9px;height:9px;border-radius:50%;background:var(--success)}
.leg i.w{background:var(--coral)}
.leg i.n{background:var(--line)}
.inc{margin-top:26px}
.ir{padding:18px 20px;background:var(--surface);border:1px solid var(--line);margin-top:10px}
.ir .hd{display:flex;flex-wrap:wrap;align-items:center;gap:11px}
.ir .tag{padding:2px 8px;background:color-mix(in srgb,var(--coral) 12%,transparent);color:var(--coral);font-size:10px;font-weight:600;letter-spacing:var(--track-eyebrow);text-transform:uppercase}
.ir .tag.ok{background:#EAF6EF;color:#1F7A4D}
.ir .tag.pl{background:var(--blue-soft);color:var(--blue)}
.ir b{font-family:var(--font-display);font-size:15px;font-weight:600;letter-spacing:var(--track-title)}
.ir .dt{margin-left:auto;color:var(--muted);font-size:12px}
.ir dl{display:grid;grid-template-columns:96px 1fr;gap:7px 14px;margin-top:13px;font-size:13px;line-height:1.5}
.ir dt{color:var(--muted)}
@media(max-width:760px){.sr{grid-template-columns:22px 1fr auto}.sr .bar{display:none}}

/* ── tool.html → body.p-tool ── */
/* В макете `tg` — это и двухколоночная сетка страницы инструмента (tool.html),
   и метка формата в строке каталога (tools.html). В отдельных файлах они не
   встречались; здесь все стили в одном файле, и сетка накрывала каждую метку:
   <span class="tg">PDF</span> становился грид-контейнером в две колонки и падал
   на вторую строку. Сетке дано своё имя, метка осталась `tg`. */
.tgrid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:38px;align-items:start;margin-top:26px}
.panel{display:grid;gap:16px;align-content:start;padding:22px;background:var(--surface);border:1px solid var(--line)}
.pnl-hd{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--soft-line)}
.pnl-live{display:inline-flex;align-items:center;gap:7px;color:var(--blue);font-size:12px}
.pnl-live i{font-size:16px}
.cgrid{display:grid;border:1px solid var(--line)}
.cgrid[data-cols="2"]{grid-template-columns:repeat(2,minmax(0,1fr))}
.cgrid[data-cols="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid button{min-height:72px;display:grid;align-content:center;gap:4px;padding:10px 12px;border:0;border-right:1px solid var(--line);color:var(--ink);background:var(--surface);font-family:var(--font-ui);text-align:left;cursor:pointer;transition:background .16s ease,color .16s ease}
.cgrid button:last-child{border-right:0}
.cgrid button:hover{color:var(--blue)}
.cgrid button[data-on]{color:var(--blue);background:var(--blue-soft);box-shadow:inset 0 -3px 0 var(--blue)}
.cgrid button strong{font-family:var(--font-display);font-size:12px;font-weight:600}
.cgrid button span{color:var(--muted);font-size:10px;line-height:1.3}
.cgrid button[data-on] span{color:var(--blue)}
.cgrid[data-cols="4"] button{min-height:46px;justify-items:center;text-align:center}
.target{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:stretch}
.tnum{display:flex;align-items:baseline;gap:6px;padding:14px 18px;background:var(--blue-soft);border:1px solid color-mix(in srgb,var(--blue) 38%,var(--line));clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%)}
.tnum input{width:64px;border:0;background:transparent;outline:0;color:var(--blue);font-family:var(--font-display);font-size:38px;font-weight:600;letter-spacing:var(--track-title);line-height:1;text-align:right}
.tnum .unit{color:var(--blue);font-family:var(--font-ui);font-size:15px;font-weight:600}
.tside{display:grid;gap:7px;align-content:center}
.predict{display:grid;gap:9px;padding:15px 16px;background:var(--surface-strong);border:1px solid var(--line)}
body.p-tool .prow{display:grid;grid-template-columns:52px minmax(0,1fr) 62px;align-items:center;gap:11px;font-size:12.5px}
.prow .pl{color:var(--muted)}
.prow .pbar{height:10px;background:color-mix(in srgb,var(--line) 55%,transparent)}
.prow .pbar i{display:block;height:100%;background:var(--muted)}
.prow .pbar i.ok{background:var(--blue)}
.prow .pv{text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}
.prow .pv.strong{color:var(--ink);font-weight:600}
.pnote{display:flex;gap:8px;align-items:flex-start;margin-top:2px;color:var(--muted);font-size:11.5px;line-height:1.45}
.pnote i{font-size:15px;color:var(--success);flex:0 0 auto;margin-top:1px}
.chk{display:flex;align-items:flex-start;gap:9px;color:var(--muted);font-size:13px;line-height:1.4;cursor:pointer}
.chk input{margin-top:3px;width:16px;height:16px;accent-color:var(--blue);flex:0 0 auto}
.chk b{color:var(--ink);font-weight:600}
.pfoot{color:var(--muted);font-size:11.5px;text-align:center}
.syn{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}
.syn span{padding:6px 11px;background:var(--blue-soft);border-radius:var(--r-xs);font-size:12.5px;color:var(--blue)}
body.p-tool h2.h{font-family:var(--font-display);font-size:26px;font-weight:600;margin:46px 0 14px;letter-spacing:var(--track-title)}
body.p-tool .prob{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
body.p-tool .prob>b{font-family:var(--font-display);font-size:14.5px;font-weight:600;display:flex;gap:10px;align-items:center;padding:13px 16px;border-bottom:1px solid var(--soft-line)}
.prob>b i{font-size:19px;color:var(--coral)}
.prob>b .pct{margin-left:auto;color:var(--muted);font-size:11.5px;font-weight:400}
body.p-tool .prob dl{display:grid;grid-template-columns:82px 1fr;gap:7px 14px;padding:14px 16px;font-size:12.5px;line-height:1.5}
body.p-tool .prob .act{padding:0 16px 15px}
@media(max-width:1120px){.tgrid{grid-template-columns:1fr}}

/* Сканер не использует универсальную «перетащите файл» композицию. На компьютере
   он предлагает добавить уже снятые страницы, а соседняя карточка объясняет
   прямой мобильный путь в полноэкранную камеру. */
body.p-tool[data-tool-slug="scan-document"] {
  --h1-measure: 22ch;
}
.scan-entry {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(340px, .88fr);
  gap: 28px;
  align-items: stretch;
  margin-top: 26px;
}
.scan-entry__upload,
.scan-entry__phone {
  min-width: 0;
  border: 1px solid var(--line);
  background: var(--surface);
  clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 0 100%);
}
.scan-entry__upload {
  display: grid;
  grid-template-rows: auto 1fr;
  padding: 22px;
}
.scan-entry__label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--blue);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: var(--track-eyebrow);
  text-transform: uppercase;
}
.scan-entry__label i {
  font-size: 18px;
}
.scan-entry__upload-main {
  min-height: 330px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 13px;
  margin-top: 17px;
  padding: 34px;
  text-align: center;
  border: 2px dashed var(--blue);
  background: color-mix(in srgb, var(--blue-soft) 36%, var(--surface));
  clip-path: polygon(20px 0, calc(100% - 20px) 0, 100% 20px, 100% calc(100% - 20px), calc(100% - 20px) 100%, 20px 100%, 0 calc(100% - 20px), 0 20px);
}
.scan-entry__upload-icon {
  width: 62px;
  height: 62px;
  display: grid;
  place-items: center;
  color: #fff;
  background: var(--blue);
  clip-path: polygon(0 0, 72% 0, 100% 28%, 100% 100%, 0 100%);
}
.scan-entry__upload-icon i {
  font-size: 29px;
}
.scan-entry__upload-main strong {
  font-family: var(--font-display);
  font-size: clamp(20px, 2vw, 27px);
  font-weight: 600;
  letter-spacing: var(--track-title);
  line-height: 1.18;
}
.scan-entry__upload-main p {
  max-width: 48ch;
  margin: 0;
  color: var(--muted);
  font-size: 13.5px;
  line-height: 1.55;
}
.scan-entry__upload-main small {
  color: var(--muted);
  font-size: 11.5px;
}
.scan-entry__phone {
  display: grid;
  grid-template-columns: minmax(150px, .82fr) minmax(190px, 1fr);
  gap: 22px;
  align-items: center;
  padding: 24px;
  color: var(--ink);
  background: color-mix(in srgb, var(--coral) 8%, var(--surface));
  border-color: color-mix(in srgb, var(--coral) 45%, var(--line));
}
.scan-entry__phone-preview {
  position: relative;
  width: min(178px, 100%);
  aspect-ratio: 9 / 17;
  justify-self: center;
  overflow: hidden;
  border: 7px solid var(--ink);
  border-radius: 22px;
  background: linear-gradient(148deg, #60696d, #2d3437 62%);
  box-shadow: 0 18px 38px color-mix(in srgb, var(--ink) 22%, transparent);
}
.scan-entry__phone-top {
  position: absolute;
  left: 50%;
  top: 8px;
  width: 38%;
  height: 5px;
  border-radius: 8px;
  background: rgba(255,255,255,.34);
  transform: translateX(-50%);
}
.scan-entry__paper {
  position: absolute;
  inset: 18% 13% 28%;
  display: block;
  background: #f6efe2;
  transform: perspective(240px) rotateX(2deg) rotateZ(-2deg);
  box-shadow: 0 9px 25px rgba(0,0,0,.25);
}
.scan-entry__paper::before,
.scan-entry__paper::after {
  content: "";
  position: absolute;
  left: 18%;
  right: 18%;
  height: 2px;
  background: #aeb3b4;
  box-shadow: 0 13px 0 #c0c3c1, 0 26px 0 #b7bab8, 0 39px 0 #c7c8c3;
}
.scan-entry__paper::before { top: 24%; }
.scan-entry__paper::after { top: 66%; }
.scan-entry__paper i {
  position: absolute;
  width: 20px;
  height: 20px;
  border-color: #efa186;
  border-style: solid;
}
.scan-entry__paper i:nth-child(1) { left: -5px; top: -5px; border-width: 3px 0 0 3px; }
.scan-entry__paper i:nth-child(2) { right: -5px; top: -5px; border-width: 3px 3px 0 0; }
.scan-entry__paper i:nth-child(3) { left: -5px; bottom: -5px; border-width: 0 0 3px 3px; }
.scan-entry__paper i:nth-child(4) { right: -5px; bottom: -5px; border-width: 0 3px 3px 0; }
.scan-entry__phone-status {
  position: absolute;
  left: 50%;
  top: 10%;
  padding: 5px 8px;
  color: #fff;
  background: rgba(55, 104, 78, .88);
  font-size: 8px;
  white-space: nowrap;
  transform: translateX(-50%);
}
.scan-entry__shutter {
  position: absolute;
  left: 50%;
  bottom: 7%;
  width: 42px;
  height: 42px;
  border: 4px solid rgba(255,255,255,.9);
  border-radius: 50%;
  background: var(--coral);
  box-shadow: 0 0 0 4px rgba(28,32,34,.58);
  transform: translateX(-50%);
}
.scan-entry__phone-copy {
  min-width: 0;
}
.scan-entry__phone-copy .scan-entry__label {
  color: var(--coral);
}
.scan-entry__phone-copy h2 {
  margin: 12px 0 9px;
  font-family: var(--font-display);
  font-size: clamp(19px, 2vw, 26px);
  font-weight: 600;
  letter-spacing: var(--track-title);
  line-height: 1.16;
  overflow-wrap: anywhere;
}
.scan-entry__phone-copy > p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}
.scan-entry__camera-button {
  width: 100%;
  margin-top: 18px;
  color: #fff;
  background: var(--coral);
  overflow-wrap: anywhere;
}
.scan-entry__phone-copy ol {
  display: grid;
  gap: 7px;
  margin: 18px 0 0;
  padding: 16px 0 0 18px;
  color: var(--muted);
  border-top: 1px solid color-mix(in srgb, var(--coral) 28%, var(--line));
  font-size: 11.5px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
@media(max-width:1120px){
  .scan-entry{grid-template-columns:1fr}
  .scan-entry__phone{grid-template-columns:minmax(130px,.42fr) minmax(0,1fr)}
}
@media(max-width:860px){
  .scan-entry__upload{display:none}
  .scan-entry__phone{min-height:480px}
}
@media(max-width:560px){
  .scan-entry__phone{grid-template-columns:1fr;padding:21px}
  .scan-entry__phone-preview{width:142px;max-height:268px}
  .scan-entry__phone-copy{text-align:center}
  .scan-entry__phone-copy .scan-entry__label{justify-content:center}
  .scan-entry__phone-copy ol{text-align:left}
}

/* ── tools.html → body.p-tools ── */
.tsearch{position:relative;margin-top:22px;max-width:760px}
.tsearch>i{position:absolute;left:18px;top:19px;font-size:20px;color:var(--muted)}
.tsearch input{width:100%;min-height:58px;padding:0 96px 0 50px;background:var(--surface);border:1px solid var(--line);color:var(--ink);font-family:var(--font-ui);font-size:16px;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%)}
.tsearch input::placeholder{color:var(--muted)}
.tsearch input:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-soft)}
.tsearch .kbd{position:absolute;right:18px;top:19px;display:flex;align-items:center;gap:7px;color:var(--muted);font-size:12px}
.tsearch .kbd kbd{padding:3px 7px;background:var(--surface-sunken);border:1px solid var(--line);font-family:var(--font-ui);font-size:11px}
.tsearch.has .kbd{display:none}
.aside{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-top:12px;color:var(--muted);font-size:13px}
.aside button{white-space:nowrap;min-height:32px;padding:0 11px;background:var(--surface);border:1px solid var(--line);color:var(--blue);font-family:var(--font-ui);font-size:12.5px;cursor:pointer}
.aside button:hover{background:var(--blue-soft)}
.aside button[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:#fff}
.fbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin-top:26px;padding-bottom:13px;border-bottom:1px solid var(--line)}
.fbar .set{display:flex;flex-wrap:wrap;gap:7px}
.fbar .set button{white-space:nowrap;min-height:36px;padding:0 14px;background:transparent;border:1px solid var(--line);color:var(--muted);font-family:var(--font-ui);font-size:13.5px;cursor:pointer;transition:background .14s ease,color .14s ease,border-color .14s ease}
.fbar .set button:hover{border-color:var(--blue);color:var(--blue)}
.fbar .set button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.fbar .cnt{color:var(--muted);font-size:13px;white-space:nowrap}
.fbar .cnt b{color:var(--ink);font-weight:600}
.recent{display:none;margin-top:18px}
.recent.on{display:block}
.recent .rl{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}
.recent .rl a{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:0 12px;background:var(--surface);border:1px solid var(--line);color:var(--ink);font-size:13px;white-space:nowrap}
.recent .rl a:hover{border-color:var(--blue);color:var(--ink)}
.recent .rl a i{font-size:14px;color:var(--blue)}
.cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:22px;align-items:start}
.tcol{min-width:0;min-height:282px;padding:17px 14px 10px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%)}
.tcol.hide{display:none}
.tcol .ch{display:flex;align-items:center;gap:11px;padding:0 4px 12px;color:var(--blue);border-bottom:1px solid var(--blue)}
.tcol .ch i{font-size:22px}
.tcol .ch h2{margin:0;color:var(--ink);font-family:var(--font-ui);font-size:20px;font-weight:600}
.tcol .ch .n{margin-left:auto;color:var(--muted);font-family:var(--font-ui);font-size:13px}
.tcol .cs{padding:9px 4px 0;color:var(--muted);font-size:12.5px}
.tcol .rows{padding-top:5px}
.tcol .rest{min-height:46px;display:flex;align-items:center;padding:7px 4px;color:var(--muted);font-size:12.5px;line-height:1.4;border-top:1px dashed var(--line)}
.tcol .rest.hide{display:none}
.trow{width:100%;min-height:46px;display:grid;grid-template-columns:27px minmax(0,1fr) auto 20px;align-items:center;gap:8px;padding:7px 4px;border-bottom:1px solid var(--soft-line);color:var(--ink);font-family:var(--font-ui);text-decoration:none}
.trow:last-of-type{border-bottom:0}
.trow:hover,.trow:focus-visible{background:var(--blue-soft);color:var(--blue);outline:0}
.trow.hide{display:none}
.trow>i:first-child{justify-self:center;font-size:19px;color:currentColor}
.trow .nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
.trow .soon{margin-left:7px;padding:1px 6px;background:color-mix(in srgb,var(--coral) 12%,transparent);color:var(--coral);font-style:normal;font-size:9px;font-weight:600;letter-spacing:var(--track-eyebrow);text-transform:uppercase;vertical-align:middle}
.trow:hover .soon{background:var(--surface)}
.trow .tg{color:var(--muted);font-family:var(--font-ui);font-size:10.5px;letter-spacing:.06em;white-space:nowrap}
.trow .ar{font-size:18px;color:var(--blue);justify-self:end}
.trow.kb{background:var(--blue-soft);box-shadow:inset 0 0 0 1px var(--blue)}
.tnone{display:none;margin-top:24px;padding:24px 26px;background:var(--surface);border:1px solid var(--line)}
.tnone.on{display:block}
.tnone b{font-family:var(--font-display);font-size:17px;font-weight:600;letter-spacing:var(--track-title)}
.tnone p{margin-top:9px;color:var(--muted);font-size:14px;line-height:1.6;max-width:70ch}
.legend{display:flex;flex-wrap:wrap;gap:18px;margin-top:16px;color:var(--muted);font-size:12px}
.legend span{display:flex;align-items:center;gap:7px}
@media(max-width:1120px){.cols{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.cols{grid-template-columns:1fr}.tsearch input{min-height:52px;padding-right:18px;font-size:15px}.tsearch .kbd{display:none}}

/* Category hubs: working tools come first; guidance remains below the grid. */
body[data-seo-page-type="category"] .category-hero{display:grid;grid-template-columns:44px minmax(0,1fr);gap:18px;align-items:start;margin-top:22px;padding-bottom:24px;border-bottom:1px solid var(--line)}
body[data-seo-page-type="category"] .category-hero__icon{display:grid;place-items:center;width:44px;height:44px;background:var(--blue-soft);color:var(--blue);font-size:23px;clip-path:polygon(0 0,calc(100% - 11px) 0,100% 11px,100% 100%,0 100%)}
body[data-seo-page-type="category"] .category-hero h1{margin:0}
body[data-seo-page-type="category"] .category-hero .lead{max-width:76ch;margin-top:9px}
body[data-seo-page-type="category"] .category-tools{margin-top:26px}
body[data-seo-page-type="category"] .category-section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:14px}
body[data-seo-page-type="category"] .category-section-heading__eyebrow{display:block;margin-bottom:5px;color:var(--muted);font-size:10.5px;font-weight:600;letter-spacing:var(--track-eyebrow);text-transform:uppercase}
body[data-seo-page-type="category"] .category-section-heading h2{margin:0}
body[data-seo-page-type="category"] .category-tool-count{flex:none;color:var(--muted);font-size:12.5px}
body[data-seo-page-type="category"] .category-tool-grid{display:grid;width:100%;max-width:none;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0;padding:0;list-style:none}
body[data-seo-page-type="category"] .category-tool-card{min-width:0;margin:0}
body[data-seo-page-type="category"] .category-tool-card>a{display:grid;grid-template-columns:34px minmax(0,1fr) auto 16px;gap:11px;align-items:center;min-height:86px;padding:12px 13px;background:var(--surface);border:1px solid var(--line);color:var(--ink);clip-path:polygon(0 0,calc(100% - 13px) 0,100% 13px,100% 100%,0 100%);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
body[data-seo-page-type="category"] .category-tool-card>a:hover{transform:translateY(-2px);border-color:var(--blue);box-shadow:var(--shadow-soft);color:var(--ink)}
body[data-seo-page-type="category"] .category-tool-card__icon{display:grid;place-items:center;width:34px;height:34px;background:var(--blue-soft);color:var(--blue);font-size:18px}
body[data-seo-page-type="category"] .category-tool-card__copy{min-width:0}
body[data-seo-page-type="category"] .category-tool-card__copy strong{display:block;font-size:13.5px;font-weight:600;line-height:1.25}
body[data-seo-page-type="category"] .category-tool-card__copy>span{display:-webkit-box;margin-top:4px;overflow:hidden;color:var(--muted);font-size:11.5px;line-height:1.35;-webkit-box-orient:vertical;-webkit-line-clamp:2}
body[data-seo-page-type="category"] .category-tool-card__format{padding:3px 6px;background:var(--coral-soft);color:var(--danger-ink);font-size:9.5px;font-weight:600;letter-spacing:.04em;white-space:nowrap}
body[data-seo-page-type="category"] .category-tool-card__arrow{color:var(--muted);font-size:14px;transition:transform .16s ease}
body[data-seo-page-type="category"] .category-tool-card>a:hover .category-tool-card__arrow{transform:translateX(2px);color:var(--blue)}
body[data-seo-page-type="category"] .upcoming-tool-card{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:11px;align-items:center;min-width:0;min-height:86px;margin:0;padding:12px 13px;background:color-mix(in srgb,var(--page) 64%,var(--surface));border:1px dashed var(--line);color:var(--muted);clip-path:polygon(0 0,calc(100% - 13px) 0,100% 13px,100% 100%,0 100%)}
body[data-seo-page-type="category"] .upcoming-tool-card .category-tool-card__icon{background:color-mix(in srgb,var(--blue-soft) 46%,var(--surface));color:var(--muted)}
body[data-seo-page-type="category"] .upcoming-tool-card em{grid-column:2 / -1;font-style:normal;font-size:9.5px;font-weight:600;letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--coral)}
body[data-seo-page-type="category"] .category-help-jump{display:grid;grid-template-columns:34px minmax(0,1fr) 18px;gap:12px;align-items:center;margin-top:16px;padding:13px 15px;background:var(--blue-soft);border:1px solid color-mix(in srgb,var(--blue) 32%,var(--line));color:var(--ink)}
body[data-seo-page-type="category"] .category-help-jump:hover{border-color:var(--blue);color:var(--ink)}
body[data-seo-page-type="category"] .category-help-jump__icon{display:grid;place-items:center;width:34px;height:34px;background:var(--surface);color:var(--blue);font-size:18px}
body[data-seo-page-type="category"] .category-help-jump strong,body[data-seo-page-type="category"] .category-help-jump small{display:block}
body[data-seo-page-type="category"] .category-help-jump small{margin-top:2px;color:var(--muted);font-size:11.5px}
body[data-seo-page-type="category"] .category-help-jump__arrow{color:var(--blue)}
body[data-seo-page-type="category"] .category-task-section{scroll-margin-top:calc(var(--header-height) + 18px)}
body[data-seo-page-type="category"] .task-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0 0;padding:0;list-style:none}
body[data-seo-page-type="category"] .task-choice{display:flex;min-width:0;flex-direction:column;margin:0;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%);transition:border-color .16s ease,box-shadow .16s ease}
body[data-seo-page-type="category"] .task-choice:hover{border-color:var(--blue);box-shadow:var(--shadow-soft)}
body[data-seo-page-type="category"] .task-choice__main{display:grid;gap:10px;flex:1;padding:17px 18px;color:var(--ink)}
body[data-seo-page-type="category"] .task-choice__main:hover{color:var(--ink)}
body[data-seo-page-type="category"] .task-choice__title{display:flex;align-items:center;justify-content:space-between;gap:12px}
body[data-seo-page-type="category"] .task-choice__title strong{font-family:var(--font-display);font-size:14px;font-weight:600;letter-spacing:var(--track-tight)}
body[data-seo-page-type="category"] .task-choice__title i{color:var(--blue)}
body[data-seo-page-type="category"] .task-choice__purpose{color:var(--muted);font-size:12.5px;line-height:1.5}
body[data-seo-page-type="category"] .task-choice__meta{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:auto}
body[data-seo-page-type="category"] .task-choice__meta>span{padding:9px 10px;background:var(--surface-sunken);font-size:11.5px;line-height:1.35}
body[data-seo-page-type="category"] .task-choice__meta small{display:block;margin-bottom:3px;color:var(--muted);font-size:9.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
body[data-seo-page-type="category"] .task-choice__guide{display:grid;grid-template-columns:18px minmax(0,1fr) 16px;gap:9px;align-items:center;min-height:44px;padding:9px 18px;background:var(--blue-soft);border-top:1px solid var(--line);color:var(--blue);font-size:12.5px;font-weight:600}
body[data-seo-page-type="category"] .task-choice__guide:hover{background:color-mix(in srgb,var(--blue-soft) 68%,var(--surface));color:var(--blue)}
body[data-seo-page-type="category"] .task-choice__guide-arrow{justify-self:end}
@media(max-width:1080px){body[data-seo-page-type="category"] .category-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){body[data-seo-page-type="category"] .category-hero{grid-template-columns:1fr;gap:10px}body[data-seo-page-type="category"] .category-section-heading{align-items:start;flex-direction:column;gap:4px}body[data-seo-page-type="category"] .category-tool-count{font-size:12px}body[data-seo-page-type="category"] .category-tool-grid,body[data-seo-page-type="category"] .task-choice-grid{grid-template-columns:1fr}body[data-seo-page-type="category"] .category-tool-card>a{grid-template-columns:32px minmax(0,1fr) auto 15px;min-height:76px;padding:11px 12px}body[data-seo-page-type="category"] .category-tool-card__copy>span{-webkit-line-clamp:2}body[data-seo-page-type="category"] .task-choice__meta{grid-template-columns:1fr}}
/* DOKIVO — текстовые разделы, которых нет в пакете переноса.
   Категории, сценарии, стандарты, безопасность, методика, о сервисе, для компаний,
   правовые документы, карта сайта и 404 макетом не описаны — они собраны здесь
   на том же визуальном языке: бумага, волосяная линия, засечка вместо радиуса.
   Собственных значений цвета и размера не объявляем, только var(--…). */

/* Public links remain secondary to upload in both generated pages and React. */
.public-share {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  min-width: 0;
  max-width: 100%;
}
.public-share--page {
  justify-content: flex-end;
  margin: 12px 0;
}
.public-share .public-share__button {
  min-height: 40px;
  max-width: 100%;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 0;
  background: var(--surface);
  color: var(--blue);
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.public-share .public-share__button:hover:not(:disabled) {
  border-color: var(--blue);
  background: var(--blue-soft);
}
.public-share .public-share__button:disabled { opacity: .55; cursor: default; }
.public-share .public-share__button:focus-visible,
.public-share .public-share__manual:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 3px;
}
.public-share__status {
  font-size: 12px;
  color: var(--muted);
  overflow-wrap: anywhere;
}
.public-share .public-share__manual {
  flex: 1 1 100%;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding: 9px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink);
  font: inherit;
  font-size: 12px;
}
.public-share .public-share__manual[hidden] { display: none; }
.public-share-card {
  margin: 18px 0;
  padding: 16px;
  border: 1px solid var(--line);
  background: var(--surface);
}
.public-share-card > p { margin: 0 0 12px; }
@media (max-width: 900px) {
  .public-share .public-share__button { min-height: 44px; }
}

.wrap > main,
main.wrap {
  display: block;
}

/* ─── общий поток текста ─────────────────────────────────────────────────── */
main h1 {
  margin-top: 12px;
  font-family: var(--font-display);
  font-size: clamp(30px, 3.1vw, 42px);
  font-weight: var(--weight-semibold);
  letter-spacing: var(--track-hero);
  line-height: 1.08;
  max-width: 20ch;
  text-wrap: balance;
}
main h2 {
  margin: 40px 0 14px;
  font-family: var(--font-display);
  font-size: 26px;
  font-weight: var(--weight-semibold);
  letter-spacing: var(--track-title);
  line-height: 1.14;
  text-wrap: balance;
}
main h3 {
  margin: 26px 0 10px;
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: var(--weight-semibold);
  letter-spacing: var(--track-title);
}
main p {
  margin: 12px 0;
  max-width: 74ch;
  line-height: var(--leading-prose);
  text-wrap: pretty;
}
main ul,
main ol {
  margin: 12px 0;
  padding-left: 20px;
  max-width: 74ch;
  line-height: var(--leading-prose);
}
main li {
  margin: 6px 0;
}
main section {
  margin-top: 34px;
}

.lead {
  margin-top: 14px;
  max-width: 74ch;
  color: var(--muted);
  font-size: var(--text-lead);
  line-height: 1.55;
}
.seo-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--coral);
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: var(--weight-bold);
  letter-spacing: var(--track-eyebrow-wide);
  text-transform: uppercase;
}
.byline,
.updated {
  color: var(--muted);
  font-size: var(--text-xs);
}
.updated {
  margin-top: 42px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

/* ─── хлебные крошки старого образца ─────────────────────────────────────── */
.breadcrumbs {
  padding: 22px 0 0;
  color: var(--muted);
  font-size: var(--text-xs);
}
.breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 0;
  padding: 0;
  max-width: none;
  list-style: none;
}
.breadcrumbs li + li::before {
  content: "/";
  margin-right: 7px;
  color: #a2a4a6;
}
.breadcrumbs a {
  color: var(--blue-500);
}

/* ─── короткий ответ и точка входа в работу ──────────────────────────────── */
.answer {
  padding: 20px 22px;
  background: var(--blue-soft);
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
}
.answer h2 {
  margin-top: 0;
  font-size: 20px;
}
.answer p {
  margin-bottom: 0;
}

.drop {
  display: grid;
  gap: 11px;
  margin-top: 26px;
  padding: 26px 24px;
  background: var(--surface);
  border: 1px solid var(--blue);
  clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
}
.drop strong {
  font-family: var(--font-display);
  font-size: 21px;
  font-weight: var(--weight-semibold);
  letter-spacing: var(--track-title);
}
.drop span {
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: var(--leading-body);
}
.drop small {
  color: var(--muted);
  font-size: var(--text-xs);
}
.action,
a.action {
  justify-self: start;
  min-height: var(--control-height);
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0 22px;
  background: var(--blue);
  color: var(--text-on-brand);
  clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 15px, 100% 100%, 0 100%);
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
  line-height: 1;
  transition: var(--transition-button);
}
.action:hover {
  transform: var(--hover-lift);
  filter: var(--hover-filter);
  color: var(--text-on-brand);
}

/* ─── факты, проверяемый пример, чек-листы ───────────────────────────────── */
.facts {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 0;
  margin: 16px 0 0;
  border: 1px solid var(--line);
  background: var(--surface-strong);
}
.facts dt,
.facts dd {
  padding: 11px 15px;
  border-bottom: 1px solid var(--soft-line);
  font-size: var(--text-body-sm);
  line-height: var(--leading-snug);
}
.facts dt {
  color: var(--muted);
  white-space: nowrap;
}
.facts dd {
  margin: 0;
}
.facts dt:nth-last-of-type(1),
.facts dd:nth-last-of-type(1) {
  border-bottom: 0;
}
@media (max-width: 640px) {
  .facts {
    grid-template-columns: 1fr;
  }
  .facts dt {
    padding-bottom: 0;
    border-bottom: 0;
    white-space: normal;
  }
}

.evidence {
  margin-top: 18px;
  padding: 16px 18px;
  background: var(--surface-sunken);
  font-size: var(--text-body-sm);
  line-height: var(--leading-body);
}
.evidence strong {
  display: block;
  margin-bottom: 5px;
}

.usecases,
.checks,
.howto {
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
  display: grid;
  gap: 9px;
}
.usecases li,
.checks li {
  display: grid;
  grid-template-columns: 15px minmax(0, 1fr);
  gap: 11px;
  margin: 0;
  font-size: var(--text-sm);
  line-height: var(--leading-body);
}
.usecases li::before,
.checks li::before {
  content: "";
  width: 5px;
  height: 5px;
  margin-top: 9px;
  background: var(--blue);
}
.howto li {
  margin: 0;
  padding: 13px 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%);
  font-size: var(--text-sm);
  line-height: var(--leading-body);
}
.howto strong {
  color: var(--blue);
}

/* ─── карточки и списки связей ───────────────────────────────────────────── */
.cards,
.resource-cards {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 16px 0 0;
  padding: 0;
  max-width: none;
}
.cards li,
.resource-cards li {
  margin: 0;
}
.card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  height: 100%;
  padding: 19px 20px;
  color: var(--ink);
}
.card strong {
  font-family: var(--font-display);
  font-size: 17px;
  font-weight: var(--weight-semibold);
  letter-spacing: var(--track-title);
  line-height: 1.24;
}
.card span {
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: var(--leading-snug);
}

.related,
.catalog {
  list-style: none;
  display: grid;
  gap: 0;
  margin: 16px 0 0;
  padding: 0;
  max-width: none;
  border: 1px solid var(--line);
  background: var(--surface);
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
}
.related li,
.catalog li {
  margin: 0;
  border-bottom: 1px solid var(--soft-line);
}
.related li:last-child,
.catalog li:last-child {
  border-bottom: 0;
}
.related a,
.catalog a {
  display: block;
  padding: 13px 16px;
  color: var(--ink);
  font-size: var(--text-sm);
  transition: var(--transition-nav);
}
/* Название и пояснение в строке — два инлайновых узла подряд. Без раскладки
   они слипались: «…и проверка результатаСравнение показывает…». */
.related a strong,
.catalog a strong {
  display: block;
}
.related a strong + span,
.catalog a strong + span {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: var(--leading-snug);
}
.related a:hover,
.catalog a:hover {
  background: var(--blue-soft);
  color: var(--blue);
}

@media (max-width: 1040px) {
  .cards,
  .resource-cards {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 700px) {
  .cards,
  .resource-cards {
    grid-template-columns: 1fr;
  }
}

/* ─── вопросы ────────────────────────────────────────────────────────────── */
.faq {
  margin-top: 16px;
  border: 1px solid var(--line);
  background: var(--surface);
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
}
.faq details {
  border-bottom: 1px solid var(--soft-line);
}
.faq details:last-child {
  border-bottom: 0;
}
.faq summary {
  padding: 14px 16px;
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  cursor: pointer;
}
.faq summary:hover {
  color: var(--blue);
}
.faq details[open] summary {
  color: var(--blue);
}
.faq p {
  margin: 0;
  padding: 0 16px 15px;
  color: var(--muted);
  font-size: var(--text-body-sm);
  line-height: var(--leading-body);
}

/* ─── таблицы ────────────────────────────────────────────────────────────── */
.table-wrap {
  margin-top: 16px;
  overflow-x: auto;
  border: 1px solid var(--line);
  background: var(--surface-strong);
}
.table-wrap table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--text-body-sm);
}
.table-wrap th,
.table-wrap td {
  padding: 11px 13px;
  text-align: left;
  border-bottom: 1px solid var(--soft-line);
  vertical-align: top;
}
.table-wrap th {
  color: var(--muted);
  background: color-mix(in srgb, var(--surface-sunken) 60%, transparent);
  font-size: 10px;
  font-weight: var(--weight-semibold);
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.table-wrap tbody tr:last-child td {
  border-bottom: 0;
}

/* ─── короткая GIF-инструкция ────────────────────────────────────────────── */
.visual-guide-section {
  margin-top: 34px;
}
.visual-guide {
  border: 1px solid var(--line);
  background: var(--surface);
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
}
.visual-guide summary {
  padding: 14px 16px;
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  cursor: pointer;
}
.visual-guide figure {
  margin: 0;
  padding: 0 16px 16px;
}
.visual-guide img {
  width: 100%;
  height: auto;
  border: 1px solid var(--line);
  background: var(--surface-strong);
}
.visual-guide figcaption {
  padding-top: 10px;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: var(--leading-snug);
}

/* ─── каталог инструкций ─────────────────────────────────────────────────── */
.guide-hero {
  padding: 34px 0 4px;
}
.guide-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--coral);
  font-size: 11px;
  font-weight: var(--weight-bold);
  letter-spacing: var(--track-eyebrow-wide);
  text-transform: uppercase;
}
.guide-hero__note {
  margin-top: 14px;
  color: var(--muted);
  font-size: var(--text-sm);
}
.guide-catalog-layout {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  gap: 32px;
  margin-top: 30px;
}
.guide-tree {
  align-self: start;
  position: sticky;
  top: calc(var(--header-height) + 18px);
  padding: 18px;
  background: var(--surface);
  border: 1px solid var(--line);
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
}
.guide-tree__note {
  margin-top: 12px;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: var(--leading-snug);
}
.guide-finder {
  display: grid;
  gap: 13px;
}
.guide-search {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px 13px;
  background: var(--surface);
  border: 1px solid var(--line);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%);
}
.guide-search input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  font-size: var(--text-body-sm);
}
.guide-search__hint,
.guide-results-head {
  color: var(--muted);
  font-size: var(--text-xs);
}
.guide-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.guide-chip {
  padding: 8px 13px;
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--ink);
  font-size: var(--text-xs);
  cursor: pointer;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%);
}
.guide-chip[aria-pressed="true"] {
  color: var(--blue);
  background: var(--blue-soft);
  border-color: var(--blue);
}
.guide-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}
.guide-card {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 19px 20px;
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--ink);
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
  transition: var(--transition-card);
}
.guide-card:hover {
  border-color: var(--blue);
  transform: var(--hover-lift);
}
.guide-card__category {
  color: var(--coral);
  font-size: 11px;
  font-weight: var(--weight-bold);
  letter-spacing: var(--track-eyebrow);
  text-transform: uppercase;
}
.guide-card strong {
  font-family: var(--font-display);
  font-size: 17px;
  font-weight: var(--weight-semibold);
  letter-spacing: var(--track-title);
  line-height: 1.24;
}
.guide-card__meta,
.guide-card p {
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: var(--leading-snug);
}
.guide-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: auto;
  padding-top: 8px;
}
.guide-empty {
  padding: 26px 22px;
  background: var(--surface-sunken);
  color: var(--muted);
  font-size: var(--text-sm);
}
.guide-return {
  margin-top: 26px;
}
@media (max-width: 980px) {
  .guide-catalog-layout {
    grid-template-columns: 1fr;
  }
  .guide-tree {
    position: static;
  }
  .guide-card-grid {
    grid-template-columns: 1fr;
  }
}

/* ─── пошаговый показ ────────────────────────────────────────────────────── */
.lesson {
  margin-top: 30px;
  padding: 24px;
  background: var(--surface);
  border: 1px solid var(--line);
  clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
}
.lesson-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  width: fit-content;
  max-width: 100%;
  border: 1px solid var(--line);
  border-bottom-color: var(--blue);
}
.lesson-tab {
  padding: 12px 18px;
  border: 0;
  border-right: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink);
  font-size: var(--text-body-sm);
  cursor: pointer;
}
.lesson-tab:last-child {
  border-right: 0;
}
.lesson-tab[aria-selected="true"] {
  color: var(--blue);
  background: var(--blue-soft);
  box-shadow: var(--inset-tab-active);
  font-weight: var(--weight-semibold);
}
.lesson-panel {
  display: grid;
  gap: 10px;
  align-content: start;
}
.lesson-panel__step {
  color: var(--coral);
  font-size: 11px;
  font-weight: var(--weight-bold);
  letter-spacing: var(--track-eyebrow);
  text-transform: uppercase;
}
.lesson-panel__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 16px;
}
/* Экран урока и панель шагов — рядом, как в плеере: GIF 640×400 не должен
   растягиваться на всю ширину полосы. */
.lesson-player {
  display: grid;
  grid-template-columns: minmax(0, 640px) minmax(260px, 1fr);
  gap: 26px;
  margin-top: 20px;
  align-items: start;
}
.lesson-player.lesson-player--native {
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
}
.native-guide {
  min-width: 0;
  border: 1px solid var(--line);
  background: var(--surface);
}
.native-guide__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}
.native-guide__toolbar > strong {
  flex: 1 1 100%;
  font-size: var(--text-sm);
}
.native-guide__devices,
.native-guide__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.native-guide__toolbar button {
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  color: var(--ink);
  background: var(--surface);
  font: inherit;
  font-size: var(--text-xs);
  cursor: pointer;
}
.native-guide__toolbar button[aria-pressed="true"] {
  color: var(--blue);
  border-color: var(--blue);
  background: var(--blue-soft);
}
.native-guide__toolbar button:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 3px;
}
.native-guide__toolbar button:disabled {
  opacity: .55;
  cursor: default;
}
.native-guide__toolbar [data-native-status] {
  flex: 1 1 100%;
  color: var(--muted);
  font-size: var(--text-xs);
}
.native-guide__screen {
  padding: 12px;
  background: var(--surface-strong);
}
.native-guide__screen img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 72vh;
  max-height: min(72svh, 1000px);
  margin: 0 auto;
  object-fit: contain;
}
.native-guide__steps {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 20px 22px 20px 40px;
  font-size: var(--text-sm);
  line-height: var(--leading-body);
}
.native-guide__missing {
  padding: 18px;
  margin: 0;
}
.native-guide [hidden] {
  display: none !important;
}
.native-guide[data-state="missing"] .native-guide__screen {
  display: none;
}
.native-guide--legacy {
  border: 0;
}
.native-guide--legacy .native-guide__screen {
  padding: 0;
}
@media (max-width: 700px) {
  .native-guide__toolbar { padding: 12px; gap: 8px; }
  .native-guide__screen { padding: 6px; }
  .native-guide__steps { padding: 16px 16px 16px 34px; }
}
.lesson-screen {
  border: 1px solid var(--line);
  background: var(--surface-strong);
}
.lesson-screen img {
  display: block;
  width: 100%;
  height: auto;
}
@media (max-width: 980px) {
  .lesson-player {
    grid-template-columns: 1fr;
  }
  .lesson-screen {
    max-width: 640px;
  }
}
.lesson-steps {
  color: var(--muted);
  font-size: var(--text-xs);
}
.lesson-open {
  align-self: start;
}
@media (max-width: 860px) {
  .lesson-panel {
    grid-template-columns: 1fr;
  }
}

/* ─── статический каталог в оболочке приложения ──────────────────────────── */
.seo-fallback {
  width: min(1240px, 100% - 64px);
  margin: 0 auto;
  padding: 34px 0 54px;
}
.seo-fallback .section-heading {
  display: flex;
  align-items: baseline;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}

/* ─── выбор cookie ───────────────────────────────────────────────────────── */
.seo-cookie-consent {
  position: fixed;
  left: 50%;
  bottom: 18px;
  z-index: var(--z-consent);
  transform: translateX(-50%);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px 20px;
  width: min(920px, 100% - 32px);
  padding: 13px 16px;
  background: var(--surface-strong);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-menu);
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
}
.seo-cookie-consent strong {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: var(--weight-semibold);
  letter-spacing: var(--track-title);
}
.seo-cookie-consent p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: var(--text-2xs);
  line-height: var(--leading-body);
}
.seo-cookie-consent a {
  font-size: var(--text-xs);
}
.seo-cookie-consent__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}
.seo-cookie-consent__actions button {
  min-height: var(--control-height-sm);
  padding: 0 16px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink);
  font-size: var(--text-body-sm);
  font-weight: var(--weight-medium);
  cursor: pointer;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%);
}
.seo-cookie-consent__actions button:hover {
  border-color: var(--blue);
  color: var(--blue);
}
.seo-cookie-consent__actions .is-primary {
  border-color: var(--blue);
  background: var(--blue);
  color: var(--text-on-brand);
}
@media(max-width:700px){.seo-cookie-consent{bottom:8px;grid-template-columns:1fr;gap:10px;width:calc(100% - 16px);padding:12px}.seo-cookie-consent__actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.seo-cookie-consent__actions button{padding-inline:8px}}

/* ─── центр помощи: недостающие правила ──────────────────────────────────────
   Разметка хаба богаче, чем набор правил, приехавший из пакета: часть узлов
   оставалась вовсе без стилей — кнопки дерева выглядели голыми <button>,
   счётчик героя слипался с подписью, вкладки уроков показывали маркеры списка. */
.guide-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 250px;
  gap: 40px;
  align-items: end;
}
.guide-hero__note {
  display: grid;
  gap: 4px;
  padding: 18px 20px;
  background: var(--surface);
  border: 1px solid var(--line);
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%);
}
.guide-hero__note strong {
  font-family: var(--font-display);
  font-size: 34px;
  font-weight: var(--weight-bold);
  color: var(--ink);
  line-height: 1;
}
@media (max-width: 900px) {
  .guide-hero {
    grid-template-columns: 1fr;
    align-items: start;
  }
}

.guide-search {
  display: grid;
  gap: 8px;
  padding: 16px 18px 14px;
}
.guide-search > span:first-child {
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: var(--weight-semibold);
  letter-spacing: var(--track-title);
}
.guide-search input {
  min-height: var(--control-height-sm);
  padding: 0 13px;
  background: var(--surface-strong);
  border: 1px solid var(--line);
  font-family: var(--font-ui);
  color: var(--ink);
}
.guide-search input:focus {
  border-color: var(--blue);
  outline: 0;
  box-shadow: 0 0 0 3px var(--blue-soft);
}
.guide-search__hint {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 18px;
  justify-content: space-between;
}

.guide-card__meta {
  display: flex;
  align-items: center;
  gap: 10px;
}

.guide-results-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
}
.guide-results-head h3 {
  font-family: var(--font-display);
  font-size: 19px;
  font-weight: var(--weight-semibold);
  letter-spacing: var(--track-title);
  color: var(--ink);
}

.guide-tree {
  display: grid;
  gap: 6px;
}
.guide-tree > strong {
  margin-bottom: 6px;
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: var(--weight-semibold);
  letter-spacing: var(--track-title);
}
.guide-tree button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 11px;
  border: 1px solid transparent;
  background: none;
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: var(--text-body-sm);
  text-align: left;
  cursor: pointer;
  transition: background var(--duration-base) var(--ease), color var(--duration-base) var(--ease);
}
.guide-tree button span {
  color: var(--muted);
  font-size: var(--text-xs);
}
.guide-tree button:hover {
  background: var(--blue-soft);
  color: var(--blue);
}
.guide-tree button[aria-pressed="true"] {
  background: var(--blue-soft);
  border-color: var(--blue);
  color: var(--blue);
  font-weight: var(--weight-semibold);
}
.guide-tree button[aria-pressed="true"] span {
  color: var(--blue);
}

.lesson-tabs {
  list-style: none;
  margin: 22px 0 0;
  padding: 0;
}
.lesson-tabs li {
  display: contents;
}
.lesson-tab {
  display: grid;
  gap: 3px;
  text-align: left;
  font-family: var(--font-ui);
}
.lesson-tab strong {
  font-size: var(--text-body-sm);
  font-weight: var(--weight-medium);
}
.lesson-tab span {
  color: var(--muted);
  font-size: var(--text-2xs);
}
.lesson-panel__actions .lesson-text {
  border: 0;
  background: none;
  padding: 0;
  color: var(--text-link);
  font-family: var(--font-ui);
  font-size: var(--text-body-sm);
  cursor: pointer;
}
.lesson-panel__actions .lesson-text:hover {
  color: var(--ink);
}
.yandex-product {
  --product-accent: color-mix(in srgb, var(--accent, #a45b3e) 74%, #fff);
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr);
  gap: clamp(18px, 3vw, 40px);
  margin: clamp(24px, 5vw, 58px) 0;
  padding: clamp(22px, 4vw, 48px);
  border: 1px solid color-mix(in srgb, var(--ink, #222) 18%, transparent);
  clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 24px 100%, 0 calc(100% - 24px));
  background: var(--surface, #fffdf7);
  box-shadow: 0 20px 50px rgba(38, 36, 32, .08);
  overflow: hidden;
}
.yandex-product::before {
  content: attr(data-product-code);
  position: absolute;
  inset: 14px 18px auto auto;
  color: color-mix(in srgb, var(--product-accent) 45%, transparent);
  font: 600 clamp(28px, 6vw, 72px)/1 var(--display-font, "Unbounded", sans-serif);
}
.yandex-product__intro { align-self: start; min-width: 0; }
.yandex-product__intro h2 { max-width: 18ch; margin-top: 8px; }
.yandex-product__control {
  position: relative;
  z-index: 1;
  min-width: 0;
  padding: 18px;
  border: 1px solid color-mix(in srgb, var(--product-accent) 38%, transparent);
  background: color-mix(in srgb, var(--surface, #fff) 94%, var(--product-accent));
}
.yandex-product__control fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.yandex-product__control legend { margin-bottom: 12px; font-weight: 700; }
.yandex-product__control label {
  display: flex;
  align-items: center;
  min-height: 46px;
  gap: 10px;
  padding: 9px 12px;
  border: 1px solid color-mix(in srgb, var(--ink, #222) 16%, transparent);
  background: rgba(255,255,255,.72);
  cursor: pointer;
}
.yandex-product__control label:has(input:checked) { border-color: var(--product-accent); box-shadow: inset 4px 0 var(--product-accent); }
.yandex-product__control input { inline-size: 20px; block-size: 20px; flex: 0 0 auto; }
.yandex-product__control input:focus-visible { outline: 3px solid var(--product-accent); outline-offset: 3px; }
.yandex-product__control input:disabled { cursor: not-allowed; }
.yandex-product__choices,
.yandex-product__diagnostics,
.yandex-product__navigator,
.yandex-product__capacity { display: grid; gap: 8px; }
.yandex-product__sequence,
.yandex-product__ledger,
.yandex-product__risks { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.yandex-product__sequence li,
.yandex-product__route > div { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 8px; align-items: center; }
.yandex-product__diagnostics > div { display: grid; grid-template-columns: 10px minmax(0,1fr); gap: 8px; align-items: center; }
.yandex-product__diagnostics i { inline-size: 8px; block-size: 8px; background: var(--product-accent); transform: rotate(45deg); }
.yandex-product__matrix { inline-size: 100%; border-collapse: collapse; }
.yandex-product__matrix th, .yandex-product__matrix td { padding: 7px; text-align: left; border-bottom: 1px solid rgba(30,30,30,.18); }
.yandex-product__matrix td:last-child { inline-size: 46px; }
.yandex-product__route { display: grid; gap: 10px; border-left: 2px solid var(--product-accent); padding-left: 12px; }
.yandex-product__ledger li, .yandex-product__risks li { padding: 8px; border-bottom: 1px dashed rgba(30,30,30,.25); }
.yandex-product__capacity meter { inline-size: 100%; accent-color: var(--product-accent); }
.yandex-product__formats, .yandex-product__scores, .yandex-product__pages { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.yandex-product__formats section, .yandex-product__pages > div { min-width: 0; padding: 8px; border: 1px solid rgba(30,30,30,.16); }
.yandex-product__formats b, .yandex-product__pages span { display: block; color: var(--product-accent); margin-bottom: 8px; }
.yandex-product__scores > div { display: grid; gap: 7px; }
.yandex-product__scores span { block-size: 5px; background: linear-gradient(90deg, var(--product-accent) calc(var(--score) * 33%), rgba(30,30,30,.12) 0); }
.yandex-product__result { display: grid; gap: 5px; margin-top: 14px; padding-top: 14px; border-top: 1px dashed currentColor; }
.yandex-product__result span { overflow-wrap: anywhere; }
.yandex-product__cards {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.yandex-product__cards article { min-width: 0; padding: 16px; border-top: 3px solid var(--product-accent); background: rgba(255,255,255,.64); }
.yandex-product__cards article > p:first-child { margin: 0; color: var(--product-accent); font-weight: 700; }
.yandex-product__cards article[data-selected] { background: color-mix(in srgb, var(--product-accent) 12%, #fff); }
.yandex-product__cards h3 { margin: 8px 0; font-size: 1rem; }
.yandex-product__cards p { overflow-wrap: anywhere; }
.yandex-product__acceptance { grid-column: 1 / -1; margin: 0; padding: 14px 18px; border-left: 4px solid var(--product-accent); background: rgba(31,44,53,.045); }

.yandex-product--sequence-planner .yandex-product__cards,
.yandex-product--workflow-route .yandex-product__cards { grid-template-columns: repeat(3, minmax(0, 1fr)); counter-reset: route; }
.yandex-product--diagnostic-console { clip-path: polygon(18px 0, 100% 0, 100% calc(100% - 18px), calc(100% - 18px) 100%, 0 100%, 0 18px); }
.yandex-product--decision-board .yandex-product__cards,
.yandex-product--format-comparator .yandex-product__cards { grid-template-columns: minmax(0, 1.15fr) repeat(2, minmax(0, .85fr)); }
.yandex-product--capacity-calculator .yandex-product__control { background: #273640; color: #fff; }
.yandex-product--risk-check { background: #f7f0e5; }
.yandex-product--quality-scorecard .yandex-product__cards article { border-top: 0; border-left: 5px solid var(--product-accent); }
.yandex-product--page-map .yandex-product__control { border-left: 8px solid var(--product-accent); padding-left: 18px; }

@media (max-width: 760px) {
  .yandex-product { grid-template-columns: minmax(0, 1fr); padding: 20px 16px; }
  .yandex-product__intro h2 { max-width: 21ch; }
  .yandex-product__cards,
  .yandex-product--decision-board .yandex-product__cards,
  .yandex-product--format-comparator .yandex-product__cards,
  .yandex-product--sequence-planner .yandex-product__cards,
  .yandex-product--workflow-route .yandex-product__cards { grid-template-columns: minmax(0, 1fr); }
  .yandex-product__cards article { min-height: 0; }
  .yandex-product__formats, .yandex-product__scores, .yandex-product__pages { grid-template-columns: minmax(0,1fr); }
}

@media (prefers-reduced-motion: no-preference) {
  .yandex-product__cards article { transition: background-color 160ms ease, transform 160ms ease; }
  .yandex-product__cards article[data-selected] { transform: translateY(-2px); }
}
/* DOKIVO — то, что появляется при переносе макета в работающий сайт.
   Здесь только вещи, которых в пакете переноса быть не могло: скрытие отфильтрованных
   строк, доступность, состояния кнопок-фильтров, полоса недавних. Значений цвета и размера
   не объявляем — всё через var(--…), как требует правило дизайн-системы. */

/* Фильтрация прячет строки атрибутом hidden. Он слабее, чем display:grid из site.css,
   поэтому явно возвращаем ему силу — иначе отфильтрованное остаётся на экране. */
[hidden] {
  display: none !important;
}

/* Ссылка для клавиатуры: видна только при фокусе. */
.skip {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 200;
  padding: 12px 18px;
  background: var(--surface-strong);
  border: 1px solid var(--blue);
  color: var(--blue);
  font-size: var(--text-body-sm);
  font-weight: var(--weight-semibold);
}
.skip:focus {
  left: 14px;
  top: 10px;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
}

/* Словомарк в подвале — тот же элемент, что в шапке, но с отбивкой снизу. */
footer.ft .ft-brand {
  display: inline-block;
  margin-bottom: 13px;
}

/* «Настройки cookie» — кнопка, а не ссылка: она открывает выбор, а никуда не ведёт. */
.ck-btn {
  padding: 0;
  border: 0;
  background: none;
  color: var(--muted);
  font-family: var(--font-ui);
  font-size: inherit;
  text-decoration: underline;
  text-decoration-color: var(--line);
  text-underline-offset: 3px;
  cursor: pointer;
}
.ck-btn:hover {
  color: var(--blue);
  text-decoration-color: currentColor;
}

/* Строки в колонках мега-меню — та же отбивка, что у колонок каталога. */
.mega-panel .rows {
  padding-top: 5px;
}

/* Кнопки-фильтры: нажатое состояние приходит из aria-pressed, а не из класса,
   чтобы состояние было одно и читалось скринридером. */
.fbar .set button[aria-pressed="true"],
.filters button[aria-pressed="true"],
#ftabs button[aria-pressed="true"] {
  color: var(--blue);
  background: var(--blue-soft);
  border-color: var(--blue);
  font-weight: var(--weight-semibold);
}

/* Полоса недавних инструментов. Появляется только когда браузер что-то помнит. */
.recent {
  margin-top: 22px;
  padding: 16px 18px 10px;
  background: var(--surface);
  border: 1px solid var(--line);
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
}
.recent > .microlabel {
  margin-bottom: 6px;
}
.recent .rows {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0 22px;
}
@media (max-width: 900px) {
  .recent .rows {
    grid-template-columns: 1fr;
  }
}

/* Пустой результат поиска. */
.none {
  margin-top: 20px;
  padding: 26px 22px;
  background: var(--surface-sunken);
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: var(--leading-body);
}
.none b {
  display: block;
  margin-bottom: 6px;
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 17px;
  font-weight: var(--weight-semibold);
  letter-spacing: var(--track-title);
}

/* Метка «скоро» у согласованных добавлений: отличается от «новое» тем,
   что это ещё не ссылка — строка не кликается. */
.soon-note {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  margin-top: 18px;
  padding: 14px 18px;
  background: var(--surface-sunken);
  color: var(--muted);
  font-size: var(--text-body-sm);
  line-height: var(--leading-snug);
}
.soon-note > i {
  font-size: 18px;
  color: var(--muted);
}

/* Обратный блок «откуда сюда можно прийти»: двусторонность связей проверяется скриптом,
   а показывается вот этим. */
.backlinks {
  margin-top: 34px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}
.backlinks > .microlabel {
  margin-bottom: 10px;
}

/* Рабочее пространство и кабинет загружают приложение: пока бандл не приехал,
   на месте экрана должна быть не пустота, а объяснение. */
.app-boot {
  display: grid;
  gap: 13px;
  justify-items: center;
  padding: 78px 22px;
  text-align: center;
  color: var(--muted);
  font-size: var(--text-sm);
}
.app-boot i {
  font-size: 38px;
  color: var(--blue);
}
.app-boot b {
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 21px;
  font-weight: var(--weight-semibold);
  letter-spacing: var(--track-title);
}

/* ─── иконки React-клиента ─────────────────────────────────────────────────────
   Статические страницы рисуют глиф тегом <i class="ph ph-…">, клиент — компонентом
   @phosphor-icons/react, то есть <svg> с тем же классом. Размер приходит свойством
   size, а правилам цвета нужен второй селектор — по тегу svg. */
.hdr nav .mega span svg,
.mega-panel .mh > svg,
.ccol > .ch > svg,
.cats a > svg,
.dz .inner > svg.big,
.dzflow > svg,
.tool > svg.ic,
.trow > svg.ar,
.promise li > svg,
.sizer > svg {
  color: var(--blue);
}
.trust > div > svg {
  grid-row: span 2;
  align-self: center;
  color: var(--blue);
}
.trust > div > svg.ok {
  color: var(--success);
}

/* Каретка «Все инструменты» разворачивается вместе с панелью. Состояние читается
   из aria-expanded — того же атрибута, что слышит скринридер. */
.hdr nav .mega span svg {
  transition: transform var(--duration-base) var(--ease);
}
.hdr nav .mega[aria-expanded="true"] span svg {
  transform: rotate(180deg);
}

/* Блоки главной лежат внутри <main>, где действует текстовый поток prose.css:
   отбивки заголовков и ширина в 20ch нужны статьям, а не макетным карточкам.
   Все четыре селектора встречаются только на главной и в выборе инструмента. */
.hero h1 {
  margin: 0;
  max-width: none;
}
.secline h2.sec,
.ccol > .ch h3 {
  margin: 0;
}
.r > p {
  margin: 0;
  max-width: none;
}

/* ─── главная: инлайновые стили макета, перенесённые классами ──────────────────
   В index.html пакета переноса эти значения стояли атрибутом style. В JSX собственных
   значений цвета и размера быть не должно, поэтому они переехали сюда. */
.often {
  margin-top: 26px;
}
.often .chips {
  margin-top: 11px;
}
.fh .nm {
  display: grid;
  gap: 2px;
  margin-right: auto;
  min-width: 0;
}
.fh .nm b {
  font-size: 15.5px;
}
.fh .nm small {
  color: var(--muted);
  font-size: 12px;
}
.fh .other {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--text-link);
  font-family: var(--font-ui);
  font-size: 13.5px;
  cursor: pointer;
}
.fh .other:hover {
  color: var(--ink);
}
.sizer .lb {
  flex: 1;
  font-size: 13.5px;
}
.sizer .un {
  color: var(--muted);
  font-size: 13px;
}
.catnote {
  margin-top: 16px;
  color: var(--muted);
  font-size: 13px;
}

/* Печать: обвязка не нужна, содержание нужно. */
@media print {
  .hdr,
  .mega-panel,
  .mega-scrim,
  footer.ft,
  .hint,
  .skip {
    display: none !important;
  }
}

/* ─── исправления, найденные на отрисованных страницах ───────────────────────
   Крошки собраны списком <ol> ради разметки BreadcrumbList: для поисковика это
   правильно, но текстовый поток prose.css рисовал их нумерованным списком. */
.crumb ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  margin: 0;
  padding: 0;
  max-width: none;
  list-style: none;
}
.crumb li {
  display: inline;
  margin: 0;
}

/* Шаги внутри записи о проблеме: обычный нумерованный список, а не сетка. */
.prob .steps {
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 18px;
  max-width: none;
  list-style: decimal;
}
.prob .steps li {
  margin: 0;
}
.prob .around {
  margin: 10px 0 0;
  color: var(--muted);
  font-size: var(--text-xs);
  line-height: var(--leading-body);
}

/* Разговорные формулировки под заголовком инструмента. */
.syn {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 14px;
}
.syn span {
  padding: 5px 10px;
  background: var(--surface-sunken);
  color: var(--muted);
  font-size: var(--text-xs);
}

/* Ссылка «О разделе» под колонкой каталога. */
.tcol .all {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 12px;
  font-size: var(--text-xs);
}

/* Строка согласованного добавления: видна, но не ведёт никуда. */
.trow.is-soon {
  color: var(--muted);
  cursor: default;
}
.trow.is-soon:hover {
  background: transparent;
  color: var(--muted);
}
.trow .soon {
  margin-left: 8px;
  padding: 2px 6px;
  background: color-mix(in srgb, var(--coral) 12%, transparent);
  color: var(--coral);
  font-size: 9px;
  font-style: normal;
  font-weight: var(--weight-semibold);
  letter-spacing: var(--track-eyebrow);
  text-transform: uppercase;
}

/* Сноска под сеткой карточек «Если не получилось». */
.after-grid {
  margin-top: 13px;
  font-size: var(--text-xs);
}

/* Подвал: в макете три колонки ссылок и блок бренда — ровно четыре ячейки сетки.
   На рабочем сайте разделов больше: «Состояние сервиса», «Бот и расширение»,
   «Школам и НКО», «Для компаний» и «Карта сайта» в макете не существовали.
   Четвёртая колонка не помещалась в сетку из четырёх ячеек и падала на вторую
   строку под блок бренда. Ширина позволяет: 190 + 4×118 + отступы ≈ 770 из 1240. */
footer.ft .in {
  grid-template-columns: minmax(190px, 1.7fr) repeat(4, minmax(118px, 1fr));
}
@media (max-width: 1080px) {
  footer.ft .in {
    grid-template-columns: minmax(170px, 1.4fr) repeat(2, minmax(118px, 1fr));
  }
}
@media (max-width: 760px) {
  footer.ft .in {
    grid-template-columns: 1fr 1fr;
  }
}

/* Состояние сервиса: в макете отрисован только штатный случай, поэтому в CSS
   пакета зелёный кружок сводки и зелёное деление полосы — единственные варианты.
   Странице состояния этого мало: она обязана уметь показать сбой и «нет данных»,
   иначе авария выглядела бы как штатная работа. */
.sum .dot.warn {
  background: var(--coral);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--coral) 18%, transparent);
}
.sum .dot.n {
  background: var(--line);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--line) 45%, transparent);
}
.sr.n .d,
.sr .bar i.n {
  background: var(--line);
}
.sr.n .st {
  color: var(--muted);
}
/* Полоса из 90 делений — 540px по содержимому. Колонка `auto` под неё не
   сжималась, и на экранах уже 1400px строка распирала страницу вбок.
   Даём треку право сжиматься, а делениям — становиться тоньше. */
.sr {
  grid-template-columns: 22px minmax(0, 1fr) minmax(0, auto) auto;
}
.sr .bar {
  min-width: 0;
  overflow: hidden;
}
.sr .bar i {
  flex: 0 1 4px;
  min-width: 2px;
}

/* Подпись состояния в строке `/status/` — это текст справа, а не плашка.
   Класс `st` в пакете носит и карточка шага, и эта подпись; карточка ограничена
   своей страницей, но правило подписи держим явным, чтобы новая коллизия
   по этому имени больше ничего не сломала. */
.sr .st {
  display: block;
  padding: 0;
  background: none;
  border: 0;
  min-width: 128px;
  white-space: nowrap;
}

/* ─── мера заголовка страницы ──────────────────────────────────────────────
   В пакете переноса у каждой страницы своя ширина h1: атрибутом style стояло
   от 11ch до 26ch, подобранных под конкретный заголовок. При переносе инлайновые
   значения потерялись, и все страницы остались с умолчанием 20ch — заголовки
   рвались на четыре-шесть строк. Инлайновые стили в генерируемой разметке нам
   не нужны: мера задаётся переменной на уровне страницы. */
h1.pg,
main h1 {
  max-width: var(--h1-measure, 24ch);
}
body.p-tools {
  --h1-measure: 24ch;
}
body.p-formats {
  --h1-measure: 21ch;
}
body.p-problems {
  --h1-measure: 18ch;
}
body.p-research,
body.p-guides {
  --h1-measure: 26ch;
}
body.p-status {
  --h1-measure: 22ch;
}
body.p-pricing {
  --h1-measure: 22ch;
}
body.p-apps,
body.p-edu {
  --h1-measure: 26ch;
}
body.p-tool {
  --h1-measure: 26ch;
}
body.p-scan {
  --h1-measure: 28ch;
}
body.p-account {
  --h1-measure: 20ch;
}
body.p-checkout {
  --h1-measure: 22ch;
}

/* ─── шапка на узком экране ────────────────────────────────────────────────
   В пакете переноса шапка нарисована только для широкого экрана: на 390px
   документ становился шириной 619px, кнопки «Войти» и «Попробовать Pro»
   уезжали за край, а горизонтальная прокрутка появлялась на каждой странице.
   Разделы в пакете прятались уже с 1040px и заменить их было нечем — теперь
   они лежат в панели каталога и показываются ровно там, где исчезли из шапки. */
.mega-nav {
  display: none;
}
.mega-panel .mega-nav {
  gap: 4px 22px;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
  flex-wrap: wrap;
}
.mega-panel .mega-nav a {
  padding: 8px 0;
  font-size: var(--text-body-sm);
  font-weight: var(--weight-medium);
}
.mega-panel .mega-nav a:hover {
  color: var(--blue);
}

/* На телефоне сканер — отдельный первичный сценарий главной, а не пункт,
   спрятанный в каталоге. На широком экране остаётся обычная загрузка файлов. */
.mobile-scan-entry {
  display: none;
}

/* DOM order matches the upload-first phone flow; desktop keeps the approved columns. */
body.p-home .hero {
  grid-template-areas: "intro upload" "secondary upload";
  row-gap: 0;
}
body.p-home .hero__intro { grid-area: intro; align-self: end; min-width: 0; }
body.p-home .hero__upload { grid-area: upload; min-width: 0; }
body.p-home .hero__secondary { grid-area: secondary; align-self: start; min-width: 0; }
@media (max-width: 1120px) {
  body.p-home .hero {
    grid-template-areas: "intro" "upload" "secondary";
    row-gap: 32px;
  }
}

@media (max-width: 700px) {
  body.p-home .hero {
    gap: 16px;
    padding-top: 24px;
  }
  body.p-home .hero .lede {
    margin-top: 16px;
  }
  .mobile-scan-entry {
    min-height: 96px;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    align-items: center;
    gap: 13px;
    margin-top: 6px;
    padding: 14px 15px;
    color: var(--ink);
    background: color-mix(in srgb, var(--coral) 12%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--coral) 68%, var(--line));
    border-left: 5px solid var(--coral);
    clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--coral) 12%, transparent);
  }
  .mobile-scan-entry__icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    color: #fff;
    background: var(--coral);
    clip-path: polygon(0 0, 72% 0, 100% 28%, 100% 100%, 0 100%);
  }
  .mobile-scan-entry__copy {
    min-width: 0;
    display: grid;
    gap: 2px;
  }
  .mobile-scan-entry__copy small {
    color: var(--coral);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: var(--track-eyebrow);
    text-transform: uppercase;
  }
  .mobile-scan-entry__copy strong {
    font-family: var(--font-display);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: var(--track-title);
    line-height: 1.25;
  }
  .mobile-scan-entry__copy > span {
    color: var(--muted);
    font-size: 11.5px;
    line-height: 1.35;
  }
  .mobile-scan-entry__arrow {
    color: var(--coral);
  }
  body.p-home .hero .often {
    margin-top: 10px;
  }
  body.p-home .hero .promise {
    margin-top: 10px;
  }
  body.p-home .hero .dz .inner {
    min-height: 268px;
    gap: 10px;
    padding: 22px 18px;
  }
  body.p-home .hero .dz .big {
    width: 50px;
    height: 50px;
  }
  body.p-home .hero .dzflow {
    display: none;
  }
}

/* Пять разделов, кнопка каталога и две кнопки справа перестают помещаться
   в строку задолго до планшета: на 1280px строка вылезала за экран на 73px.
   Сначала ужимаем, и только потом прячем — раздел, который видно, лучше
   раздела, который надо искать в меню. */
@media (max-width: 1360px) {
  .hdr {
    gap: 18px;
    padding: 0 20px;
  }
  .hdr nav {
    gap: 16px;
    font-size: 14px;
  }
  .hdr nav .mega {
    gap: 7px;
  }
}

@media (max-width: 1180px) {
  .hdr nav > a {
    display: none;
  }
  /* Разделы ушли из шапки — открываем их в панели каталога. */
  .mega-nav {
    display: flex;
  }
}

@media (max-width: 700px) {
  .hdr {
    gap: 10px;
    padding: 0 16px;
  }
  /* «Войти» сжимается до иконки: подпись дублирует значок и съедает всю строку. */
  .hdr .sp .btn.ghost {
    width: var(--control-height);
    min-width: var(--control-height);
    padding: 0 11px;
    font-size: 0;
    gap: 0;
  }
  .hdr .sp .btn.ghost .auth-label {
    display: none;
  }
  .hdr .sp .btn.ghost i,
  .hdr .sp .btn.ghost svg {
    font-size: 18px;
  }
  .hdr nav .mega {
    font-size: 0;
    gap: 0;
  }
  .hdr nav .mega span {
    font-size: 15px;
  }
  .hdr .sp .btn.accent {
    padding: 0 13px;
    font-size: var(--text-body-sm);
  }
}


/* Чип с длинной подписью не должен распирать телефонный экран: перенос слова
   лучше горизонтальной прокрутки всей страницы. */
@media (max-width: 480px) {
  .chips a {
    white-space: normal;
    max-width: 100%;
  }
}

/* Таблица «поле → значение» в образце разбора формата. В макете стили этой
   секции жили в инлайновом <style> страницы и в пакет не попали. */
dl.spec {
  display: grid;
  gap: 0;
  margin-top: 20px;
  border: 1px solid var(--line);
}
dl.spec > div {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 16px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--soft-line);
}
dl.spec > div:last-child {
  border-bottom: 0;
}
dl.spec dt {
  color: var(--muted);
  font-size: var(--text-body-sm);
}
dl.spec dd {
  font-size: var(--text-body-sm);
  line-height: var(--leading-snug);
}
@media (max-width: 640px) {
  dl.spec > div {
    grid-template-columns: 1fr;
    gap: 3px;
  }
}

/* Строка «вход → результат» в панели параметров страницы инструмента. */
.panel .pio {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: var(--text-body-sm);
  font-weight: var(--weight-medium);
}
.panel .pio i {
  color: var(--blue);
  font-size: 15px;
}

/* Установка остаётся вторичным действием общей шапки: она не конкурирует с
   загрузкой файла и визуально следует обычным пунктам навигации. */
.pwa-install-button{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 13px;color:var(--ink);background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%);box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--blue) 14%,transparent);font-size:13px;font-weight:650;line-height:1;white-space:nowrap;cursor:pointer;transition:color .16s ease,background-color .16s ease,border-color .16s ease,box-shadow .16s ease}
.pwa-install-button svg,.pwa-install-button i{color:var(--coral);font-size:17px}
.pwa-install-button:hover{color:var(--blue);background:var(--blue-soft);border-color:var(--blue);box-shadow:inset 0 -2px 0 var(--blue)}
.pwa-install-button:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.pwa-install-button[data-installed="true"]{color:var(--blue);border-color:var(--blue);box-shadow:inset 0 -2px 0 var(--blue)}

/* Визуальная инструкция /guides/install/: одна живая схема дополняет короткие шаги. */
.install-guide-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.86fr);align-items:center;gap:36px;padding:30px 0 22px}
.install-guide-hero h1{max-width:13ch;margin-top:10px;font:600 clamp(32px,4.3vw,58px)/1.02 var(--font-display);letter-spacing:var(--track-hero)}
.install-guide-hero .lead{max-width:62ch;margin-top:16px;color:var(--muted);font-size:16px;line-height:1.6}
.install-guide-note{display:grid;gap:7px;padding:18px 20px;background:var(--blue-soft);border-left:3px solid var(--coral);clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%)}
.install-guide-note strong{font:600 20px/1.15 var(--font-display)}
.install-guide-note span{color:var(--muted);font-size:13px;line-height:1.45}
.install-animation{position:relative;min-height:300px;display:grid;place-items:center;overflow:hidden;padding:26px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%);box-shadow:var(--shadow-soft)}
.install-animation::before{content:"";position:absolute;inset:22% 8%;border:1px dashed color-mix(in srgb,var(--blue) 45%,transparent);transform:skewY(-7deg);opacity:.7}
.install-scene{position:relative;z-index:1;display:flex;align-items:center;gap:20px}
.install-device{position:relative;display:grid;place-items:center;background:var(--ink);box-shadow:8px 10px 0 color-mix(in srgb,var(--ink) 12%,transparent)}
.install-device--phone{width:112px;height:210px;padding:9px;border:4px solid var(--ink);border-radius:19px;transform:rotate(-7deg);animation:install-float 4.5s ease-in-out infinite}
.install-device--desktop{width:184px;height:124px;padding:7px;border:4px solid var(--ink);clip-path:polygon(0 0,100% 0,100% 88%,88% 100%,0 100%);transform:rotate(5deg);animation:install-float 4.5s ease-in-out .5s infinite}
.install-device__screen{position:relative;width:100%;height:100%;display:grid;place-items:center;overflow:hidden;background:var(--page);color:var(--ink);font:700 16px/1 var(--font-display);letter-spacing:.04em}
.install-device__screen::before{content:"";position:absolute;left:12%;right:12%;top:22%;height:3px;background:var(--coral);box-shadow:0 28px 0 var(--blue),0 56px 0 var(--line)}
.install-device__screen span{position:relative;z-index:1;margin-top:108px;color:var(--blue);font-size:10px;letter-spacing:.12em}
.install-device__button{position:absolute;right:7px;top:8px;display:grid;place-items:center;width:20px;height:20px;color:#fff;background:var(--coral);font:700 14px/1 var(--font-ui);animation:install-tap 2.6s ease-in-out infinite}
.install-device--desktop .install-device__button{right:10px;top:10px}
.install-arrow{position:relative;z-index:2;color:var(--coral);font:700 29px/1 var(--font-ui);animation:install-arrow 2.6s ease-in-out infinite}
.install-shortcut{position:absolute;right:10%;bottom:19%;display:grid;place-items:center;gap:4px;width:58px;height:58px;padding:5px;color:var(--ink);background:var(--surface-strong);border:1px solid var(--coral);clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%);font:600 9px/1.1 var(--font-ui);text-align:center;animation:install-pop 2.6s ease-in-out infinite}
.install-shortcut::before{content:"D";display:grid;place-items:center;width:22px;height:22px;color:#fff;background:var(--blue);font:700 13px/1 var(--font-display)}
@keyframes install-float{0%,100%{translate:0 0}50%{translate:0 -7px}}
@keyframes install-tap{0%,25%,100%{transform:scale(1);box-shadow:0 0 0 0 color-mix(in srgb,var(--coral) 35%,transparent)}12%{transform:scale(.78);box-shadow:0 0 0 7px color-mix(in srgb,var(--coral) 0%,transparent)}}
@keyframes install-arrow{0%,100%{opacity:.45;translate:0 0}45%{opacity:1;translate:5px 0}}
@keyframes install-pop{0%,34%,100%{opacity:.55;transform:scale(.9)}62%{opacity:1;transform:scale(1)}}
.install-device-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:28px 0 0;padding:0;list-style:none}
.install-device-tab{width:100%;min-height:48px;display:grid;align-content:center;gap:2px;padding:9px 13px;color:var(--ink);background:var(--surface);border:1px solid var(--line);cursor:pointer;text-align:left;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}
.install-device-tab[aria-selected="true"]{color:var(--blue);border-color:var(--blue);background:var(--blue-soft);box-shadow:inset 0 -2px 0 var(--blue)}
.install-device-tab strong{font-size:14px}
.install-device-tab span{color:var(--muted);font-size:11px}
.install-device-panel{display:none;margin-top:14px;padding:20px;background:var(--surface);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%)}
.install-device-panel[data-active="true"]{display:block;animation:install-panel-in .25s ease-out}
.install-device-panel h2{font:600 22px/1.15 var(--font-display)}
.install-device-panel p{max-width:72ch;margin-top:8px;color:var(--muted);font-size:14px;line-height:1.52}
.install-device-panel ol{display:grid;gap:8px;margin:16px 0 0;padding:0;list-style:none;counter-reset:install-step}
.install-device-panel li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:10px;align-items:start;font-size:14px;line-height:1.45}
.install-device-panel li::before{counter-increment:install-step;content:counter(install-step);display:grid;place-items:center;width:26px;height:26px;color:#fff;background:var(--blue);font-weight:700;clip-path:polygon(0 0,calc(100% - 6px) 0,100% 6px,100% 100%,0 100%)}
.install-device-panel__action{display:inline-flex;align-items:center;gap:7px;margin-top:18px;color:var(--blue);font-weight:700}
.install-device-panel__action:hover{color:var(--ink)}
@keyframes install-panel-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.install-guide-reassurance{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:28px}
.install-guide-reassurance article{padding:16px;background:var(--surface);border-top:2px solid var(--blue);border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-left:1px solid var(--line)}
.install-guide-reassurance strong{display:block;font:600 15px/1.2 var(--font-display)}
.install-guide-reassurance p{margin-top:7px;color:var(--muted);font-size:12.5px;line-height:1.45}
@media(max-width:900px){.install-guide-hero{grid-template-columns:1fr}.install-animation{min-height:260px}.install-guide-reassurance{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.hdr{gap:5px;padding-right:8px;padding-left:8px}.wordmark{font-size:21px}.hdr .sp{gap:5px}.hdr .sp .btn.accent{padding:0 8px;font-size:11.5px}.hdr .sp .pwa-install-button{display:inline-flex;width:44px;min-width:44px;padding:0;gap:0;clip-path:none}.hdr .sp .pwa-install-button span{display:none}.hdr .sp .pwa-install-button svg{width:18px;height:18px}.install-guide-hero{padding-top:20px}.install-guide-hero h1{font-size:34px}.install-scene{gap:10px;transform:scale(.78)}.install-animation{min-height:230px;padding:12px}.install-device-tabs{grid-template-columns:1fr;gap:8px}.install-device-tab{min-height:44px}.install-guide-reassurance{grid-template-columns:1fr}}

/* Fit the existing four header actions on 320px without hiding or clipping them. */
@media (max-width: 360px) {
  .hdr { gap: 3px; padding-inline: 4px; }
  .hdr .wordmark { font-size: 17px; }
  .hdr .sp { gap: 3px; }
  .hdr .mobile-nav-trigger,
  .hdr .sp .btn.ghost { width: 44px; min-width: 44px; padding-inline: 0; }
  .hdr .sp .btn.accent {
    width: 64px;
    min-width: 64px;
    padding-inline: 4px;
    white-space: normal;
    text-align: center;
    line-height: 1.15;
  }
}

.home-chip-more{display:none!important}
@media(max-width:700px){body.p-home .hero .home-chip--secondary{display:none}body.p-home .hero .home-chip-more{display:inline-flex!important;align-items:center;gap:5px;color:var(--coral);border-color:color-mix(in srgb,var(--coral) 55%,var(--line))}}
@media(prefers-reduced-motion:reduce){.install-animation *,.install-animation::before,.install-device-panel[data-active="true"]{animation:none!important;transition:none!important}.install-device--phone,.install-device--desktop{transform:none}}
/* Цвета, шрифты и высота шапки живут в src/design/tokens/*.css.
   Здесь остались только компоненты приложения, которых в дизайн-системе нет:
   модалки, панель кабинета, формы, тосты, cookie-баннер. */

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background: var(--page);
}

body {
  margin: 0;
  min-width: min(320px, 100%);
  min-height: 100vh;
  background: var(--page);
  -webkit-font-smoothing: antialiased;
}

button,
input {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

button {
  color: inherit;
}

a {
  color: inherit;
  text-decoration: none;
}

.app {
  min-height: 100vh;
  color: var(--ink);
  background: var(--page);
  transition: color 180ms ease, background-color 180ms ease;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 60;
  height: var(--header-height);
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 38px;
  padding: 0 34px;
  background: color-mix(in srgb, var(--page) 94%, transparent);
  border-bottom: 1px solid var(--soft-line);
  backdrop-filter: blur(16px);
}

.main-nav,
.header-actions {
  display: flex;
  align-items: center;
}

.main-nav {
  gap: 30px;
  font-size: 15px;
  font-weight: 500;
}

.main-nav a,
.main-nav button {
  border: 0;
  background: none;
  padding: 10px 0;
  cursor: pointer;
  white-space: nowrap;
}

.main-nav a:hover,
.main-nav button:hover {
  color: var(--blue);
}

.all-tools-trigger {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.chevron-box {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  color: var(--blue);
  border: 1px solid var(--blue);
  clip-path: polygon(0 0, 76% 0, 100% 24%, 100% 100%, 0 100%);
}

.all-tools-trigger.is-open .chevron-box svg {
  transform: rotate(180deg);
}

.header-actions {
  gap: 15px;
}

.icon-button,
.mobile-menu-button {
  display: grid;
  place-items: center;
  padding: 8px;
  border: 0;
  background: none;
  cursor: pointer;
}

.icon-button:hover,
.mobile-menu-button:hover {
  color: var(--blue);
}

.header-rule {
  width: 1px;
  height: 29px;
  background: var(--line);
}

.notched-button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 0 22px;
  border: 0;
  clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 15px, 100% 100%, 0 100%);
  font-weight: 600;
  cursor: pointer;
  transition: transform 140ms ease, filter 140ms ease;
}

.notched-button:hover {
  transform: translateY(-2px);
  filter: brightness(0.98);
}

.notched-button:focus-visible,
.tool-row:focus-visible,
.category-tabs a:focus-visible,
.catalog-link:focus-visible,
.text-link:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--blue) 35%, transparent);
  outline-offset: 3px;
}

.notched-button--ghost {
  color: var(--ink);
  background: var(--surface);
  box-shadow: inset 0 0 0 1px var(--line);
}

.notched-button--accent {
  color: white;
  background: var(--coral);
}

.notched-button--primary {
  min-width: 220px;
  color: white;
  background: var(--blue);
}

.mobile-menu-button {
  display: none;
}

.search-bar {
  position: fixed;
  top: calc(var(--header-height) + 10px);
  left: 50%;
  z-index: 80;
  width: min(760px, calc(100vw - 40px));
  min-height: 58px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 13px;
  padding: 0 17px;
  transform: translateX(-50%);
  color: var(--ink);
  background: var(--surface-strong);
  border: 1px solid var(--blue);
  box-shadow: 0 16px 50px color-mix(in srgb, var(--ink) 14%, transparent);
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
}

.search-bar input {
  width: 100%;
  border: 0;
  outline: 0;
  color: var(--ink);
  background: transparent;
  font-size: 16px;
}

.search-bar input::placeholder {
  color: var(--muted);
}

.search-bar button {
  display: grid;
  place-items: center;
  padding: 8px;
  border: 0;
  color: var(--muted);
  background: none;
  cursor: pointer;
}

.mega-menu {
  position: fixed;
  top: var(--header-height);
  left: 50%;
  z-index: 55;
  width: min(1320px, calc(100vw - 40px));
  max-height: calc(100vh - var(--header-height) - 22px);
  padding: 28px 32px 34px;
  overflow: auto;
  transform: translateX(-50%);
  background: var(--surface-strong);
  border: 1px solid var(--blue);
  box-shadow: 0 24px 70px color-mix(in srgb, var(--ink) 16%, transparent);
  clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
}

.mega-menu__header,
.mega-menu__group-title,
.section-heading,
.search-results__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.mega-menu__header {
  padding-bottom: 22px;
  border-bottom: 1px solid var(--line);
}

.mega-menu__header h2 {
  margin: 4px 0 0;
  font-family: var(--font-display);
  font-size: 25px;
  letter-spacing: -0.035em;
}

.mega-menu__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px;
  padding-top: 24px;
}

.mega-menu__group {
  min-width: 0;
}

.mega-menu__group-title {
  justify-content: flex-start;
  gap: 10px;
  padding-bottom: 12px;
  color: var(--blue);
  border-bottom: 1px solid var(--blue);
}

.mega-menu__group-title span {
  margin-left: auto;
  color: var(--coral);
  font-size: 12.5px;
}

main {
  overflow: hidden;
}

.intake-builder,
.home-help,
.research-strip,
.tools-section,
.benefits,
.pricing-preview {
  width: min(1360px, calc(100% - 64px));
  margin-inline: auto;
}

.diagonal-rule {
  position: absolute;
  width: 170px;
  height: 1px;
  background: var(--ink);
  transform: rotate(-33deg);
  transform-origin: left center;
  pointer-events: none;
}

.diagonal-rule--hero {
  top: 170px;
  right: -86px;
}

.dropzone {
  position: relative;
  min-height: 210px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 13px;
  padding: 30px;
  background: color-mix(in srgb, var(--surface) 75%, transparent);
  border: 2px dashed var(--blue);
  clip-path: polygon(28px 0, calc(100% - 28px) 0, 100% 28px, 100% calc(100% - 28px), calc(100% - 28px) 100%, 28px 100%, 0 calc(100% - 28px), 0 28px);
  transition: background-color 150ms ease, transform 150ms ease;
}

.dropzone::after {
  content: "";
  position: absolute;
  left: 44px;
  bottom: -32px;
  width: calc(50% - 44px);
  height: 31px;
  border-left: 2px solid var(--blue);
  border-bottom: 2px solid var(--blue);
  pointer-events: none;
}

.intake-builder {
  display: grid;
  grid-template-columns: minmax(240px, .78fr) minmax(360px, 1.18fr) minmax(300px, 1fr);
  gap: 26px;
  margin-top: 28px;
  margin-bottom: 22px;
  padding: 30px;
  color: var(--ink);
  background: color-mix(in srgb, var(--surface) 88%, var(--page));
  border: 1px solid var(--line);
  border-top: 4px solid var(--coral);
  clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 24px 100%, 0 calc(100% - 24px));
}
.intake-builder__intro h2 {
  margin: 8px 0 12px;
  font-family: var(--font-display);
  font-size: clamp(23px, 2.4vw, 34px);
  line-height: 1.08;
  letter-spacing: -.05em;
}
.intake-builder__intro p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}
.intake-builder__tasks {
  display: grid;
  gap: 8px;
}
.intake-builder__tasks > button {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  padding: 13px 14px;
  color: var(--ink);
  background: var(--surface-strong);
  border: 1px solid var(--line);
  text-align: left;
  cursor: pointer;
}
.intake-builder__tasks > button > svg:first-child { color: var(--blue); }
.intake-builder__tasks > button > svg:last-child { opacity: 0; color: var(--coral); }
.intake-builder__tasks > button > span { min-width: 0; display: grid; gap: 3px; }
.intake-builder__tasks strong { font-size: 13px; }
.intake-builder__tasks small { min-width: 0; color: var(--muted); font-size: 10px; line-height: 1.35; overflow-wrap: anywhere; white-space: normal; }
.intake-builder__tasks > button.is-active {
  border-color: var(--coral);
  background: color-mix(in srgb, var(--coral) 8%, var(--surface-strong));
  box-shadow: inset 4px 0 0 var(--coral);
}
.intake-builder__tasks > button.is-active > svg:last-child { opacity: 1; }
.intake-builder__result {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 13px;
  padding: 20px;
  background: var(--blue-soft);
  border: 1px solid color-mix(in srgb, var(--blue) 38%, var(--line));
}
.intake-builder__limits { min-width: 0; margin: 0; padding: 0; border: 0; }
.intake-builder__limits legend,
.intake-builder__link > span,
.intake-builder__requirement > span {
  margin-bottom: 7px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.intake-builder__limits > div { display: grid; grid-template-columns: repeat(5, 1fr); }
.intake-builder__limits button {
  min-width: 0;
  padding: 8px 4px;
  border: 1px solid var(--line);
  border-right: 0;
  background: var(--surface-strong);
  font-size: 11px;
  cursor: pointer;
}
.intake-builder__limits button:last-child { border-right: 1px solid var(--line); }
.intake-builder__limits button[aria-pressed="true"] { color: #fff; background: var(--blue); }
.intake-builder__requirement { display: grid; gap: 5px; padding: 13px 14px; background: var(--surface-strong); border-left: 4px solid var(--coral); }
.intake-builder__requirement > span { margin: 0; }
.intake-builder__requirement strong { font-family: var(--font-display); font-size: 14px; line-height: 1.3; }
.intake-builder__requirement small { color: var(--muted); font-size: 10px; }
.intake-builder__link { min-width: 0; display: grid; }
.intake-builder__link input { width: 100%; min-width: 0; height: 40px; padding: 0 10px; border: 1px solid var(--line); color: var(--muted); background: var(--surface-strong); font-size: 10px; }
.intake-builder__actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr)); gap: 8px; }
.intake-builder__actions .btn { min-width: 0; min-height: 42px; }
.intake-builder__status { min-height: 29px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.4; }
.intake-invalid { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; margin-bottom: 24px; padding: 17px 18px; color: #7c3429; background: #fff3ef; border: 1px solid #d9a093; }
.intake-invalid > div { display: grid; gap: 4px; }
.intake-invalid span { font-size: 12px; line-height: 1.45; }
.intake-invalid a { color: var(--blue); font-size: 12px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.intake-invalid button { padding: 9px 13px; color: #fff; background: var(--blue); border: 0; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.intake-status--checking { color: var(--blue); background: var(--blue-soft); border-color: color-mix(in srgb, var(--blue) 42%, var(--line)); }
.intake-status--unavailable { color: var(--ink); background: #fff8e8; border-color: #d5ae63; }

@media (max-width: 1100px) {
  .intake-builder { grid-template-columns: 1fr 1fr; }
  .intake-builder__intro { grid-column: 1 / -1; }
}

.home-help {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 22px;
  margin-top: 22px;
  margin-bottom: 46px;
  padding: 24px 28px;
  color: var(--ink);
  background: var(--blue-soft);
  border: 1px solid color-mix(in srgb, var(--blue) 38%, var(--line));
  border-left: 5px solid var(--blue);
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
}

.home-help__icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  color: #fff;
  background: var(--blue);
  clip-path: polygon(0 0, 72% 0, 100% 28%, 100% 100%, 0 100%);
}

.home-help__copy {
  min-width: 0;
}

.home-help__copy h2 {
  margin: 4px 0 5px;
  font-family: var(--font-display);
  font-size: clamp(21px, 2.3vw, 31px);
  letter-spacing: -0.045em;
}

.home-help__copy p {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.home-help__actions {
  display: grid;
  justify-items: end;
  gap: 9px;
}

.home-help__secondary {
  color: var(--blue);
  font-size: 12px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.research-strip {
  margin-bottom: 54px;
  padding: 30px;
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--surface) 84%, transparent);
  clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 24px 100%, 0 calc(100% - 24px));
}

.research-strip__heading {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr);
  gap: 32px;
  align-items: end;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--line);
}

.research-strip__heading h2 {
  max-width: 760px;
  margin: 6px 0 0;
  font-family: var(--font-display);
  font-size: clamp(26px, 2.6vw, 38px);
  line-height: 1.08;
  letter-spacing: -.05em;
}

.research-strip__heading p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.research-strip__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 18px;
}

.research-strip__grid a {
  min-height: 150px;
  display: flex;
  flex-direction: column;
  padding: 20px;
  color: var(--ink);
  border: 1px solid var(--line);
  background: var(--surface);
  text-decoration: none;
  clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
  transition: transform 150ms ease, border-color 150ms ease;
}

.research-strip__grid a:hover,
.research-strip__grid a:focus-visible {
  transform: translateY(-2px);
  border-color: var(--blue);
}

.research-strip__grid span {
  color: var(--coral);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.research-strip__grid strong {
  margin-top: 16px;
  font-family: var(--font-display);
  font-size: 19px;
  line-height: 1.18;
}

.research-strip__grid small {
  margin-top: auto;
  padding-top: 14px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.research-strip__all {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  color: var(--blue);
  font-size: 14px;
  font-weight: 700;
  text-underline-offset: 4px;
}

.dropzone input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.dropzone.is-dragging {
  background: var(--blue-soft);
  transform: translateY(-2px);
}

.dropzone.has-file {
  border-style: solid;
}

.dropzone__icon {
  color: var(--blue);
}

.dropzone__icon--success {
  color: var(--success);
}

.dropzone__title {
  font-size: 24px;
  font-weight: 600;
}

.dropzone__file,
.dropzone__hint {
  color: var(--muted);
}

.dropzone__hint {
  font-size: 13px;
}

.dropzone__actions {
  display: flex;
  align-items: center;
  gap: 18px;
}

.text-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 0;
  border: 0;
  color: var(--blue);
  background: none;
  font-weight: 600;
  cursor: pointer;
}

.tools-section {
  padding: 39px 0 58px;
  scroll-margin-top: 96px;
}

.section-heading {
  gap: 24px;
  margin-bottom: 20px;
}

.section-heading > div {
  display: flex;
  align-items: baseline;
  gap: 18px;
}

.section-heading h2 {
  margin: 0;
  font-size: clamp(25px, 2.4vw, 35px);
  line-height: 1.1;
}

.section-heading span {
  color: var(--coral);
  font-size: 14px;
  white-space: nowrap;
}

.category-tabs {
  display: flex;
  align-items: stretch;
  width: fit-content;
  max-width: 100%;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  border: 1px solid var(--line);
  border-bottom-color: var(--blue);
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
}

.category-tabs::-webkit-scrollbar {
  display: none;
}

.category-tabs a {
  display: grid;
  place-items: center;
  min-width: 145px;
  padding: 14px 22px;
  border: 0;
  border-right: 1px solid var(--line);
  color: var(--ink);
  background: var(--surface);
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
}

.category-tabs a:last-child {
  border-right: 0;
}

.category-tabs a.is-active {
  color: var(--blue);
  background: var(--blue-soft);
  font-weight: 600;
  box-shadow: inset 0 -2px 0 var(--blue);
}

.category-grid {
  position: relative;
  display: grid;
  grid-template-columns: 1.05fr 1.05fr 1.05fr 1fr;
  gap: 18px;
  padding-top: 18px;
}

.category-grid::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 56%;
  height: 17px;
  border-top: 2px solid var(--blue);
  border-left: 2px solid var(--blue);
  pointer-events: none;
}

.category-column {
  min-width: 0;
  min-height: 282px;
  padding: 17px 14px 10px;
  background: var(--surface);
  border: 1px solid var(--line);
  clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
  transition: border-color 150ms ease, transform 150ms ease;
  scroll-margin-top: 120px;
}

.category-column.is-active {
  border-color: var(--blue);
  transform: translateY(-3px);
}

.category-column__top {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 0 4px 12px;
  color: var(--blue);
  border-bottom: 1px solid var(--blue);
}

.category-column__top h3 {
  margin: 0;
  color: var(--ink);
  font-size: 20px;
}

.category-column__list {
  padding-top: 5px;
}

.tool-row {
  width: 100%;
  min-height: 46px;
  display: grid;
  grid-template-columns: 27px minmax(0, 1fr) auto 20px;
  align-items: center;
  gap: 8px;
  padding: 7px 4px;
  border: 0;
  border-bottom: 1px solid var(--soft-line);
  color: var(--ink);
  background: transparent;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.tool-row:last-child {
  border-bottom: 0;
}

.tool-row:hover {
  color: var(--blue);
  background: var(--blue-soft);
}

.tool-row__icon {
  display: grid;
  place-items: center;
}

.tool-row__name {
  min-width: 0;
  overflow: hidden;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.format-tag {
  max-width: 66px;
  overflow: hidden;
  padding: 3px 5px;
  color: var(--coral);
  background: var(--coral-soft);
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tool-row__arrow {
  color: var(--blue);
}

.tool-row--compact {
  grid-template-columns: 23px minmax(0, 1fr) auto 18px;
  min-height: 35px;
  padding-block: 4px;
}

.tool-row--compact .tool-row__name {
  font-size: 13px;
}

.catalog-link {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 20px auto 0;
  padding: 8px 0;
  border: 0;
  color: var(--blue);
  background: none;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
}

.search-results {
  margin-top: 22px;
  padding: 24px;
  background: var(--surface);
  border: 1px solid var(--blue);
  clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
}

.search-results__summary {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.search-results__summary span {
  color: var(--coral);
  font-size: 13px;
}

.search-results__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  padding-top: 17px;
}

.search-results__grid h3 {
  margin: 0 0 8px;
  color: var(--blue);
  font-size: 16px;
}

.benefits {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-bottom: 72px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.benefits > div {
  min-height: 175px;
  display: grid;
  align-content: center;
  grid-template-columns: auto 1fr;
  gap: 7px 14px;
  padding: 27px 36px;
  border-right: 1px solid var(--line);
}

.benefits > div:last-child {
  border-right: 0;
}

.benefits svg {
  grid-row: span 2;
  color: var(--blue);
}

.benefits strong {
  font-size: 17px;
}

.benefits span {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.45;
}

.pricing-preview {
  position: relative;
  padding: 78px 72px 82px;
  margin-bottom: 78px;
  background: var(--surface);
  border: 1px solid var(--blue);
  clip-path: polygon(0 0, calc(100% - 32px) 0, 100% 32px, 100% 100%, 0 100%);
}

.pricing-preview h2 {
  max-width: 800px;
  margin: 8px 0 13px;
  font-family: var(--font-display);
  font-size: clamp(30px, 4vw, 55px);
  line-height: 1.12;
  letter-spacing: -0.05em;
}

.pricing-preview p {
  max-width: 650px;
  margin: 0 0 24px;
  color: var(--muted);
  font-size: 17px;
}


.toast {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 110;
  max-width: min(420px, calc(100vw - 48px));
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 14px 18px;
  color: white;
  background: var(--ink);
  clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
  box-shadow: 0 12px 40px color-mix(in srgb, var(--ink) 22%, transparent);
}

.toast svg {
  color: #7ef0c1;
  flex: 0 0 auto;
}

.toast__message {
  min-width: 0;
  flex: 1;
  line-height: 1.4;
}

.toast__help {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: 0 0 auto;
  padding: 7px 9px;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.45);
  text-decoration: none;
  white-space: nowrap;
}

.toast__help:hover,
.toast__help:focus-visible {
  background: rgba(255, 255, 255, 0.12);
}

.toast--help > svg {
  color: #fff;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 360;
  display: grid;
  place-items: center;
  padding: 24px;
  background: color-mix(in srgb, #090909 50%, transparent);
  backdrop-filter: blur(5px);
}

.modal {
  position: relative;
  width: min(500px, 100%);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 13px;
  padding: 42px;
  background: var(--surface-strong);
  border: 1px solid var(--blue);
  clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
}

.modal > svg {
  color: var(--blue);
}

.modal h2 {
  margin: 3px 0 0;
  font-family: var(--font-display);
  font-size: 29px;
  letter-spacing: -0.04em;
}

.modal p {
  margin: 0 0 11px;
  color: var(--muted);
  line-height: 1.55;
}

.modal__close {
  position: absolute;
  top: 16px;
  right: 16px;
  display: grid;
  place-items: center;
  padding: 7px;
  border: 0;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
}

@media (max-width: 1240px) and (min-width: 1121px) {
  .site-header {
    gap: 20px;
    padding-inline: 22px;
  }

  .main-nav {
    gap: 18px;
    font-size: 14px;
  }

  .header-actions {
    gap: 10px;
  }
}

@media (max-width: 1120px) {
  .site-header {
    gap: 22px;
    padding: 0 24px;
  }

  .main-nav {
    gap: 18px;
  }

  .main-nav .nav-account,
  .main-nav .nav-pricing {
    display: none;
  }

  .header-actions .notched-button--ghost {
    display: none;
  }

  .category-grid,
  .search-results__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .mega-menu__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 760px) {
  :root {
    --header-height: 68px;
  }

  .site-header {
    grid-template-columns: auto 1fr auto;
    padding: 0 17px;
  }

  .main-nav,
  .header-actions {
    display: none;
  }

  .mobile-menu-button {
    display: grid;
    justify-self: end;
  }

  .mega-menu {
    inset: var(--header-height) 0 0;
    width: 100%;
    max-height: none;
    padding: 24px 18px 40px;
    transform: none;
    clip-path: none;
    border: 0;
  }

  .mega-menu__header {
    align-items: flex-start;
    gap: 14px;
  }

  .mega-menu__header .text-link {
    font-size: 12px;
  }

  .mega-menu__grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .research-strip,
  .intake-builder,
  .tools-section,
  .benefits,
  .pricing-preview {
    width: min(100% - 32px, 1360px);
  }

  .diagonal-rule {
    display: none;
  }

  .dropzone {
    min-height: 290px;
    padding: 25px 20px;
  }

  .dropzone::after {
    display: none;
  }

  .dropzone__title {
    font-size: 21px;
  }

  .dropzone__actions {
    flex-direction: column;
    gap: 8px;
  }

  .tools-section {
    padding-top: 43px;
  }

  .section-heading {
    align-items: flex-end;
  }

  .section-heading > div {
    display: block;
  }

  .section-heading span {
    display: block;
    margin-top: 7px;
  }

  .section-heading__search {
    min-width: 34px;
    overflow: hidden;
    color: transparent;
    gap: 0;
    white-space: nowrap;
  }

  .section-heading__search svg {
    flex: 0 0 auto;
    color: var(--blue);
  }

  .category-tabs {
    width: 100%;
  }

  .category-tabs a {
    min-width: 132px;
    padding-inline: 16px;
  }

  .category-grid,
  .search-results__grid {
    grid-template-columns: 1fr;
  }

  .category-grid::before {
    width: 82%;
  }

  .category-column {
    min-height: 0;
  }

  .benefits {
    grid-template-columns: 1fr;
    margin-bottom: 54px;
  }

  .home-help {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .intake-builder {
    grid-template-columns: 1fr 1fr;
  }
  .intake-builder__intro {
    grid-column: 1 / -1;
  }

  .home-help__actions {
    grid-column: 1 / -1;
    width: 100%;
    grid-template-columns: auto 1fr;
    align-items: center;
    justify-items: start;
  }

  .benefits > div {
    min-height: 140px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding: 24px 8px;
  }

  .benefits > div:last-child {
    border-bottom: 0;
  }

  .pricing-preview {
    padding: 54px 26px;
  }

  .pricing-preview h2 {
    font-size: 34px;
  }

  .home-help {
    width: calc(100% - 32px);
    grid-template-columns: 1fr;
    justify-items: start;
    gap: 14px;
    margin-bottom: 38px;
    padding: 22px;
  }

  .intake-builder {
    width: calc(100% - 32px);
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 22px;
  }
  .intake-builder__intro { grid-column: auto; }
  .intake-builder__tasks small { white-space: normal; }
  .intake-builder__actions { display: grid; grid-template-columns: 1fr; }
  .intake-invalid { grid-template-columns: auto minmax(0, 1fr); }
  .intake-invalid__actions { grid-column: 2; justify-self: start; }

  .home-help__actions {
    grid-template-columns: 1fr;
  }

  .home-help__actions .btn {
    min-width: 0;
    width: 100%;
  }

  .research-strip {
    padding: 22px;
  }

  .research-strip__heading {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .research-strip__grid {
    grid-template-columns: 1fr;
  }

  .research-strip__grid a {
    min-height: 132px;
  }

  .modal {
    padding: 37px 28px 30px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/* Functional product surfaces */
.inline-search{width:min(310px,40vw);display:flex;align-items:center;gap:9px;padding:10px 13px;border:1px solid var(--line);background:var(--surface);clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}
.inline-search svg{color:var(--blue);flex:0 0 auto}.inline-search input{min-width:0;width:100%;border:0;outline:0;color:var(--ink);background:transparent}.form-field{width:100%;display:grid;gap:7px;color:var(--muted);font-size:13px}.form-field input,.form-field textarea{width:100%;min-height:46px;padding:11px 13px;color:var(--ink);background:var(--surface);border:1px solid var(--line);outline:0}.form-field input:focus,.form-field textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 12%,transparent)}.form-field textarea{min-height:95px;resize:vertical}.check-field{display:flex;align-items:flex-start;gap:9px;color:var(--muted);font-size:13px;line-height:1.4}.check-field input{margin-top:3px}.modal-links{width:100%;display:flex;justify-content:space-between;gap:15px}.modal-links button{padding:5px 0;border:0;color:var(--blue);background:none;cursor:pointer}.modal .notched-button{width:100%}.auth-modal{width:min(520px,100%)}.process-modal{width:min(610px,100%);max-height:calc(100vh - 36px);overflow:auto}.process-modal>p{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.privacy-note,.pro-warning{display:flex;gap:10px;padding:12px 14px;color:var(--muted);background:var(--blue-soft);font-size:13px;line-height:1.45}.privacy-note svg,.pro-warning svg{color:var(--blue);flex:0 0 auto}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.panel-backdrop{position:fixed;inset:0;z-index:130;background:color-mix(in srgb,#090909 45%,transparent);backdrop-filter:blur(4px)}.account-panel{position:absolute;top:0;right:0;width:min(620px,100%);height:100%;display:grid;grid-template-rows:auto auto 1fr;color:var(--ink);background:var(--surface-strong);border-left:1px solid var(--blue);box-shadow:-20px 0 60px rgba(0,0,0,.16)}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;padding:30px 32px 20px}.panel-head h2{margin:7px 0 3px;font-family:var(--font-display);font-size:22px;letter-spacing:-.04em}.panel-head p{margin:0;color:var(--muted)}.panel-tabs{display:flex;padding:0 32px;border-bottom:1px solid var(--line);overflow:auto}.panel-tabs button{padding:13px 15px;border:0;border-bottom:2px solid transparent;color:var(--muted);background:none;white-space:nowrap;cursor:pointer}.panel-tabs button.is-active{color:var(--blue);border-color:var(--blue)}.panel-body{padding:28px 32px 50px;overflow:auto}.panel-body h3{margin:27px 0 12px}.balance-card{display:flex;align-items:center;gap:18px;padding:24px;color:white;background:var(--blue);clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%)}.balance-card span{font-size:13px;opacity:.8}.balance-card strong{margin-right:auto;font-family:var(--font-display);font-size:26px}.balance-card button{padding:8px 12px;border:1px solid rgba(255,255,255,.5);color:white;background:transparent;cursor:pointer}.balance-card--large{display:grid;gap:8px;margin-bottom:24px}.balance-card--large strong{font-size:38px}.account-grid{display:grid;grid-template-columns:1fr 1fr;margin-top:18px;border:1px solid var(--line)}.account-grid>div{display:grid;gap:5px;padding:20px;border-right:1px solid var(--line)}.account-grid>div:last-child{border:0}.account-grid span,.account-grid small{color:var(--muted);font-size:12px}.history-list{border:1px solid var(--line)}.history-list>div{display:grid;grid-template-columns:1fr auto auto;gap:12px;padding:13px 14px;border-bottom:1px solid var(--soft-line);font-size:13px}.history-list>div:last-child{border:0}.history-list em{color:var(--muted);font-style:normal}.history-list--full>div{padding-block:16px}.amount-pills,.provider-choice{display:flex;gap:9px;margin:12px 0 18px;flex-wrap:wrap}.amount-pills button,.provider-choice button{flex:1;min-width:100px;padding:11px 13px;border:1px solid var(--line);color:var(--ink);background:var(--surface);cursor:pointer}.amount-pills button.is-active,.provider-choice button.is-active,.provider-choice button:hover{color:var(--blue);border-color:var(--blue);background:var(--blue-soft)}.fine-print{color:var(--muted);font-size:12px;line-height:1.5}.settings-row{width:100%;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px 0;border:0;border-bottom:1px solid var(--line);color:var(--ink);background:none;text-align:left;cursor:pointer}.settings-row>div{display:grid;gap:4px}.settings-row span{color:var(--muted);font-size:13px}.settings-row--danger{color:#c83e34}.empty-state{min-height:165px;display:grid;place-items:center;align-content:center;gap:8px;padding:24px;color:var(--muted);text-align:center;border:1px dashed var(--line)}.empty-state svg{color:var(--blue)}.loading-line{color:var(--muted)}
.ai-modal{width:min(720px,100%);max-height:calc(100vh - 36px);overflow:auto}.tariff-list{width:100%;display:grid;gap:8px}.tariff-list button{display:flex;align-items:center;gap:18px;width:100%;padding:14px;border:1px solid var(--line);color:var(--ink);background:var(--surface);text-align:left;cursor:pointer}.tariff-list button.is-active{border-color:var(--blue);background:var(--blue-soft)}.tariff-list span{display:grid;gap:3px;margin-right:auto}.tariff-list small{color:var(--muted)}.tariff-list b{color:var(--coral);font-size:16px;white-space:nowrap}.price-confirm{width:100%;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:13px 0;border-top:1px solid var(--line)}.price-confirm span{color:var(--muted);font-size:13px}.price-confirm strong{font-size:20px}.ai-result{width:100%}.ai-result>div{max-height:46vh;padding:18px;overflow:auto;white-space:pre-wrap;line-height:1.65;background:var(--surface);border:1px solid var(--line)}.feature-list{display:grid;gap:12px;margin:4px 0;padding:0;list-style:none}.feature-list li{display:flex;align-items:center;gap:9px}.feature-list svg{color:var(--success)}.pro-modal{width:min(570px,100%)}.access-plan-choice{display:grid;grid-template-columns:1fr 1fr;gap:9px;width:100%;margin:2px 0 8px}.access-plan-choice button{display:grid;gap:4px;padding:14px;border:1px solid var(--line);color:var(--ink);background:var(--surface);text-align:left;cursor:pointer}.access-plan-choice button.is-active{border-color:var(--blue);box-shadow:inset 4px 0 0 var(--blue);background:var(--blue-soft)}.access-plan-choice span,.access-plan-choice small{color:var(--muted);font-size:11px}.access-plan-choice strong{font-family:var(--font-display);font-size:18px}.pro-warning--safe-payment{border-color:var(--blue);background:var(--blue-soft)}.settings-row small{color:var(--muted);font-size:12px}
.platforms{width:min(1360px,calc(100% - 64px));margin:0 auto 72px}.platform-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line)}.platform-grid article{min-height:180px;display:grid;grid-template-columns:auto 1fr auto;align-content:center;gap:7px 14px;padding:30px;border-right:1px solid var(--line)}.platform-grid article:last-child{border:0}.platform-grid article>svg:first-child{grid-row:span 2;color:var(--blue)}.platform-grid article>svg:last-child{grid-row:span 2;color:var(--coral)}.platform-grid span{color:var(--muted);font-size:13px;line-height:1.45}.pricing-preview p{max-width:760px}
@media(max-width:760px){.inline-search{width:46px;padding:11px;overflow:hidden}.inline-search input{min-width:180px}.account-panel{border:0}.panel-head,.panel-body{padding-left:20px;padding-right:20px}.panel-tabs{padding:0 10px}.account-grid{grid-template-columns:1fr}.account-grid>div{border-right:0;border-bottom:1px solid var(--line)}.platforms{width:calc(100% - 32px);margin-bottom:52px}.platform-grid{grid-template-columns:1fr}.platform-grid article{border-right:0;border-bottom:1px solid var(--line)}.platform-grid article:last-child{border:0}.history-list>div{grid-template-columns:1fr auto}.history-list em{grid-column:span 2}.balance-card{align-items:flex-start;flex-wrap:wrap}.balance-card strong{width:100%;order:2}.balance-card button{order:3}.modal-backdrop{padding:12px}.modal{padding:34px 22px 26px}}

@media(max-width:1120px) and (min-width:761px){.header-actions .notched-button--ghost{display:inline-flex;min-width:44px;width:44px;padding:0}.header-actions .notched-button--ghost span{display:none}.header-actions .notched-button--accent{padding-inline:16px}}

.mobile-menu-actions{display:none}
@media(max-width:760px){.mobile-menu-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:18px 0 6px}.mobile-menu-actions button,.mobile-menu-actions a{min-height:46px;display:flex;align-items:center;justify-content:center;gap:7px;padding:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink)}.mobile-menu-actions .mobile-pro{grid-column:span 2;color:white;background:var(--coral);border-color:var(--coral)}}
.mobile-menu-actions .mobile-guides{grid-column:span 2;color:var(--blue);background:var(--blue-soft);border-color:var(--blue)}

.device-list{border:1px solid var(--line)}.device-list>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-bottom:1px solid var(--soft-line)}.device-list>div:last-child{border:0}.device-list span{display:grid;gap:3px}.device-list small{color:var(--muted)}.device-list button{border:0;color:#c83e34;background:none;cursor:pointer}


/* Complete processing and privacy-accounting surfaces */
.option-grid{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.option-grid--four{grid-template-columns:repeat(4,minmax(0,1fr))}.operation-list>div>span,.history-list--full>div>span{display:grid;gap:3px}.operation-list small,.history-list--full small{color:var(--muted);font-size:11px}.ai-consent{padding:13px 14px;border:1px solid var(--blue);background:var(--blue-soft)}.ai-unavailable{width:100%;padding:12px 14px;color:#a43d31;background:var(--coral-soft);border:1px solid color-mix(in srgb,var(--coral) 45%,var(--line));font-size:13px;line-height:1.45}
@media(max-width:760px){.option-grid,.option-grid--four{grid-template-columns:1fr 1fr}.operation-list>div>span,.history-list--full>div>span{grid-column:1/-1}.operation-list>div,.history-list--full>div{grid-template-columns:1fr auto}.panel-tabs button{padding-inline:11px}}

.compression-selector{width:100%;margin:2px 0 14px;padding:0;border:0}.compression-selector legend{margin-bottom:8px;color:var(--muted);font-size:13px}.compression-selector>div{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--line)}.compression-selector button{min-height:72px;display:grid;align-content:center;gap:4px;padding:10px 8px;border:0;border-right:1px solid var(--line);color:var(--ink);background:var(--surface);cursor:pointer}.compression-selector button:last-child{border-right:0}.compression-selector button:hover{background:var(--blue-soft)}.compression-selector button.is-active{color:var(--blue);background:var(--blue-soft);box-shadow:inset 0 -3px 0 var(--blue)}.compression-selector strong{font-size:12px}.compression-selector span{color:var(--muted);font-size:10px;line-height:1.3}.compression-selector button.is-active span{color:var(--blue)}
@media(max-width:620px){.compression-selector>div{grid-template-columns:1fr 1fr}.compression-selector button:nth-child(2){border-right:0}.compression-selector button:nth-child(-n+2){border-bottom:1px solid var(--line)}}

/* Web access pricing */
.platform-card--action{cursor:pointer;transition:background .18s ease,color .18s ease}.platform-card--action:hover{background:var(--blue-soft)}
.pricing-options{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}.pricing-options article{display:grid;align-content:start;gap:13px;padding:27px;border:1px solid var(--line);background:var(--surface-strong)}.pricing-options article.is-featured{border-color:var(--coral);box-shadow:inset 4px 0 0 var(--coral)}.pricing-options article>span{color:var(--muted);font-size:13px;text-transform:uppercase;letter-spacing:.08em}.pricing-options article>strong{font-family:var(--font-display);font-size:31px;letter-spacing:-.04em}.pricing-options article>strong small{font-family:var(--font-ui);font-size:13px;font-weight:500;letter-spacing:0}.pricing-options article>p{min-height:64px;margin:0;color:var(--muted);font-size:14px}.pricing-options .notched-button{justify-self:start}
@media(max-width:980px){.pricing-options{grid-template-columns:1fr 1fr}.pricing-options article:last-child{grid-column:1/-1}}@media(max-width:760px){.pricing-options{grid-template-columns:1fr}.pricing-options article:last-child{grid-column:auto}.pricing-options article>p{min-height:0}.pricing-options .notched-button{width:100%}}
.consent-stack{display:grid;gap:10px}.check-field a,.legal-links a,.fine-print a{color:var(--blue);text-decoration:underline;text-underline-offset:2px}.form-field select{width:100%;min-height:46px;padding:11px 13px;color:var(--ink);background:var(--surface);border:1px solid var(--line);outline:0}.privacy-request{display:grid;gap:12px;padding:18px;margin-top:12px;background:var(--blue-soft);border:1px solid var(--line)}.privacy-request .notched-button{justify-self:start}.delete-account-box{display:grid;gap:10px;padding:18px;background:#fff5f3;border:1px solid #dfaaa2}.delete-account-button{color:#fff;background:#a43d31;border-color:#a43d31}.provider-choice button:disabled{opacity:.45;cursor:not-allowed}.legal-links{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.legal-links a{color:var(--muted)}
@media(max-width:760px){
  .tools-section .section-heading{align-items:stretch;flex-direction:column}
  .inline-search{width:100%;padding:11px 13px;overflow:visible}
  .inline-search input{min-width:0}
  .legal-links{gap:10px 14px}
  .privacy-request{padding:14px}
}

/* Explicit cookie choice: no analytics before consent, no advertising cookies */
.legal-link-button{padding:0;border:0;color:var(--muted);background:none;font:inherit;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.cookie-consent{position:fixed;left:50%;bottom:12px;z-index:320;width:min(960px,calc(100% - 32px));display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px 18px;padding:13px 16px;color:var(--ink);background:var(--surface-strong);border:1px solid var(--line);box-shadow:0 16px 46px rgba(24,31,43,.16);clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%);transform:translateX(-50%)}
.cookie-consent__intro{display:flex;align-items:flex-start;gap:10px}.cookie-consent__intro>svg{flex:0 0 auto;color:var(--blue)}.cookie-consent__intro>div{display:grid;gap:3px}.cookie-consent__intro strong{font-family:var(--font-display);font-size:14px;letter-spacing:var(--track-title)}.cookie-consent__intro p{margin:0;color:var(--muted);font-size:11.5px;line-height:1.4}
.cookie-consent__details{grid-column:1/-1;display:grid;grid-template-columns:1fr auto;align-items:center;border:1px solid var(--line)}.cookie-consent__details>div,.cookie-consent__details>label{min-height:58px;display:grid;gap:3px;padding:10px 13px}.cookie-consent__details>div span,.cookie-consent__details small{color:var(--muted);font-size:11px}.cookie-consent__details>label{grid-column:1/-1;grid-template-columns:1fr auto;align-items:center;border-top:1px solid var(--line);cursor:pointer}.cookie-consent__details>label span{display:grid;gap:3px}.cookie-consent__details input{width:18px;height:18px;accent-color:var(--blue)}.cookie-consent__required{padding:0 13px;color:var(--success);font-size:12px}
.cookie-consent__actions{display:flex;justify-content:flex-end;gap:7px;flex-wrap:nowrap}.cookie-consent__actions button{min-height:36px;padding:7px 11px;border:1px solid var(--line);color:var(--ink);background:var(--surface);font-size:12px;white-space:nowrap;cursor:pointer}.cookie-consent__actions button:hover{border-color:var(--blue);background:var(--blue-soft)}.cookie-consent__actions .is-settings{padding-inline:5px;border-color:transparent;color:var(--muted);background:transparent;text-decoration:underline;text-underline-offset:3px}.cookie-consent__actions .is-primary{color:#fff;background:var(--blue);border-color:var(--blue)}.cookie-consent>a{grid-column:1/-1;justify-self:end;color:var(--muted);font-size:10.5px;text-decoration:underline;text-underline-offset:2px}
@media(max-width:720px){.cookie-consent{bottom:8px;width:calc(100% - 16px);grid-template-columns:1fr;gap:9px;padding:12px}.cookie-consent__intro>svg{width:21px;height:21px}.cookie-consent__intro p{font-size:11px}.cookie-consent__actions{display:grid;grid-template-columns:auto 1fr 1fr;width:100%}.cookie-consent__actions button{min-width:0;padding-inline:8px;white-space:normal}.cookie-consent>a{justify-self:start}}

/* DOKIVO usage quotas */
.usage-summary{width:100%;display:grid;gap:8px;margin-top:14px;padding:18px;border:1px solid var(--line);color:var(--ink);background:var(--surface);text-align:left;cursor:pointer}.usage-summary>span,.usage-summary small{color:var(--muted);font-size:12px}.usage-summary>strong{font-family:var(--font-display);font-size:18px}.usage-summary>div,.usage-meter__track{height:6px;overflow:hidden;background:var(--blue-soft)}.usage-summary>div i,.usage-meter__track i{display:block;height:100%;background:var(--blue)}.usage-summary em{color:var(--blue);font-size:12px;font-style:normal}.quota-heading{margin-bottom:20px}.quota-heading h3{margin:7px 0}.quota-heading p{margin:0;color:var(--muted);line-height:1.55}.usage-list{display:grid;gap:10px}.usage-meter{display:grid;gap:10px;padding:16px;border:1px solid var(--line);background:var(--surface)}.usage-meter>div:first-child{display:flex;align-items:end;justify-content:space-between;gap:14px}.usage-meter span,.usage-meter small{color:var(--muted);font-size:12px}.usage-meter strong{font-size:14px;white-space:nowrap}.device-quota-card{display:grid;gap:6px;margin-top:14px;padding:17px;color:var(--ink);background:var(--blue-soft);border-left:4px solid var(--blue)}.device-quota-card span{color:var(--muted);font-size:13px;line-height:1.45}.pricing-rules-note{max-width:940px;margin:18px auto 0;color:var(--muted);font-size:12px;line-height:1.55}.pricing-rules-note a,.fine-print a{color:var(--blue)}
.business-plan{display:grid;grid-template-columns:1.2fr 1fr auto;gap:28px;align-items:center;margin-top:18px;padding:30px;border:1px solid var(--line);border-left:5px solid var(--blue);background:var(--blue-soft)}.business-plan__intro{display:grid;gap:8px}.business-plan__intro h3{margin:0;font-family:var(--font-display);font-size:clamp(24px,2.4vw,35px);letter-spacing:-.045em}.business-plan__intro p{margin:0;color:var(--muted);font-size:14px;line-height:1.55}.business-plan__features{display:grid;gap:11px}.business-plan__features span{display:flex;align-items:center;gap:10px;color:var(--ink);font-size:13px}.business-plan__features svg{flex:0 0 auto;color:var(--blue)}.business-plan__action{display:grid;gap:11px;justify-items:start;min-width:190px}.business-plan__action>strong{font-family:var(--font-display);font-size:20px}.business-plan__details{display:inline-flex;align-items:center;gap:6px;color:var(--blue);font-size:12px;font-weight:600;text-decoration:none}
@media(max-width:980px){.business-plan{grid-template-columns:1fr 1fr}.business-plan__action{grid-column:1/-1;grid-template-columns:auto auto;align-items:center}.business-plan__details{grid-column:1/-1}}@media(max-width:680px){.business-plan{grid-template-columns:1fr;padding:23px}.business-plan__action{grid-column:auto;grid-template-columns:1fr}.business-plan__action .notched-button{width:100%}.business-plan__details{grid-column:auto}}
@media(min-width:1180px){.pricing-options{grid-template-columns:repeat(4,minmax(0,1fr))}.pricing-options article>strong{font-size:27px}}
@media(max-width:1179px){.pricing-options{grid-template-columns:1fr 1fr}.pricing-options article:last-child{grid-column:auto}}
.access-plan-choice{grid-template-columns:repeat(3,1fr)}
@media(max-width:760px){.usage-meter>div:first-child{align-items:start;flex-direction:column}.access-plan-choice{grid-template-columns:1fr}}

.settings-row--admin{margin-bottom:18px;padding:17px 18px;color:var(--blue);border:1px solid color-mix(in srgb,var(--blue) 32%,var(--line));background:var(--blue-soft);text-decoration:none}.settings-row--admin:hover{border-color:var(--blue)}.settings-row--admin span{color:var(--muted)}
.telegram-link-confirm{display:grid;gap:18px;margin:0 0 28px;padding:24px;background:var(--blue-soft);border:1px solid color-mix(in srgb,var(--blue) 52%,var(--line));clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}
.telegram-link-confirm__intro{display:flex;align-items:flex-start;gap:15px}.telegram-link-confirm__intro>svg{flex:0 0 auto;color:var(--blue)}.telegram-link-confirm__intro>div{display:grid;gap:7px}.telegram-link-confirm__intro h3{margin:0;font-size:21px}.telegram-link-confirm__intro p{max-width:760px;margin:0;color:var(--muted);font-size:13px;line-height:1.55}.telegram-link-confirm__actions{display:flex;align-items:center;gap:13px;flex-wrap:wrap}.telegram-link-confirm__actions>button:not(.notched-button){padding:10px 4px;border:0;color:var(--muted);background:none;cursor:pointer}.telegram-link-confirm>small{color:var(--muted);font-size:11px;line-height:1.5}
.telegram-account-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:15px;padding:18px;background:var(--surface-strong);border:1px solid var(--line)}.telegram-account-row>svg{color:var(--blue)}.telegram-account-row>div:not(.telegram-account-row__actions){display:grid;gap:5px}.telegram-account-row span{color:var(--muted);font-size:12px;line-height:1.45}.telegram-account-row>a{color:var(--blue);font-size:13px;text-decoration:underline;text-underline-offset:3px}.telegram-account-row__actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.telegram-account-row__actions button{padding:8px 10px;border:1px solid var(--line);color:var(--muted);background:var(--surface);cursor:pointer}.telegram-account-row__actions button.is-confirm{color:var(--danger-ink);border-color:color-mix(in srgb,var(--coral) 52%,var(--line));background:var(--coral-soft)}

/* DOKIVO account — full-screen product surface */
.panel-backdrop{position:fixed;inset:0;z-index:130;overflow:hidden;background:var(--page);backdrop-filter:none}
.account-panel{position:absolute;inset:0;width:100%;height:100dvh;display:grid;grid-template-rows:var(--header-height) minmax(0,1fr);overflow:hidden;color:var(--ink);background:var(--page);border:0;box-shadow:none}
.panel-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px;padding:0 max(32px,calc((100vw - var(--container-app))/2 + 32px));background:color-mix(in srgb,var(--page) 94%,transparent);border-bottom:1px solid var(--soft-line)}
.account-wordmark{font-family:var(--font-display);font-size:25px;font-weight:700;letter-spacing:var(--track-brand);color:var(--ink)}
.account-panel__context{display:flex;align-items:center;gap:13px;padding-left:28px;border-left:1px solid var(--line)}
.account-panel__context span{font-size:13px;font-weight:600}
.account-panel__context strong{padding:6px 9px;color:var(--success);background:color-mix(in srgb,var(--success) 8%,var(--surface));font-size:11px;font-weight:600;letter-spacing:.02em}
.account-panel__actions{display:flex;align-items:center;gap:9px}
.account-panel__actions a,.account-panel__actions button{min-height:42px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 14px;color:var(--blue);background:var(--surface);border:1px solid var(--line);font-size:13px;font-weight:600;cursor:pointer}
.account-panel__actions button{color:#fff;background:var(--blue);border-color:var(--blue);clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}
.account-panel__actions a:hover{border-color:var(--blue);background:var(--blue-soft)}
.account-panel__actions button:hover{filter:brightness(.97)}
.account-shell{width:min(var(--container-app),100%);min-height:0;margin:0 auto;display:grid;grid-template-columns:292px minmax(0,1fr)}
.account-sidebar{min-height:0;display:flex;flex-direction:column;gap:22px;padding:36px 27px 28px 0;border-right:1px solid var(--line)}
.account-profile-card{display:grid;gap:6px;padding:24px;color:var(--ink);background:var(--surface-strong);border:1px solid var(--line);clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}
.account-profile-card__icon{width:48px;height:48px;display:grid;place-items:center;margin-bottom:8px;color:var(--blue);background:var(--blue-soft)}
.account-profile-card h2{margin:1px 0 0;overflow:hidden;font-family:var(--font-display);font-size:18px;line-height:1.25;letter-spacing:var(--track-title);text-overflow:ellipsis}
.account-profile-card p{margin:0;overflow:hidden;color:var(--muted);font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.account-profile-card>small{justify-self:start;margin-top:8px;padding:6px 9px;color:var(--blue);background:var(--blue-soft);font-size:11px;font-weight:600}
.panel-tabs{display:grid;gap:6px;padding:0;border:0;overflow:visible}
.panel-tabs button{width:100%;min-height:64px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:11px 12px;color:var(--muted);background:transparent;border:1px solid transparent;text-align:left;white-space:normal;cursor:pointer}
.panel-tabs button>svg:first-child{color:var(--blue)}
.panel-tabs button>span{min-width:0;display:grid;gap:2px}
.panel-tabs button strong{color:var(--ink);font-size:13px}
.panel-tabs button small{overflow:hidden;color:var(--muted);font-size:10px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}
.panel-tabs button>svg:last-child{color:var(--muted)}
.panel-tabs button:hover{background:var(--surface)}
.panel-tabs button.is-active{color:var(--blue);background:var(--blue-soft);border-color:color-mix(in srgb,var(--blue) 24%,var(--line));box-shadow:inset 4px 0 0 var(--blue)}
.panel-tabs button.is-active>svg:last-child{color:var(--blue)}
.account-sidebar__note{display:grid;grid-template-columns:auto 1fr;gap:10px;margin-top:auto;padding:15px;color:var(--muted);background:var(--surface);border:1px solid var(--soft-line)}
.account-sidebar__note>svg{color:var(--success)}
.account-sidebar__note span{display:grid;gap:4px}
.account-sidebar__note strong{color:var(--ink);font-size:11px}
.account-sidebar__note small{font-size:10px;line-height:1.4}
.account-sidebar__logout{align-self:flex-start;padding:7px 0;color:var(--muted);background:none;border:0;font-size:12px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.account-sidebar__logout:hover{color:var(--danger-ink)}
.panel-body{min-height:0;overflow:auto;padding:48px clamp(32px,5vw,78px) 72px}
.panel-body h3{margin:34px 0 14px;font-family:var(--font-display);font-size:18px;letter-spacing:var(--track-title)}
.panel-body .telegram-link-confirm__intro h3{margin:0;font-size:21px}
.account-section-heading{max-width:850px;margin-bottom:30px;padding-bottom:25px;border-bottom:1px solid var(--line)}
.account-section-heading h1{max-width:780px;margin:8px 0 11px;font-family:var(--font-display);font-size:clamp(29px,3.3vw,46px);line-height:1.08;letter-spacing:var(--track-display)}
.account-section-heading p{max-width:780px;margin:0;color:var(--muted);font-size:15px;line-height:1.55}
.account-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;border:1px solid var(--line);background:var(--surface-strong)}
.account-grid>div{min-height:148px;display:grid;align-content:start;gap:8px;padding:24px;border-right:1px solid var(--line)}
.account-grid>div:last-child{border:0}
.account-grid span{color:var(--coral);font-size:10px;font-weight:600;letter-spacing:var(--track-eyebrow);text-transform:uppercase}
.account-grid strong{font-family:var(--font-display);font-size:17px;line-height:1.3;letter-spacing:var(--track-title)}
.account-grid small{color:var(--muted);font-size:12px;line-height:1.45}
.usage-summary{margin-top:16px;padding:22px;background:var(--surface-strong);clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%)}
.usage-summary:hover{border-color:var(--blue);background:var(--blue-soft)}
.usage-summary>strong{font-size:22px}
.history-list,.device-list{background:var(--surface-strong)}
.history-list>div{padding:16px 18px}
.quota-heading{max-width:760px}
.quota-heading h3{font-size:25px}
.usage-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.usage-meter{min-height:106px;padding:20px;background:var(--surface-strong)}
.device-quota-card{padding:20px}
.settings-row{padding:20px 2px}
.settings-row--admin{padding:19px 20px}
.privacy-request,.delete-account-box{padding:22px}
.loading-line{min-height:180px;display:grid;place-items:center;color:var(--muted);background:var(--surface-strong);border:1px dashed var(--line)}

@media(max-width:1424px){
  .panel-head{padding-inline:32px}
  .account-sidebar{padding-left:32px}
}
@media(max-width:1000px){
  .account-shell{grid-template-columns:252px minmax(0,1fr)}
  .account-sidebar{padding-right:20px}
  .panel-body{padding-inline:34px}
  .account-grid{grid-template-columns:1fr 1fr}
  .account-grid>div:nth-child(2){border-right:0}
  .account-grid>div:last-child{grid-column:1/-1;border-top:1px solid var(--line)}
}
@media(max-width:760px){
  .account-panel{grid-template-rows:var(--header-height-mobile) minmax(0,1fr)}
  .panel-head{grid-template-columns:auto 1fr;padding:0 16px;gap:14px}
  .account-wordmark{font-size:21px}
  .account-panel__context{display:none}
  .account-panel__actions{justify-self:end}
  .account-panel__actions a{width:42px;padding:0;overflow:hidden;color:transparent;gap:0}
  .account-panel__actions a svg{color:var(--blue);flex:0 0 auto}
  .account-panel__actions button{padding-inline:12px}
  .account-shell{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr)}
  .account-sidebar{display:grid;gap:12px;padding:14px 16px;border-right:0;border-bottom:1px solid var(--line)}
  .account-profile-card{display:none}
  .panel-tabs{grid-template-columns:repeat(4,minmax(142px,1fr));gap:6px;overflow-x:auto;scrollbar-width:thin}
  .panel-tabs button{min-height:53px;padding:9px 10px}
  .panel-tabs button small,.panel-tabs button>svg:last-child{display:none}
  .account-sidebar__note,.account-sidebar__logout{display:none}
  .panel-body{padding:28px 16px 52px}
  .telegram-link-confirm{padding:18px}.telegram-link-confirm__actions{display:grid;grid-template-columns:1fr}.telegram-link-confirm__actions .notched-button{width:100%}.telegram-account-row{grid-template-columns:auto 1fr}.telegram-account-row>a,.telegram-account-row__actions{grid-column:1/-1;justify-self:stretch}.telegram-account-row__actions button{flex:1}
  .account-section-heading{margin-bottom:22px;padding-bottom:19px}
  .account-section-heading h1{font-size:29px}
  .account-section-heading p{font-size:13px}
  .account-grid{grid-template-columns:1fr}
  .account-grid>div,.account-grid>div:nth-child(2),.account-grid>div:last-child{min-height:0;grid-column:auto;border-right:0;border-bottom:1px solid var(--line);border-top:0}
  .account-grid>div:last-child{border-bottom:0}
  .usage-list{grid-template-columns:1fr}
  .history-list>div{grid-template-columns:1fr auto}
  .history-list em{grid-column:span 2}
  .access-plan-choice{grid-template-columns:1fr}
}
@media(max-width:430px){
  .account-panel__actions button{width:42px;padding:0;overflow:hidden;color:transparent;gap:0}
  .account-panel__actions button svg{color:#fff;flex:0 0 auto}
  .panel-tabs{grid-template-columns:repeat(4,minmax(124px,1fr))}
  .panel-tabs button{gap:8px}
}

.password-reset-page{min-height:100vh;display:grid;grid-template-rows:auto 1fr;gap:32px;padding:30px;background:var(--page)}.password-reset-page__brand{justify-self:start;font-family:var(--font-display);font-size:24px;font-weight:700;letter-spacing:-.05em;color:var(--ink);text-decoration:none}.password-reset-card{align-self:center;justify-self:center;width:min(560px,100%);display:grid;gap:18px;padding:38px;color:var(--ink);background:var(--surface-strong);border:1px solid var(--line);box-shadow:var(--shadow-lg);clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%)}.password-reset-card__icon{width:58px;height:58px;display:grid;place-items:center;color:var(--blue);background:var(--blue-soft)}.password-reset-card h1{margin:0;font-family:var(--font-display);font-size:clamp(27px,4vw,40px);line-height:1.08;letter-spacing:-.05em}.password-reset-card>p,.password-reset-card form>p{margin:0;color:var(--muted);line-height:1.55}.password-reset-card form{display:grid;gap:14px}.password-reset-card .notched-button{justify-content:center;width:100%}.password-reset-card>small{color:var(--muted);line-height:1.45}.password-reset-rules{display:flex;gap:8px;flex-wrap:wrap}.password-reset-rules span{padding:6px 9px;color:var(--muted);background:var(--surface);border:1px solid var(--line);font-size:11px}.password-reset-rules span.is-ready{color:var(--success);border-color:color-mix(in srgb,var(--success) 45%,var(--line));background:color-mix(in srgb,var(--success) 8%,var(--surface))}.password-reset-error{padding:11px 13px;color:#9b3029;background:#fff2f0;border:1px solid #e3aaa4;font-size:13px;line-height:1.45}@media(max-width:620px){.password-reset-page{padding:18px}.password-reset-card{padding:28px 22px}}

.access-plan-choice__price{display:flex;align-items:baseline;gap:7px}.access-plan-choice__price del{color:var(--muted);font-family:var(--font-ui);font-size:11px;font-weight:500;text-decoration-thickness:1.5px}.access-plan-choice__price b{color:var(--coral);font:inherit}.access-plan-choice em{color:var(--coral);font-size:10px;font-style:normal;font-weight:600;text-transform:uppercase;letter-spacing:.05em}

/* Прямой checkout: один экран между выбором тарифа и платёжной системой. */
.checkout-route{width:min(1120px,calc(100% - 64px));min-height:calc(100vh - 190px);margin:0 auto;padding:42px 0 80px}
.checkout-back{display:inline-flex;margin-bottom:22px;color:var(--muted);font-size:13px;font-weight:600}
.checkout-back:hover{color:var(--blue)}
.checkout-card{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);overflow:hidden;border:1px solid var(--line);background:var(--surface-strong);box-shadow:var(--shadow-soft);clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%)}
.checkout-card__main{padding:44px 48px}
.checkout-card__main .eyebrow{display:flex;align-items:center;gap:8px}
.checkout-card h1{margin:20px 0 6px;font-family:var(--font-display);font-size:clamp(28px,4vw,48px);letter-spacing:-.05em;line-height:1.08}
.checkout-card h1 span{display:block;margin-top:8px;color:var(--muted);font-family:var(--font-ui);font-size:16px;font-weight:500;letter-spacing:0}
.checkout-price{margin:0 0 28px;font-family:var(--font-display);font-size:31px;font-weight:600;letter-spacing:-.04em}
.checkout-status{display:flex;align-items:center;gap:14px;min-height:82px;padding:17px 18px;border:1px solid var(--line);background:var(--surface)}
.checkout-status>div{display:grid;gap:5px}.checkout-status strong{font-size:14px}.checkout-status span{color:var(--muted);font-size:13px;line-height:1.5}.checkout-status--error{border-color:#dca49b;background:#fff7f5}
.checkout-status--paid{border-color:color-mix(in srgb,var(--success) 48%,var(--line));background:color-mix(in srgb,var(--success) 8%,var(--surface))}.checkout-status--paid>svg{flex:0 0 auto;color:var(--success)}
.checkout-status--failed,.checkout-status--invalid{border-color:#dca49b;background:#fff7f5}
.checkout-status--delayed,.checkout-status--unavailable{border-color:color-mix(in srgb,var(--coral) 42%,var(--line));background:color-mix(in srgb,var(--coral) 7%,var(--surface))}
.checkout-status--pending{border-color:color-mix(in srgb,var(--blue) 40%,var(--line));background:var(--blue-soft)}
.checkout-spinner{width:23px;height:23px;flex:0 0 auto;border:2px solid var(--line);border-top-color:var(--blue);border-radius:50%;animation:checkout-spin .8s linear infinite}
@keyframes checkout-spin{to{transform:rotate(360deg)}}
.checkout-actions{display:flex;align-items:center;gap:16px;margin-top:20px;flex-wrap:wrap}.checkout-actions .notched-button{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.checkout-link-button{padding:7px 0;border:0;color:var(--blue);background:none;font:inherit;font-size:13px;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.checkout-sbp-note{max-width:620px;margin:18px 0 0;color:var(--muted);font-size:12.5px;line-height:1.55}
.checkout-summary{display:grid;align-content:start;gap:20px;padding:44px 34px;background:var(--blue-soft);border-left:1px solid var(--line)}
.checkout-summary>span{font-family:var(--font-display);font-size:16px;font-weight:600}.checkout-summary ul{display:grid;gap:13px;margin:0;padding:0;list-style:none}.checkout-summary li{display:grid;grid-template-columns:auto 1fr;align-items:start;gap:9px;font-size:13.5px;line-height:1.45}.checkout-summary li svg{color:var(--blue)}
.checkout-safe{display:grid;grid-template-columns:auto 1fr;gap:11px;padding:15px;background:var(--surface-strong);border-left:3px solid var(--blue);font-size:12.5px;line-height:1.5}.checkout-safe svg{color:var(--blue)}
.checkout-summary>p{margin:0;color:var(--muted);font-size:11.5px;line-height:1.55}.checkout-summary a{color:var(--blue);text-decoration:underline;text-underline-offset:2px}.auth-checkout-context{margin:-4px 0 4px;color:var(--muted);font-size:13px;line-height:1.55}
@media(max-width:820px){.checkout-route{width:calc(100% - 32px);padding:28px 0 56px}.checkout-card{grid-template-columns:1fr}.checkout-card__main{padding:32px 24px}.checkout-summary{padding:28px 24px;border-left:0;border-top:1px solid var(--line)}.checkout-actions{align-items:stretch;flex-direction:column}.checkout-actions .notched-button,.checkout-link-button{width:100%;text-align:center}}
@media(prefers-reduced-motion:reduce){.checkout-spinner{animation-duration:1.6s}}