/* Search Console mockups (spec 0.82). Tokens copied verbatim from dashboard/app/app.css (:root, .dark, .accent-yellow)
   on 2026-10-31. Component classes mirror the Tailwind classes of the real components (SubNav, StatTile, SectionCard,
   Card, Button, Badge, EmptyState, Dialog, TrafficAreaChart, LaunchChecklist, NeedsYouRail); the class comment names
   the source. Mockup-only chrome (frame labels, gallery) is prefixed .mk-. No raw colour below the token block except
   the Google "G" brand mark (copied from components/google-button.tsx). */

:root {
  --background:#faf9f7; --foreground:#1c1917; --card:#ffffff; --card-foreground:#1c1917; --popover:#ffffff;
  --muted:#f4f3f0; --muted-foreground:#6f6760; --secondary:#efeeea; --secondary-foreground:#292524;
  --accent:#efeeea; --accent-foreground:#1c1917; --border:#e8e6e2; --input:#e1dfda;
  --destructive:#bb342a; --destructive-foreground:#ffffff;
  --success:#4f7d5b; --success-foreground:#ffffff; --success-muted:#eaf1ec; --success-muted-foreground:#3f6a4b;
  --danger-muted:#f8ebe9; --danger-muted-foreground:#9a382c; --warning-muted:#f6efe2; --warning-muted-foreground:#856023;
  --shared:#565f91; --shared-foreground:#ffffff; --shared-muted:#eff0fa;
  --suggestion:#7a5a00; --suggestion-border:#e0b400; --suggestion-muted:#fffbea; --suggestion-pill:#fff1b8;
  --suggestion-solid:#ffcb05; --suggestion-solid-foreground:#1c1917; --plan-gold:#8a6500;
  --publish:#1c1917; --publish-foreground:#ffffff; --publish-hover:#36312d; --publish-count:#ffcb05; --publish-count-foreground:#1c1917;
  --primary:#ffcb05; --primary-foreground:#1c1917; --ring:#a67c00;
  --radius:0.625rem;
  --topbar-row:3rem; --topbar-height:var(--topbar-row); --tabs-row:3.375rem; --sidebar-width:14.5rem; --target-min:2.75rem;
  --font-sans:"Inter", ui-sans-serif, system-ui, "Segoe UI", sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
}
.dark {
  --background:#0a0a0b; --foreground:#ededed; --card:#141416; --card-foreground:#ededed; --popover:#161618;
  --muted:#1a1a1d; --muted-foreground:#8f8f96; --secondary:#202023; --secondary-foreground:#ededed;
  --accent:#202023; --accent-foreground:#ededed; --border:#27272a; --input:#2c2c30; --destructive:#cf3f3f;
  --success:#6fae82; --success-foreground:#0a0a0b; --success-muted:#16241b; --success-muted-foreground:#86c79a;
  --danger-muted:#271513; --danger-muted-foreground:#e8a89d; --warning-muted:#241d10; --warning-muted-foreground:#d9b677;
  --shared:#a9b1e3; --shared-muted:#1d2033; --suggestion:#f0cf6a; --suggestion-muted:#241d10; --plan-gold:#f0cf6a;
  --publish:#ededed; --publish-foreground:#0a0a0b; --publish-hover:#ffffff; --publish-count:#0a0a0b; --publish-count-foreground:#ffcb05;
}

* { box-sizing:border-box; }
html, body { margin:0; }
body { background:var(--background); color:var(--foreground); font:14px/1.5 var(--font-sans);
  -webkit-font-smoothing:antialiased; font-feature-settings:"cv11","ss01"; }
button { font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; }
a { color:inherit; text-decoration:none; }
h1,h2,h3,p,ul { margin:0; padding:0; } ul { list-style:none; }
svg.i { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
svg.i.s3 { width:12px; height:12px; } svg.i.s35 { width:14px; height:14px; } svg.i.s8 { width:32px; height:32px; stroke-width:1.5; }
.mono { font-family:var(--font-mono); }
.muted { color:var(--muted-foreground); }
.xs { font-size:12px; line-height:16px; } .sm { font-size:14px; line-height:20px; }
.fw5 { font-weight:500; } .fw6 { font-weight:600; }
.tab { font-variant-numeric:tabular-nums; }
.row { display:flex; align-items:center; gap:8px; } .grow { flex:1; min-width:0; } .ml-auto { margin-left:auto; }
.trunc { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.stack > * + * { margin-top:24px; }
.up { color:var(--success); } .down { color:var(--muted-foreground); }
.link { font-weight:500; color:var(--foreground); text-decoration:underline; text-underline-offset:2px; text-decoration-color:var(--input); }
.link:hover { text-decoration-color:currentColor; }

/* ---------- shell: top-bar.tsx + site-sidebar.tsx + sites.$slug.tsx page column ---------- */
.app { min-height:100vh; }
.topbar { position:sticky; top:0; z-index:40; height:var(--topbar-height); background:var(--card); border-bottom:1px solid var(--border);
  display:flex; align-items:center; gap:4px; padding:0 16px; }
.glyph { width:30px; height:30px; border-radius:23.607%; background:var(--primary); position:relative; flex-shrink:0; }
.glyph::after { content:""; position:absolute; inset:30.9%; border-radius:50%; background:#1c1917; }
.glyph-link { padding:3px; border-radius:8px; display:inline-flex; }
.slash { width:16px; height:16px; stroke:var(--input); stroke-width:1.5; fill:none; flex-shrink:0; }
.crumb { display:inline-flex; align-items:center; gap:8px; height:28px; padding:0 6px; border-radius:8px; font-size:14px; font-weight:500; }
.itile { width:20px; height:20px; border-radius:5px; display:grid; place-items:center; font-size:10px; font-weight:600; background:var(--foreground); color:var(--card); flex-shrink:0; }
.itile.soft { background:var(--shared-muted); color:var(--shared); }
.capsule { display:flex; align-items:center; gap:6px; height:36px; padding:0 3px 0 4px; border:1px solid var(--border); border-radius:10px; background:var(--card); margin-left:4px; }
.capsule .name { display:inline-flex; align-items:center; gap:8px; height:28px; padding:0 6px; font-size:14px; font-weight:600; }
.capsule .vsep { width:1px; height:18px; background:var(--border); }
.capsule .state { display:inline-flex; align-items:center; gap:6px; padding:0 6px; font-size:13px; color:var(--success-muted-foreground); }
.capsule .host { font-family:var(--font-mono); font-size:12px; color:var(--muted-foreground); padding:0 4px; }
.sdot { width:8px; height:8px; border-radius:50%; background:var(--success); box-shadow:0 0 0 3px var(--success-muted); flex-shrink:0; }
.searchbox { display:flex; align-items:center; gap:8px; height:32px; width:260px; padding:0 10px; border:1px solid var(--border); border-radius:8px;
  background:var(--background); color:var(--muted-foreground); font-size:13px; margin-left:auto; }
kbd { font:500 11px var(--font-sans); border:1px solid var(--border); border-radius:4px; padding:0 4px; color:var(--muted-foreground); background:var(--card); margin-left:auto; }
.iconbtn { width:32px; height:32px; display:inline-grid; place-items:center; border-radius:8px; color:var(--foreground); }
.iconbtn:hover { background:var(--accent); }
.body { display:grid; grid-template-columns:var(--sidebar-width) minmax(0,1fr); }
.side { position:sticky; top:var(--topbar-height); height:calc(100vh - var(--topbar-height)); border-right:1px solid var(--border);
  background:var(--background); padding:8px; display:flex; flex-direction:column; }
.navi { display:flex; align-items:center; gap:10px; height:32px; padding:0 12px; border-radius:8px; font-size:14px; font-weight:500;
  letter-spacing:-0.01em; color:var(--muted-foreground); margin-bottom:2px; }
.navi.on { background:color-mix(in srgb, var(--primary) 15%, transparent); color:var(--foreground); }
.navi:not(.on):hover { background:var(--accent); color:var(--foreground); }
.side-foot { margin-top:auto; border-top:1px solid var(--border); padding-top:8px; display:flex; align-items:center; gap:8px; font-size:13px; }
.avatar { width:28px; height:28px; border-radius:50%; background:var(--shared-muted); color:var(--shared); font-size:11px; font-weight:600; display:grid; place-items:center; }
.main { padding:24px 32px; min-width:0; }
.col { max-width:1272px; margin:0 auto; }

/* ---------- SubNav tabs-as-title row (components/sub-nav.tsx) ---------- */
.tabsrow { position:sticky; top:var(--topbar-height); z-index:20; background:var(--background); display:flex; align-items:flex-end; gap:16px;
  min-height:var(--tabs-row); padding-top:8px; }
.tabs { display:flex; gap:24px; min-width:0; flex:1; }
.tabs > * { position:relative; display:inline-flex; align-items:center; gap:6px; padding-bottom:10px; font-size:20px; line-height:28px;
  font-weight:600; letter-spacing:-0.025em; color:var(--muted-foreground); white-space:nowrap; }
.tabs > .on { color:var(--foreground); }
.tabs > .on::after { content:""; position:absolute; left:0; bottom:0; width:16px; height:3px; border-radius:2px; background:var(--primary); }
.tabs .suffix { font-size:12px; line-height:16px; font-weight:500; letter-spacing:0; color:var(--muted-foreground); }
.tabsrow .actions { margin-left:auto; display:flex; align-items:center; gap:8px; padding-bottom:10px; flex-shrink:0; }
.intro { margin:8px 0 24px; font-size:14px; line-height:20px; color:var(--muted-foreground); }

/* ---------- Button (components/ui/button.tsx) ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; white-space:nowrap; border-radius:8px; font-size:14px;
  font-weight:500; height:36px; padding:0 16px; border:1px solid transparent; }
.btn.sm { height:32px; padding:0 12px; }
.btn svg.i { width:16px; height:16px; }
.btn.primary { background:var(--primary); color:var(--primary-foreground); }
.btn.publish { background:var(--publish); color:var(--publish-foreground); }
.btn.secondary { background:var(--card); border-color:var(--border); color:var(--foreground); }
.btn.secondary:hover, .btn.ghost:hover { background:var(--accent); }
.btn.ghost { color:var(--foreground); }
.btn.destructive { background:var(--destructive); color:var(--destructive-foreground); }
.btn.icon { width:32px; padding:0; }
.btn[disabled], .btn.disabled { opacity:.5; pointer-events:none; }
.btn.focus { box-shadow:0 0 0 2px var(--background), 0 0 0 4px var(--ring); }

/* ---------- Analytics RangePicker (sites.$slug.analytics._index.tsx) ---------- */
.seg { display:inline-flex; align-items:center; border:1px solid var(--border); border-radius:8px; padding:2px; background:var(--background); }
.seg button { border-radius:6px; padding:4px 10px; font-size:12px; line-height:16px; font-weight:500; color:var(--muted-foreground); font-variant-numeric:tabular-nums; }
.seg button.on { background:var(--secondary); color:var(--foreground); }
.select { display:inline-flex; align-items:center; gap:6px; height:32px; padding:0 10px; border:1px solid var(--border); border-radius:8px; background:var(--card); font-size:13px; font-weight:500; }

/* ---------- Card / SectionCard / StatTile / Badge / EmptyState ---------- */
.card { background:var(--card); color:var(--card-foreground); border:1px solid var(--border); border-radius:14px; }
.card.warn { border-color:color-mix(in srgb, var(--warning-muted-foreground) 40%, transparent); }
.sc-head { display:flex; align-items:center; justify-content:space-between; gap:8px; border-bottom:1px solid var(--border); padding:14px 20px; }
.sc-head h2 { font-size:14px; line-height:20px; font-weight:600; letter-spacing:-0.01em; }
.sc-head .sub { font-size:12px; line-height:16px; color:var(--muted-foreground); }
.sc-body { padding:20px; }
.sc-foot { border-top:1px solid var(--border); padding:10px 20px; font-size:12px; line-height:16px; color:var(--muted-foreground); }
.tiles { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.tile { padding:16px; }
.tile .lbl { font-size:12px; line-height:16px; color:var(--muted-foreground); }
.tile .val { margin-top:6px; font-size:24px; line-height:32px; font-weight:600; letter-spacing:-0.025em; font-variant-numeric:tabular-nums; }
.tile .foot { margin-top:4px; display:flex; align-items:center; gap:6px; font-size:12px; line-height:16px; color:var(--muted-foreground); }
.trend { display:inline-flex; align-items:center; gap:2px; font-variant-numeric:tabular-nums; }
.badge { display:inline-flex; align-items:center; gap:6px; border-radius:999px; padding:2px 10px; font-size:12px; line-height:16px; font-weight:500; white-space:nowrap;
  background:var(--muted); color:var(--muted-foreground); }
.badge.success { background:var(--success-muted); color:var(--success-muted-foreground); }
.badge.warning { background:var(--warning-muted); color:var(--warning-muted-foreground); }
.badge.danger { background:var(--danger-muted); color:var(--danger-muted-foreground); }
.empty { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; border:1px dashed var(--border); border-radius:14px;
  background:var(--card); padding:64px 24px; text-align:center; }
.empty h3 { font-size:16px; line-height:24px; font-weight:600; letter-spacing:-0.01em; }
.empty p { text-wrap:balance; max-width:24rem; margin:4px auto 0; font-size:14px; line-height:20px; color:var(--muted-foreground); }
.skel { background:var(--muted); border-radius:6px; animation:pulse 1.6s ease-in-out infinite; }
@keyframes pulse { 50% { opacity:.55; } }
.busy-dots { display:inline-flex; align-items:center; justify-content:center; gap:2.5px; width:16px; height:16px; }
.busy-dots i { width:3.5px; height:3.5px; border-radius:50%; background:currentColor; animation:bd 1.2s ease-in-out infinite; }
.busy-dots i:nth-child(2) { animation-delay:.16s; } .busy-dots i:nth-child(3) { animation-delay:.32s; }
@keyframes bd { 0%,100% { opacity:.25; transform:none; } 40% { opacity:1; transform:translateY(-1.5px); } }
.gmark { width:20px; height:20px; flex-shrink:0; }
.gmark.lg { width:32px; height:32px; }
.callout { display:flex; gap:12px; align-items:flex-start; padding:14px 20px; }
.callout .t { font-size:14px; line-height:20px; font-weight:500; }
.callout .d { font-size:12px; line-height:16px; color:var(--muted-foreground); margin-top:2px; }

/* ---------- Table (components/ui/table.tsx) ---------- */
table { width:100%; border-collapse:collapse; }
th { height:40px; padding:0 12px; text-align:left; font-size:12px; font-weight:500; color:var(--muted-foreground); border-bottom:1px solid var(--border); white-space:nowrap; }
td { padding:10px 12px; font-size:14px; line-height:20px; border-bottom:1px solid var(--border); vertical-align:top; }
tr:last-child td { border-bottom:0; }
th:first-child, td:first-child { padding-left:20px; } th:last-child, td:last-child { padding-right:20px; }
.num { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
tbody tr:hover td { background:color-mix(in srgb, var(--muted) 50%, transparent); }
.cardtabs { display:flex; align-items:flex-end; justify-content:space-between; gap:8px; border-bottom:1px solid var(--border); padding:12px 20px 0; }
.cardtabs [role=tab] { padding:0 12px 10px; margin-bottom:-1px; font-size:14px; border-bottom:2px solid transparent; color:var(--muted-foreground); }
.cardtabs [role=tab][aria-selected=true] { border-color:var(--success); color:var(--foreground); font-weight:500; }

/* ---------- list rows (seo.tsx AttentionRow / HealthPageRow shape) ---------- */
.rows > li { display:flex; align-items:flex-start; gap:12px; padding:14px 20px; border-top:1px solid var(--border); }
.rows > li:first-child { border-top:0; }
.kind { width:8px; height:8px; border-radius:50%; margin-top:6px; flex-shrink:0; background:var(--warning-muted-foreground); }
.kind.q { background:var(--shared); }
.metrics { display:flex; flex-wrap:wrap; gap:4px 14px; margin-top:6px; font-size:12px; line-height:16px; color:var(--muted-foreground); font-variant-numeric:tabular-nums; }
.metrics b { color:var(--foreground); font-weight:500; }
.copied { display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--success-muted-foreground); }

/* ---------- chart (traffic-area-chart.tsx look) ---------- */
.chart { position:relative; }
.chart svg { display:block; width:100%; }
.legend { display:flex; align-items:center; gap:4px; }
.legend button { display:inline-flex; align-items:center; gap:6px; padding:3px 8px; border-radius:6px; font-size:12px; color:var(--muted-foreground); }
.legend button.on { background:var(--secondary); color:var(--foreground); }
.legend .sw { width:14px; height:0; border-top:2px solid var(--success); }
.legend .sw.dash { border-top:2px dashed var(--ring); }
.axis { display:flex; justify-content:space-between; margin-top:6px; font-size:12px; color:var(--muted-foreground); font-variant-numeric:tabular-nums; }
.tip { position:absolute; z-index:5; background:var(--popover); border:1px solid var(--border); border-radius:8px; padding:6px 10px; font-size:12px; line-height:18px;
  box-shadow:0 4px 16px color-mix(in srgb, var(--foreground) 10%, transparent); white-space:nowrap; pointer-events:none; }
.coming { position:absolute; top:4px; font-size:11px; line-height:14px; color:var(--muted-foreground); background:var(--card); padding:0 4px; border-radius:4px; }

/* ---------- checklist (sites.$slug._index.tsx LaunchChecklist / StepMark) ---------- */
.steps > li { display:flex; gap:12px; padding:12px 20px; border-top:1px solid var(--border); }
.steps > li:first-child { border-top:0; }
.mark { width:16px; height:16px; border-radius:50%; flex-shrink:0; margin-top:2px; display:grid; place-items:center; }
.mark.done { background:var(--success); color:var(--success-foreground); }
.mark.todo { border:1.5px solid var(--primary); }
.mark.wait { border:1.5px solid var(--muted-foreground); }
.mark.busy { color:var(--foreground); }
.progress { height:4px; border-radius:999px; background:var(--muted); overflow:hidden; }
.progress > i { display:block; height:100%; border-radius:999px; background:var(--primary); }

/* ---------- menus / dialogs (ui/dropdown-menu, ui/dialog) ---------- */
.pop { position:absolute; z-index:50; background:var(--popover); border:1px solid var(--border); border-radius:10px; padding:4px;
  box-shadow:0 10px 30px color-mix(in srgb, var(--foreground) 12%, transparent); }
.mi { display:flex; align-items:center; gap:8px; min-height:32px; padding:6px 8px; border-radius:6px; font-size:14px; }
.mi:hover, .mi.hl { background:var(--accent); }
.mi svg.i { color:var(--muted-foreground); }
.mi.danger { color:var(--danger-muted-foreground); } .mi.danger svg.i { color:currentColor; }
.msep { height:1px; background:var(--border); margin:4px -4px; }
.mlabel { padding:6px 8px 8px; font-size:12px; line-height:16px; color:var(--muted-foreground); }
.scrim { position:fixed; inset:0; z-index:59; background:color-mix(in srgb, var(--foreground) 30%, transparent); backdrop-filter:blur(1px); }
.dialog { position:fixed; z-index:60; left:50%; top:50%; transform:translate(-50%,-50%); width:calc(100% - 32px); max-width:32rem;
  max-height:min(90vh,36rem); display:flex; flex-direction:column; overflow:hidden; background:var(--card); border:1px solid var(--border);
  border-radius:14px; box-shadow:0 20px 50px color-mix(in srgb, var(--foreground) 18%, transparent); }
.dialog.wide { max-width:48rem; }
.dlg-x { position:absolute; right:12px; top:12px; width:32px; height:32px; display:grid; place-items:center; border-radius:8px; color:var(--muted-foreground); }
.dlg-head { padding:24px 24px 0; } .dlg-head.bar { padding:16px 24px; border-bottom:1px solid var(--border); }
.dlg-title { font-size:18px; line-height:28px; font-weight:600; letter-spacing:-0.01em; padding-right:32px; }
.dlg-desc { font-size:14px; line-height:20px; color:var(--muted-foreground); margin-top:4px; }
.dlg-body { padding:16px 24px 8px; overflow-y:auto; min-height:0; flex:1; }
.dlg-foot { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:8px; padding:16px 24px 24px; }
.dlg-foot.bar { border-top:1px solid var(--border); padding:16px 24px; }
.eyebrow { margin-bottom:8px; font-size:11px; line-height:16px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--muted-foreground); }
.serp { border:1px solid var(--border); border-radius:14px; background:var(--background); padding:16px; }
.field-l { font-size:14px; font-weight:500; margin-bottom:6px; display:flex; justify-content:space-between; }
.input { width:100%; min-height:36px; border:1px solid var(--input); border-radius:8px; background:var(--card); padding:8px 12px; font-size:14px; line-height:20px; }
.cbx { width:16px; height:16px; border:1.5px solid var(--input); border-radius:4px; background:var(--card); flex-shrink:0; margin-top:2px; display:grid; place-items:center; }
.cbx.on { background:var(--foreground); border-color:var(--foreground); color:var(--card); }
.switch { width:36px; height:20px; border-radius:999px; background:var(--foreground); position:relative; flex-shrink:0; }
.switch::after { content:""; position:absolute; top:2px; left:18px; width:16px; height:16px; border-radius:50%; background:var(--card); }

/* ---------- Overview (sites.$slug._index.tsx) ---------- */
.ov-grid { display:grid; grid-template-columns:minmax(0,1fr) 17rem; gap:24px; align-items:start; }
.ov-grid.solo { grid-template-columns:minmax(0,48rem); }
.counter { display:flex; flex-wrap:wrap; }
.counter > div { flex:1; min-width:7.5rem; padding:10px 14px; border-left:1px solid var(--border); }
.counter > div:first-child { border-left:0; }
.counter .l { font-size:12px; color:var(--muted-foreground); } .counter .v { font-size:18px; line-height:28px; font-weight:600; letter-spacing:-0.025em; font-variant-numeric:tabular-nums; }
.rail-row { padding:16px; border-top:1px solid var(--border); } .rail-row:first-child { border-top:0; }

/* ---------- mobile (below md / lg) ---------- */
.m .topbar { height:auto; flex-wrap:wrap; padding:0 8px; gap:4px; }
.m .topbar .r1 { display:flex; align-items:center; gap:4px; height:48px; width:100%; }
.m .topbar .r2 { display:flex; align-items:center; gap:6px; height:48px; width:100%; border-top:1px solid var(--border); }
.m .body { display:block; } .m .side { display:none; }
.m .main { padding:24px 16px; }
.m .tabs > * { font-size:20px; }
.m .tiles { grid-template-columns:repeat(2,minmax(0,1fr)); }
.m .hide-m { display:none !important; }
.m td, .m th { padding-left:8px; padding-right:8px; }
.m th:first-child, .m td:first-child { padding-left:16px; } .m th:last-child, .m td:last-child { padding-right:16px; }
.m .rows > li { padding:14px 16px; flex-wrap:wrap; }
.m .sc-head, .m .sc-body { padding-left:16px; padding-right:16px; }
.show-m { display:none; } .m .show-m { display:inline-flex; }
.m .tile .foot .trunc { display:none; }
.m .rows > li { flex-direction:column; gap:10px; }
.m .sc-head { flex-direction:column; align-items:flex-start; gap:2px; }
.m .coming { display:none; }
.m .axis { flex-wrap:wrap; gap:4px 12px; } .m .axis > .row { order:3; width:100%; }

/* ---------- mockup chrome (not product UI) ---------- */
.mk-note { position:fixed; right:12px; bottom:12px; z-index:80; max-width:360px; background:#1c1917; color:#fff; font-size:12px; line-height:17px;
  padding:8px 10px; border-radius:8px; opacity:.92; }
.mk-note b { color:#ffcb05; }
.mk-hide-notes .mk-note { display:none; }
.mk-frames { padding:24px 32px; display:grid; gap:28px; }
.mk-frame-label { font:600 12px/16px var(--font-mono); color:var(--muted-foreground); margin-bottom:8px; text-transform:uppercase; letter-spacing:.04em; }
.mk-frame { border:1px dashed var(--input); border-radius:16px; padding:0 24px 24px; background:var(--background); }
.mk-frame .tabsrow { position:static; }