/* ==========================================================================
   urlik.xyz UI 2 — group "work": bulk, domains, webhooks, referrals,
   tracker, bio editor + public bio page, link-in-bio landing.
   Only var(--…) tokens from ui.css; no hard-coded state colours.
   ========================================================================== */

/* ---------- shared bits ---------- */
.w-sec-title{ font-size:15.5px; font-weight:650; display:flex; align-items:center; gap:8px; }
.w-kpi-note{ font-size:12px; color:var(--ink-3); }
.w-mono-cell{ font-family:var(--mono); font-size:13px; overflow-wrap:anywhere; }
.w-num-steps{ list-style:none; margin:0; padding:0; counter-reset:ws; display:flex; flex-direction:column; }
.w-num-steps>li{ counter-increment:ws; position:relative; padding:12px 0 12px 44px; border-top:1px solid var(--line); font-size:14.5px; color:var(--ink-2); line-height:1.5; }
.w-num-steps>li:first-child{ border-top:0; }
.w-num-steps>li::before{ content:counter(ws); position:absolute; left:0; top:10px; width:28px; height:28px; border-radius:50%; display:grid; place-items:center; font:700 12.5px/1 var(--mono); background:var(--acc-soft); color:var(--acc-ink); border:1px solid var(--acc-line); }
.w-num-steps code,.w-code-inline{ font-family:var(--mono); font-size:.9em; background:var(--bg-2); border:1px solid var(--line); border-radius:5px; padding:1px 5px; color:var(--ink); overflow-wrap:anywhere; }
.w-danger{ border-color:var(--bad-line); }
.w-danger .card-head{ border-bottom-color:var(--bad-line); }
.w-danger .card-head h2,.w-danger .card-head h3{ color:var(--bad); }
.w-tabs-scroll{ overflow-x:auto; scrollbar-width:none; }
.w-tabs-scroll::-webkit-scrollbar{ display:none; }
.w-copyrow{ display:flex; gap:8px; align-items:center; min-width:0; }
.w-copyrow .copybox{ flex:1; }
.w-state{ display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:600; color:var(--ink-2); white-space:nowrap; }
.w-side-sticky{ position:sticky; top:calc(var(--head-h) + 16px); }
@media (max-width:960px){ .w-side-sticky{ position:static; } }
.w-grid-main{ display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:20px; align-items:start; }
@media (max-width:1100px){ .w-grid-main{ grid-template-columns:1fr; } }

/* ==========================================================================
   BULK
   ========================================================================== */
.bk-in{ display:flex; flex-direction:column; overflow:hidden; }
.bk-drop{ position:relative; }
.bk-ta{ display:block; width:100%; min-height:300px; border:0; border-bottom:1px solid var(--line); resize:vertical; padding:16px 18px; background:var(--surface-2);
  font:14px/1.7 var(--mono); color:var(--ink); outline:none; tab-size:2; white-space:pre; overflow:auto; }
.bk-ta:focus{ background:var(--surface); box-shadow:inset 0 0 0 2px var(--acc-line); }
.bk-ta::placeholder{ color:var(--ink-4); }
.bk-drop-hint{ position:absolute; inset:8px; border:2px dashed var(--ok); border-radius:var(--r); background:color-mix(in srgb,var(--surface) 86%,transparent); display:none; flex-direction:column; align-items:center; justify-content:center; gap:10px; pointer-events:none; color:var(--ink); }
.bk-drop.is-over .bk-drop-hint{ display:flex; }
.bk-check .stats-strip{ border-bottom:1px solid var(--line); }
.bk-check .stat{ padding:12px 16px; }
.bk-check .stat-value{ font-size:22px; }
.bk-issues{ padding:12px 16px; border-bottom:1px solid var(--line); }
.bk-issues-head{ margin-bottom:8px; }
.bk-issues-head .i{ color:var(--warn); vertical-align:-3px; }
.bk-issue-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px; }
.bk-issue-list li{ display:grid; grid-template-columns:32px minmax(0,1fr) auto; gap:10px; align-items:center; font-size:13px; padding:4px 0; }
.bk-cap{ padding:12px 16px; }
.bk-meter{ display:flex; flex-direction:column; gap:6px; }
.bk-side .btn-block{ width:100%; }
.bk-res:focus{ outline:none; }
.bk-res td .clamp-1{ max-width:420px; display:block; }
@media (max-width:760px){ .bk-ta{ min-height:220px; font-size:13.5px; } .bk-res td .clamp-1{ max-width:100%; } }

/* ==========================================================================
   DOMAINS
   ========================================================================== */
.dm-host{ font-size:17px; font-weight:650; font-family:var(--mono); letter-spacing:-.01em; }
.dm-dns td{ vertical-align:middle; }
.dm-val{ display:inline-flex; align-items:center; gap:4px; min-width:0; max-width:100%; }
.dm-val code{ font:13px/1.4 var(--mono); color:var(--ink); background:var(--bg-2); border:1px solid var(--line); border-radius:6px; padding:3px 7px; overflow-wrap:anywhere; }
.dm-item .card-body .hint .i{ vertical-align:-3px; }
.table-wrap.bordered{ overflow:hidden; }

/* ==========================================================================
   WEBHOOKS
   ========================================================================== */
.wh-url{ font:600 15px/1.35 var(--mono); letter-spacing:-.01em; }
.wh-item.is-off{ background:var(--surface-2); }
.wh-item.is-off .wh-url{ color:var(--ink-3); }
.wh-item .kv{ align-items:center; }
.wh-secret{ max-width:520px; }
.wh-secret .input{ font-family:var(--mono); font-size:13px; }
.wh-log-url{ max-width:240px; display:block; font-family:var(--mono); font-size:12.5px; }
#wh-code .code pre{ font-size:12.5px; }
@media (max-width:760px){ .wh-log-url{ max-width:100%; } }

/* ==========================================================================
   REFERRALS
   ========================================================================== */
.rf-hero{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:24px; align-items:center; padding:clamp(18px,3vw,28px); }
.rf-hero .copybox{ max-width:640px; background:var(--surface); }
.rf-qr{ display:flex; flex-direction:column; align-items:center; gap:6px; }
.rf-qr img{ width:132px; height:132px; padding:8px; background:#fff; border-radius:var(--r); border:1px solid var(--line); image-rendering:pixelated; }
@media (max-width:760px){ .rf-hero{ grid-template-columns:1fr; } .rf-qr{ flex-direction:row; justify-content:flex-start; } .rf-qr img{ width:96px; height:96px; } }
.rf-levels{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:12px; }
.rf-lvl{ display:flex; flex-direction:column; gap:8px; padding:14px; border:1px solid var(--line); border-radius:var(--r); background:var(--surface-2); position:relative; }
.rf-lvl:first-child{ border-color:var(--acc-line); background:var(--acc-soft); }
.rf-rate{ font-size:26px; font-weight:750; letter-spacing:-.03em; color:var(--ink); }
.rf-lvl-foot{ padding-top:8px; border-top:1px dashed var(--line-2); margin-top:auto; }
.rf-down{ max-height:420px; overflow-y:auto; }
.rf-rules li{ font-size:13.5px; }

/* ==========================================================================
   TRACKER
   ========================================================================== */
.tr-back{ display:inline-flex; align-items:center; gap:6px; margin-bottom:10px; }
.app-page-head p .w-state,.app-page-head p .shortcode,.app-page-head p .badge{ vertical-align:middle; }
.app-page-head p .shortcode{ font-size:13px; margin-left:8px; }
.tr-kpis{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; }
.tr-kpis .stat-value{ font-size:24px; }
.tr-profit.is-ok{ border-color:var(--ok-line); background:linear-gradient(180deg,var(--ok-soft),var(--surface) 80%); }
.tr-profit.is-bad{ border-color:var(--bad-line); background:linear-gradient(180deg,var(--bad-soft),var(--surface) 80%); }
.tr-profit.is-ok .stat-value{ color:var(--ok); } .tr-profit.is-bad .stat-value{ color:var(--bad); }
@media (max-width:1200px){ .tr-kpis{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:640px){ .tr-kpis{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; } .tr-kpis .stat{ padding:12px 14px; } .tr-kpis .stat-value{ font-size:20px; } }
.tr-chart-lbl{ margin-bottom:6px; }
.tr-k{ font-size:14px; color:var(--ink); overflow-wrap:anywhere; }
.tr-share{ height:3px; border-radius:3px; background:var(--bg-2); margin-top:6px; max-width:220px; overflow:hidden; }
.tr-share>span{ display:block; height:100%; width:var(--v,0%); background:var(--acc); border-radius:inherit; }
.tr-table td{ white-space:nowrap; }
.tr-table td:first-child{ white-space:normal; min-width:160px; }
.tr-name{ font-weight:650; color:var(--ink); font-size:15px; }
.tr-name:hover{ color:var(--acc-ink); }
.tr-code{ display:inline-flex; align-items:center; gap:4px; border:0; background:none; padding:0; color:var(--ink-3); font-size:12.5px; cursor:pointer; }
.tr-code:hover{ color:var(--ink); }
.tr-code .i{ width:13px; height:13px; }
.table tr.is-off td{ color:var(--ink-3); }
.table tr.is-off .tr-name{ color:var(--ink-2); }
.tr-streams-hint{ padding:10px 18px 0; }
.tr-dest{ max-width:360px; }
.tr-w{ min-width:110px; }
.tr-w .meter{ margin-top:6px; height:4px; }
.tr-macro-chips .chip{ height:28px; font-size:12.5px; font-family:var(--mono); padding:0 10px; }
.tr-macros .list-item{ width:100%; border-left:0; border-right:0; border-top:0; background:none; text-align:left; padding:8px 16px; gap:10px; cursor:pointer; }
.tr-macros .list-item:hover{ background:var(--surface-2); }
.tr-macros .list-item .i{ color:var(--ink-4); flex:none; }
.tr-macros code{ flex:none; }
.tr-side .copybox .val{ font-size:12.5px; white-space:normal; overflow-wrap:anywhere; }
.tr-intro{ padding:clamp(20px,4vw,40px); }
.tr-intro .split{ align-items:start; }
@media (max-width:760px){ .tr-table td{ white-space:normal; } .tr-dest{ max-width:100%; } .table-stack .tr-w .meter{ max-width:200px; } }

/* ==========================================================================
   BIO — themes ( shared by the public page, the editor preview, swatches
   and the landing mock ). These are the user's page palettes, not UI state.
   ========================================================================== */
.bio-t-light { --bio-bg:radial-gradient(120% 120% at 50% 0%,#fff7ec,#ffe8db 60%,#ffd9c6); --bio-ink:#1d1510; --bio-ink-2:#6d5d52; --bio-btn:rgba(255,255,255,.86); --bio-btn-ink:#1d1510; --bio-line:rgba(29,21,16,.08); --bio-ava:linear-gradient(135deg,#ff9a3c,#f25c05); --bio-dot:#f25c05; }
.bio-t-dark  { --bio-bg:radial-gradient(120% 120% at 50% 0%,#2a241e,#15110e); --bio-ink:#f3ede6; --bio-ink-2:#b8aca0; --bio-btn:rgba(52,46,40,.85); --bio-btn-ink:#f3ede6; --bio-line:rgba(255,255,255,.08); --bio-ava:linear-gradient(135deg,#ff9a3c,#e0400a); --bio-dot:#ff9a3c; }
.bio-t-ocean { --bio-bg:radial-gradient(120% 120% at 50% 0%,#e6f1ff,#cfe4ff 58%,#a8ccff); --bio-ink:#0b1f3a; --bio-ink-2:#4a5f7d; --bio-btn:rgba(255,255,255,.88); --bio-btn-ink:#0b1f3a; --bio-line:rgba(11,31,58,.08); --bio-ava:linear-gradient(135deg,#3b82f6,#0ea5e9); --bio-dot:#3b82f6; }
.bio-t-sunset{ --bio-bg:radial-gradient(120% 120% at 50% 0%,#fff1f2,#ffe0e6 55%,#ffc9d6); --bio-ink:#3b0d1a; --bio-ink-2:#7d4b58; --bio-btn:rgba(255,255,255,.88); --bio-btn-ink:#3b0d1a; --bio-line:rgba(59,13,26,.08); --bio-ava:linear-gradient(135deg,#fb7185,#f97316); --bio-dot:#fb7185; }
.bio-t-forest{ --bio-bg:radial-gradient(120% 120% at 50% 0%,#1d3326,#0c1811); --bio-ink:#e8f5ec; --bio-ink-2:#9dbba7; --bio-btn:rgba(35,58,44,.86); --bio-btn-ink:#e8f5ec; --bio-line:rgba(255,255,255,.08); --bio-ava:linear-gradient(135deg,#34d399,#059669); --bio-dot:#34d399; }
.bio-t-grape { --bio-bg:radial-gradient(120% 120% at 50% 0%,#2e2143,#130e1c); --bio-ink:#f1eafc; --bio-ink-2:#b5a6cf; --bio-btn:rgba(55,40,78,.86); --bio-btn-ink:#f1eafc; --bio-line:rgba(255,255,255,.08); --bio-ava:linear-gradient(135deg,#a855f7,#7c3aed); --bio-dot:#a855f7; }
.bio-t-mono  { --bio-bg:radial-gradient(120% 120% at 50% 0%,#f7f7f8,#e6e6e9 60%,#d6d6db); --bio-ink:#18181b; --bio-ink-2:#5f5f66; --bio-btn:#ffffff; --bio-btn-ink:#18181b; --bio-line:rgba(24,24,27,.12); --bio-ava:linear-gradient(135deg,#52525b,#27272a); --bio-dot:#27272a; }

/* public page + preview body */
body.shell-none{ margin:0; background:var(--bg); }
.bio-page{ background:var(--bio-bg); padding:max(40px,env(safe-area-inset-top)) 16px max(32px,env(safe-area-inset-bottom)); }
.bio-card{ gap:10px; }
.bio-top{ width:100%; display:flex; justify-content:flex-end; margin-bottom:-18px; }
.bio-share{ width:40px; height:40px; border-radius:50%; display:grid; place-items:center; border:1px solid var(--bio-line); background:var(--bio-btn); color:var(--bio-btn-ink); cursor:pointer; backdrop-filter:blur(8px); }
.bio-share.is-ok{ box-shadow:0 0 0 3px var(--bio-dot); }
.bio-share .i{ width:18px; height:18px; }
.bio-ava{ width:96px; height:96px; border-radius:50%; object-fit:cover; display:grid; place-items:center; background:var(--bio-ava); color:#fff; font-size:38px; font-weight:750; box-shadow:0 14px 34px -12px rgba(0,0,0,.35); border:3px solid rgba(255,255,255,.7); }
.bio-ava .i{ width:38px; height:38px; }
.bio-name{ font-size:24px; font-weight:750; letter-spacing:-.02em; color:var(--bio-ink); margin-top:6px; overflow-wrap:anywhere; }
.bio-handle{ font:500 14px/1.2 var(--mono); color:var(--bio-ink-2); margin-top:-4px; }
.bio-text{ font-size:15.5px; line-height:1.55; color:var(--bio-ink-2); max-width:42ch; overflow-wrap:anywhere; white-space:pre-line; }
.bio-link{ position:relative; background:var(--bio-btn); color:var(--bio-btn-ink); border-color:var(--bio-line); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); padding-inline:52px; text-decoration:none; overflow-wrap:anywhere; }
.bio-link>.i{ position:absolute; left:18px; top:50%; transform:translateY(-50%); width:20px; height:20px; opacity:.75; }
.bio-link:focus-visible{ outline:3px solid var(--bio-dot); outline-offset:2px; }
.bio-link.is-ghost{ background:transparent; border-style:dashed; opacity:.7; }
.bio-foot{ display:inline-flex; align-items:center; gap:6px; margin-top:26px; font-size:13px; font-weight:600; color:var(--bio-ink-2); text-decoration:none; opacity:.85; }
.bio-foot .i{ width:14px; height:14px; }
.bio-foot:hover{ opacity:1; }
.bio-404 .bio-ava{ background:var(--bio-ava); }

/* ==========================================================================
   BIO EDITOR
   ========================================================================== */
.bio-ed{ display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:24px; align-items:start; max-width:1280px; margin:0 auto; }
@media (max-width:1100px){ .bio-ed{ grid-template-columns:minmax(0,1fr) 320px; } }
@media (max-width:960px){ .bio-ed{ grid-template-columns:1fr; } .bio-ed-prev{ order:-1; } }
.bio-ed-prev{ position:sticky; top:calc(var(--head-h) + 16px); display:flex; flex-direction:column; gap:10px; }
@media (max-width:960px){ .bio-ed-prev{ position:static; } .bio-ed-prev .bio-phone{ max-height:520px; } }

.bio-phone{ width:100%; max-width:340px; margin:0 auto; border-radius:40px; padding:10px; background:#0b0d10; box-shadow:var(--sh-3),inset 0 0 0 1px rgba(255,255,255,.08); overflow:hidden; }
.bio-phone-bar{ height:30px; display:flex; align-items:center; justify-content:center; font-size:11.5px; color:rgba(255,255,255,.72); }
.bio-phone .bio-page{ min-height:560px; max-height:640px; overflow-y:auto; border-radius:30px; padding:32px 16px 24px; scrollbar-width:none; }
.bio-phone .bio-page::-webkit-scrollbar{ display:none; }
.bio-page.is-preview .bio-ava{ width:72px; height:72px; font-size:28px; }
.bio-page.is-preview .bio-name{ font-size:19px; }
.bio-page.is-preview .bio-text{ font-size:13.5px; }
.bio-page.is-preview .bio-link{ min-height:44px; font-size:13.5px; padding:10px 42px; }
.bio-page.is-preview .bio-link>.i{ left:14px; width:17px; height:17px; }
.bio-page.is-preview .bio-link:hover{ transform:none; box-shadow:none; }
.bio-page.is-preview .bio-foot{ margin-top:18px; font-size:12px; }
.bio-page{ transition:background .3s; }

.bio-themes{ display:grid; grid-template-columns:repeat(auto-fill,minmax(96px,1fr)); gap:10px; }
.bio-sw{ position:relative; display:flex; flex-direction:column; gap:6px; cursor:pointer; }
.bio-sw input{ position:absolute; opacity:0; pointer-events:none; }
.bio-sw-art{ height:74px; border-radius:var(--r); background:var(--bio-bg); border:1px solid var(--line); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; transition:box-shadow .12s,transform .12s var(--ease); }
.bio-sw-art i{ display:block; width:62%; height:10px; border-radius:5px; background:var(--bio-btn); border:1px solid var(--bio-line); }
.bio-sw-art i:first-child{ width:18px; height:18px; border-radius:50%; background:var(--bio-ava); border:0; }
.bio-sw-name{ font-size:12.5px; font-weight:600; color:var(--ink-2); text-align:center; }
.bio-sw:hover .bio-sw-art{ transform:translateY(-1px); }
.bio-sw input:checked+.bio-sw-art{ box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--acc); }
.bio-sw input:checked~.bio-sw-name{ color:var(--ink); }
.bio-sw input:focus-visible+.bio-sw-art{ box-shadow:var(--ring); }

.bio-list{ list-style:none; margin:0; padding:0; }
.bio-row{ display:flex; align-items:center; gap:10px; padding:10px 12px 10px 6px; border-bottom:1px solid var(--line); background:var(--surface); transition:background .15s,box-shadow .15s; }
.bio-row:last-child{ border-bottom:0; }
.bio-row:hover{ background:var(--surface-2); }
.bio-row.is-drag{ opacity:.55; background:var(--acc-soft); }
.bio-row.is-moved{ background:var(--acc-soft); }
.bio-grip{ width:28px; height:36px; display:grid; place-items:center; color:var(--ink-4); cursor:grab; flex:none; touch-action:none; }
.bio-grip:active{ cursor:grabbing; }
.bio-row-main{ flex:1; min-width:0; display:flex; flex-direction:column; gap:1px; }
.bio-row-main b{ font-size:14.5px; color:var(--ink); }
.bio-row-clicks{ display:flex; flex-direction:column; align-items:flex-end; min-width:48px; line-height:1.2; }
.bio-row-acts{ display:flex; align-items:center; gap:0; flex:none; }
.bio-row-acts form{ display:inline; }
@media (max-width:640px){
  .bio-row{ flex-wrap:wrap; padding-right:8px; }
  .bio-row-main{ flex-basis:calc(100% - 100px); }
  .bio-row-acts{ width:100%; justify-content:flex-end; padding-left:30px; }
}
.bio-add{ padding:14px 18px 18px; border-top:1px solid var(--line); background:var(--surface-2); border-radius:0 0 var(--r-lg) var(--r-lg); }
.bio-add-grid{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr) auto; gap:10px; align-items:end; }
@media (max-width:760px){ .bio-add-grid{ grid-template-columns:1fr; } }
.bio-qr-box{ background:#fff; padding:12px; border-radius:14px; border:1px solid var(--line); }
.bio-qr-box img{ display:block; image-rendering:pixelated; }

/* ==========================================================================
   LINK-IN-BIO LANDING
   ========================================================================== */
.lb-hero{ position:relative; isolation:isolate; padding:clamp(24px,4vw,48px) 0 clamp(24px,4vw,56px); }
.lb-split{ margin-top:clamp(16px,3vw,36px); }
.lb-copy .h-display{ max-width:14ch; }
.lb-claim{ display:flex; gap:8px; max-width:560px; flex-wrap:wrap; }
.lb-claim .input-group{ flex:1 1 280px; border-radius:12px; }
.lb-claim .input-group .addon{ font-size:15px; padding-left:14px; color:var(--ink-2); }
.lb-claim .input-lg{ padding-left:0; }
.lb-claim .btn-lg{ flex:none; }
@media (max-width:520px){ .lb-claim .btn-lg{ width:100%; } }
.lb-stage{ position:relative; display:flex; flex-direction:column; align-items:center; gap:14px; padding:12px 0; }
.lb-phone{ max-width:320px; transform:rotate(-2deg); }
.lb-phone .bio-page{ min-height:520px; }
.lb-themes{ display:flex; gap:8px; }
.lb-theme{ width:26px; height:26px; border-radius:50%; border:2px solid var(--surface); background:var(--bio-ava); box-shadow:var(--sh-2); cursor:pointer; padding:0; }
.lb-theme.is-on{ box-shadow:0 0 0 2px var(--acc); }
.lb-float{ position:absolute; display:flex; align-items:center; gap:10px; padding:10px 14px 10px 10px; box-shadow:var(--sh-3); border-radius:14px; }
.lb-float small{ display:block; font-size:12px; color:var(--ink-3); }
.lb-float b{ display:block; font-size:15px; line-height:1.2; }
.lb-float-1{ left:max(0px,calc(50% - 260px)); top:24%; animation:lbf 6s ease-in-out infinite; }
.lb-float-2{ right:max(0px,calc(50% - 250px)); bottom:22%; animation:lbf 6s ease-in-out -3s infinite; }
@keyframes lbf{ 50%{ transform:translateY(-8px); } }
@media (prefers-reduced-motion:reduce){ .lb-float{ animation:none; } }
@media (max-width:960px){ .lb-float{ display:none; } .lb-phone{ transform:none; } }
.lb-sw{ width:34px; height:34px; border-radius:10px; background:var(--bio-bg); border:1px solid var(--line); position:relative; }
.lb-sw::after{ content:""; position:absolute; left:50%; top:50%; width:12px; height:12px; margin:-6px 0 0 -6px; border-radius:50%; background:var(--bio-ava); }
.lb-benefits .h4{ font-size:17px; }
.cta-band .row>div:first-child{ max-width:560px; }
.bk-tips li{ font-size:13.5px; color:var(--ink-3); }
.bio-themes{ grid-template-columns:repeat(auto-fill,minmax(84px,1fr)); }
.tr-macro-subs{ gap:10px; padding:8px 16px; }
.tr-macro-subs button.w-code-inline{ cursor:pointer; }
.tr-macro-subs button.w-code-inline:hover{ border-color:var(--acc-line); color:var(--acc-ink); }
.tr-macro-subs{ flex-wrap:wrap; }
.tr-macro-subs .li-main{ flex-basis:100%; }
.tr-side .copybox{ flex-wrap:wrap; }
.tr-side .copybox .val{ flex-basis:100%; }
.tr-side .copybox .btn{ margin-left:auto; }
.w-grid-main>*,.rf-hero>*,.bio-ed>*,.workbench.bk>*{ min-width:0; }
