:root{color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}html{scroll-padding-top:env(safe-area-inset-top,0px)}body{margin:0;padding:0;font:14px -apple-system,BlinkMacSystemFont,sans-serif;background:#faf9f5;color:#141413}img{max-width:100%}[hidden]:not([hidden=until-found i]){display:none!important}

  :root{
    --bg:#FFFFFF; --surface:#F9FAFB; --surface-2:#F3F4F6;
    --border:#E5E7EB; --border-strong:#D1D5DB;
    --ink:#111827; --ink-soft:#374151; --muted:#6B7280;
    --accent:#FFC933; --accent-ink:#111827;
    --photo-a:#E5E7EB; --photo-b:#CBD2DA; --photo-line:rgba(17,24,39,.07);
    --display:"Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
    --body:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
    --maxw:1160px; --readw:68ch; --headh:64px;
    color-scheme:light;
  }

  *{box-sizing:border-box}
  html{scrollbar-gutter:stable}
  body{background:var(--bg); color:var(--ink); font-family:var(--body); font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased}
  h1,h2,h3,h4{font-family:var(--display); color:var(--ink); text-wrap:balance; margin:0; line-height:1.18}
  h1{font-weight:800; font-size:clamp(2rem,5vw,3rem); letter-spacing:-.02em}
  h2{font-weight:700; font-size:clamp(1.35rem,2.8vw,1.8rem); letter-spacing:-.015em}
  h3{font-weight:700; font-size:1.1rem; letter-spacing:-.01em}
  h4{font-weight:600; font-size:.98rem}
  p{margin:0}
  a{color:inherit}
  .wrap{width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:20px}

  /* Header */
  .site-head{position:sticky; top:env(safe-area-inset-top,0px); z-index:50; background:color-mix(in srgb, var(--bg) 90%, transparent); backdrop-filter:saturate(140%) blur(10px); border-bottom:1px solid var(--border)}
  .head-in{display:flex; align-items:center; gap:24px; height:var(--headh)}
  .brand{display:flex; flex-direction:column; gap:5px; text-decoration:none}
  .brand-name{font-family:var(--display); font-weight:700; font-size:1.06rem; letter-spacing:-.02em; color:var(--ink)}
  .brand-rule{height:2px; width:34px; background:var(--accent); border-radius:2px}
  .nav{margin-left:auto; display:flex; gap:4px}
  .nav a{font-size:.9rem; font-weight:500; text-decoration:none; color:var(--muted); padding:7px 12px; border-radius:7px}
  .nav a:hover{color:var(--ink); background:var(--surface-2)}
  .nav a.on{color:var(--ink); background:var(--surface-2)}
  .nav-label-short{display:none}
  @media (min-width:481px){
    .nav > a:not(.nav-search){display:grid;place-items:center;flex:0 0 auto;padding-inline:0}
    .nav > a:nth-child(1){width:64px}
    .nav > a:nth-child(2){width:112px}
    .nav > a:nth-child(3){width:72px}
    .nav > a:nth-child(4){width:64px}
  }

  @media (max-width:700px){
    .head-in{gap:14px}
    .nav{gap:1px}
    .nav a{padding-inline:8px}
    .nav-label-full{display:none}
    .nav-label-short{display:inline}
  }

  /* Photo placeholder */
  .photo{position:relative; width:100%; max-width:100%; border-radius:10px; overflow:hidden; background:linear-gradient(145deg,var(--photo-a),var(--photo-b)); border:1px solid var(--border); display:flex; align-items:flex-end}
  .photo::before{content:""; position:absolute; inset:0; background:repeating-linear-gradient(180deg, transparent 0 26px, var(--photo-line) 26px 27px)}
  .photo-note{position:relative; padding:12px 14px; width:100%; font-size:.72rem; line-height:1.45; color:var(--muted)}
  .photo-note b{display:block; font-family:var(--display); font-weight:600; font-size:.62rem; letter-spacing:.11em; text-transform:uppercase; margin-bottom:2px}
  .photo-real::before{display:none}
  .photo-real img{display:block; width:100%; height:100%; object-fit:cover}

  .eyebrow{font-family:var(--display); font-weight:600; font-size:.7rem; letter-spacing:.13em; text-transform:uppercase; color:var(--muted)}
  .lede{font-size:1.06rem; color:var(--ink-soft); max-width:var(--readw)}
  .band{padding-block:clamp(40px,6vw,64px)}
  .band + .band{border-top:1px solid var(--border)}
  .stack{display:flex; flex-direction:column; gap:20px}
  .stack-sm{display:flex; flex-direction:column; gap:8px}

  .btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; font-family:var(--display); font-weight:600; font-size:.84rem; padding:10px 16px; border-radius:8px; text-decoration:none; border:0; cursor:pointer; background:var(--accent); color:var(--accent-ink)}
  .btn:hover{filter:brightness(.95)}
  .btn.ghost{background:transparent; color:var(--ink); border:1px solid var(--border-strong)}
  .btn.ghost:hover{background:var(--surface-2); filter:none}

  /* Home D hero */
  .picker{display:grid; grid-template-columns:1.35fr 1fr; gap:44px; align-items:stretch; padding-block:clamp(36px,5vw,60px)}
  @media (max-width:880px){ .picker{grid-template-columns:1fr} .picker .photo{min-height:260px} }
  .problems{display:grid; grid-template-columns:repeat(2,1fr); gap:12px}
  @media (max-width:520px){ .problems{grid-template-columns:1fr} }
  .problem{display:flex; flex-direction:column; gap:3px; text-decoration:none; padding:16px 18px; border:1px solid var(--border-strong); border-radius:10px; background:var(--bg); transition:border-color .15s, background .15s}
  .problem:hover{border-color:var(--ink); background:var(--surface)}
  .problem b{font-family:var(--display); font-weight:700; font-size:.98rem}
  .problem span{font-size:.8rem; color:var(--muted)}
  .problem.alt{background:var(--surface-2); border-style:dashed}

  /* Cards */
  .grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
  @media (max-width:900px){ .grid3{grid-template-columns:repeat(2,1fr)} }
  @media (max-width:560px){ .grid3{grid-template-columns:1fr} }
  .card{display:flex; flex-direction:column; gap:10px; text-decoration:none; color:inherit}
  .card .photo{aspect-ratio:16/10}
  .card h3{font-size:1.02rem}
  .card p{font-size:.88rem; color:var(--muted)}
  .card:hover h3{text-decoration:underline; text-underline-offset:3px}
  .meta{display:flex; gap:8px; align-items:center; flex-wrap:wrap}
  .kw{font-family:var(--display); font-weight:600; font-size:.64rem; letter-spacing:.09em; padding:3px 8px; border-radius:5px; background:var(--surface-2); color:var(--muted)}
  .kw.live{background:var(--accent); color:var(--accent-ink)}
  .pickcard .kw:not(.live){color:var(--ink-soft)}
  .draft{font-size:.74rem; color:var(--muted)}
  .card[aria-disabled="true"]{opacity:.6; pointer-events:none}

  .picks-strip{display:grid; grid-template-columns:repeat(2,1fr); gap:22px}
  @media (max-width:720px){ .picks-strip{grid-template-columns:1fr} }
  .pickcard{display:grid; grid-template-columns:180px 1fr; border:1px solid var(--border); border-radius:12px; overflow:hidden; text-decoration:none; color:inherit; background:var(--bg)}
  .pickcard:hover{border-color:var(--border-strong)}
  .pickcard .photo{border:0; border-radius:0; border-right:1px solid var(--border); min-height:150px}
  .pickcard > div:last-child{padding:18px 20px; display:flex; flex-direction:column; gap:7px}
  .pickcard p{font-size:.86rem; color:var(--muted)}
  .pickcard[aria-disabled="true"]{opacity:.6; pointer-events:none}
  @media (max-width:460px){ .pickcard{grid-template-columns:1fr} .pickcard .photo{border-right:0; border-bottom:1px solid var(--border); min-height:130px} }

  .cta-card{background:var(--accent); color:var(--accent-ink); border-radius:12px; padding:26px 28px; display:flex; flex-direction:column; gap:12px}
  .cta-card h3{color:var(--accent-ink); font-size:1.15rem}
  .cta-card p{font-size:.93rem; color:#1F2937}
  .cta-form{display:flex; gap:9px; flex-wrap:wrap}
  .cta-form input{flex:1 1 200px; min-width:0; padding:11px 13px; border-radius:8px; border:1px solid rgba(17,24,39,.22); background:#FFFFFF; color:#111827; font-family:var(--body); font-size:.9rem}
  .cta-form button{background:#111827; color:#FFFFFF}
  .form-msg{font-size:.8rem; color:#1F2937; min-height:1.2em}

  /* Guides index */
  .cat{display:grid; grid-template-columns:220px 1fr; gap:28px; padding-block:26px; border-top:1px solid var(--border)}
  .cat:first-of-type{border-top:0}
  @media (max-width:760px){ .cat{grid-template-columns:1fr; gap:14px} }
  .cat-head{display:flex; flex-direction:column; gap:4px}
  .cat-head p{font-size:.84rem; color:var(--muted)}
  .cat-list{display:grid; grid-template-columns:repeat(2,1fr); gap:14px}
  @media (max-width:560px){ .cat-list{grid-template-columns:1fr} }
  .row{display:flex; flex-direction:column; gap:6px; padding:16px 18px; border:1px solid var(--border); border-radius:10px; text-decoration:none; color:inherit}
  .row:hover{border-color:var(--border-strong)}
  .row p{font-size:.85rem; color:var(--muted)}
  .row[aria-disabled="true"]{opacity:.6; pointer-events:none}

  /* Guide B article layout */
  .article-head{display:flex; flex-direction:column; gap:14px; padding-top:clamp(28px,4vw,44px)}
  .crumbs{font-size:.8rem; color:var(--muted); display:flex; gap:7px; flex-wrap:wrap}
  .crumbs a{text-decoration:none}
  .crumbs a:hover{color:var(--ink)}
  .byline{display:flex; gap:14px; flex-wrap:wrap; font-size:.83rem; color:var(--muted)}
  .byline .who{color:var(--ink); font-weight:500}
  .layout{display:grid; grid-template-columns:240px minmax(0,1fr); gap:56px; align-items:start; padding-block:28px 64px}
  @media (max-width:900px){ .layout{grid-template-columns:minmax(0,1fr); gap:24px} .layout > *{min-width:0} }
  .toc{position:sticky; top:calc(var(--headh) + 24px + env(safe-area-inset-top,0px)); display:flex; flex-direction:column; gap:2px}
  .toc-label{font-family:var(--display); font-weight:600; font-size:.66rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-bottom:8px}
  .toc-links{display:flex; flex-direction:column; gap:2px}
  @media (max-width:900px){ .toc{display:none} }
  .toc-links a{font-size:.86rem; text-decoration:none; color:var(--muted); padding:6px 12px; border-left:2px solid var(--border); line-height:1.4}
  .toc-links a:hover{color:var(--ink)}
  .toc-links a.on{color:var(--ink); font-weight:500; border-left-color:var(--accent); background:var(--surface)}
  .toc-box{margin-top:22px; padding:16px; border:1px solid var(--border); border-radius:10px; display:flex; flex-direction:column; gap:8px}
  .toc-box b{font-family:var(--display); font-size:.92rem}
  .toc-box p{font-size:.8rem; color:var(--muted)}
  .content{max-width:760px; display:flex; flex-direction:column; gap:22px}
  .content > section{display:flex; flex-direction:column; gap:16px; scroll-margin-top:calc(var(--headh) + 20px)}
  .content > section + section{padding-top:18px}
  .content p.body{font-size:1rem; color:var(--ink-soft)}
  .disclosure{font-size:.8rem; color:var(--muted); line-height:1.6; background:var(--surface-2); border-radius:8px; padding:12px 16px}
  .answer{font-size:1.04rem; color:var(--ink-soft); line-height:1.7}

  .factors{display:grid; grid-template-columns:repeat(2,1fr); gap:14px}
  @media (max-width:600px){ .factors{grid-template-columns:1fr} }
  .factor{padding:18px 20px; border:1px solid var(--border); border-radius:10px; display:flex; flex-direction:column; gap:6px}
  .factor p{font-size:.9rem; color:var(--ink-soft)}
  .factor .check{font-size:.8rem; color:var(--muted)}

  .tablewrap{overflow-x:auto; border:1px solid var(--border); border-radius:10px}
  table{border-collapse:collapse; width:100%; min-width:600px; font-size:.87rem}
  th,td{text-align:left; padding:12px 14px; border-bottom:1px solid var(--border); vertical-align:top}
  thead th{font-family:var(--display); font-weight:600; font-size:.68rem; letter-spacing:.07em; text-transform:uppercase; color:var(--muted); background:var(--surface); white-space:nowrap}
  tbody tr:last-child td{border-bottom:0}
  td.name{font-weight:500; color:var(--ink)}

  .item{display:grid; grid-template-columns:210px 1fr; border:1px solid var(--border); border-radius:12px; overflow:hidden; background:var(--bg); scroll-margin-top:calc(var(--headh) + 20px)}
  @media (max-width:640px){ .item{grid-template-columns:1fr} }
  .item .photo{border:0; border-radius:0; border-right:1px solid var(--border); min-height:200px}
  @media (max-width:640px){ .item .photo{border-right:0; border-bottom:1px solid var(--border); min-height:0; aspect-ratio:16/9} }
  .item-body{padding:18px 20px; display:flex; flex-direction:column; gap:9px}
  .item-top{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
  .num{font-family:var(--display); font-weight:700; font-size:.75rem; width:26px; height:26px; border-radius:50%; background:var(--ink); color:var(--bg); display:grid; place-items:center; flex:0 0 auto}
  .bestfor{display:inline-flex; gap:6px; align-items:center; font-family:var(--display); font-weight:600; font-size:.7rem; padding:4px 9px; border-radius:6px; background:var(--surface-2); border:1px solid var(--border)}
  .bestfor span{color:var(--muted); font-weight:500; letter-spacing:.06em; text-transform:uppercase; font-size:.6rem}
  .item p{font-size:.92rem; color:var(--ink-soft)}
  .limit{font-size:.84rem !important; color:var(--muted) !important}
  .limit b{font-family:var(--display); font-weight:600; color:var(--ink-soft)}
  .item-foot{display:flex; gap:10px; align-items:center; flex-wrap:wrap; padding-top:4px}
  .deeper{font-size:.82rem; color:var(--ink-soft); text-underline-offset:3px}

  .faq details{border-top:1px solid var(--border)}
  .faq details:last-child{border-bottom:1px solid var(--border)}
  .faq summary{cursor:pointer; list-style:none; padding-block:14px; font-family:var(--display); font-weight:600; font-size:.96rem; display:flex; justify-content:space-between; gap:16px}
  .faq summary::-webkit-details-marker{display:none}
  .faq summary::after{content:"+"; color:var(--muted); font-size:1.2rem; line-height:1}
  .faq details[open] summary::after{content:"\2212"}
  .faq p{padding-bottom:16px; font-size:.93rem; color:var(--ink-soft)}
  .note{font-size:.83rem; color:var(--muted); border:1px dashed var(--border-strong); border-radius:9px; padding:13px 15px}
  .note b{font-family:var(--display); font-weight:600; color:var(--ink)}

  .prose{max-width:var(--readw); display:flex; flex-direction:column; gap:14px; color:var(--ink-soft)}
  .prose ul{margin:0; padding-left:1.2em; display:flex; flex-direction:column; gap:8px}

  /* Footer */
  .site-foot{border-top:1px solid var(--border); background:var(--surface)}
  .foot-in{padding-block:36px; display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:28px}
  @media (max-width:760px){ .foot-in{grid-template-columns:1fr 1fr} .foot-brand{grid-column:1/-1} }
  .foot-col{display:flex; flex-direction:column; gap:9px}
  .foot-col h4{font-size:.7rem; letter-spacing:.11em; text-transform:uppercase; color:var(--muted); font-weight:600}
  .foot-col a{font-size:.87rem; color:var(--muted); text-decoration:none; width:fit-content}
  .foot-col a:hover{color:var(--ink)}
  .foot-col p{font-size:.84rem; color:var(--muted); max-width:40ch}
  .foot-legal{border-top:1px solid var(--border); padding-block:18px; font-size:.77rem; color:var(--muted); display:flex; gap:16px; flex-wrap:wrap; justify-content:space-between}


  /* Newest list (home) */
  .home-split{display:grid; grid-template-columns:1.5fr 1fr; gap:44px; align-items:start}
  @media (max-width:900px){ .home-split{grid-template-columns:1fr} }
  .home-split .grid3{grid-template-columns:repeat(2,1fr)}
  @media (max-width:560px){ .home-split .grid3{grid-template-columns:1fr} }
  .newest{display:flex; flex-direction:column}
  .nrow{display:grid; grid-template-columns:62px 1fr; gap:14px; padding-block:14px; border-top:1px solid var(--border); text-decoration:none; color:inherit}
  .nrow:last-child{border-bottom:1px solid var(--border)}
  .nrow:hover h4{text-decoration:underline; text-underline-offset:3px}
  .ndate{font-family:var(--display); font-weight:600; font-size:.72rem; color:var(--muted); line-height:1.3; padding-top:2px; font-variant-numeric:tabular-nums}
  .ndate b{display:block; font-size:1.25rem; color:var(--ink); font-weight:700}
  .nrow p{font-size:.78rem; color:var(--muted); margin-top:3px}
  .sec-head{display:flex; align-items:end; justify-content:space-between; gap:16px; flex-wrap:wrap}
  .sec-head a{font-size:.86rem; font-weight:500; color:var(--ink-soft); text-underline-offset:3px}

  /* Guides library */
  .lib-tools{display:flex; flex-direction:column; gap:14px; position:sticky; top:calc(var(--headh) + env(safe-area-inset-top,0px)); z-index:5; background:var(--bg); padding-block:14px; border-bottom:1px solid var(--border)}
  .lib-row{display:flex; gap:10px; align-items:center; flex-wrap:wrap}
  .search{flex:1 1 280px; min-width:0; position:relative}
  .search input{width:100%; padding:11px 14px 11px 38px; border-radius:9px; border:1px solid var(--border-strong); background:var(--bg); color:var(--ink); font-family:var(--body); font-size:.92rem}
  .search svg{position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--muted)}
  .sort{display:flex; align-items:center; gap:8px; font-size:.84rem; color:var(--muted)}
  .sort select{padding:10px 12px; border-radius:9px; border:1px solid var(--border-strong); background:var(--bg); color:var(--ink); font-family:var(--body); font-size:.88rem}
  .chips{display:flex; gap:8px; overflow-x:auto; padding-bottom:2px; scrollbar-width:thin}
  .chip{flex:0 0 auto; font-family:var(--display); font-weight:600; font-size:.8rem; padding:8px 13px; border-radius:999px; border:1px solid var(--border-strong); background:var(--bg); color:var(--ink-soft); cursor:pointer; white-space:nowrap}
  .chip span{color:var(--muted); font-weight:500; margin-left:4px; font-variant-numeric:tabular-nums}
  .chip.on{background:var(--ink); border-color:var(--ink); color:var(--bg)}
  .chip.on span{color:var(--bg); opacity:.7}
  .lib-status{display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; font-size:.84rem; color:var(--muted); padding-block:18px 4px}
  .cat-intro{padding:18px 20px; background:var(--surface); border:1px solid var(--border); border-radius:10px; display:flex; flex-direction:column; gap:4px; margin-top:14px}
  .cat-intro p{font-size:.88rem; color:var(--muted)}
  .lib-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; padding-top:16px}
  @media (max-width:900px){ .lib-grid{grid-template-columns:repeat(2,1fr)} }
  @media (max-width:560px){ .lib-grid{grid-template-columns:1fr} }
  .gitem{display:flex; flex-direction:column; gap:7px; padding:18px 18px 16px; border:1px solid var(--border); border-radius:11px; text-decoration:none; color:inherit; background:var(--bg); cursor:pointer}
  .gitem:hover{border-color:var(--border-strong)}
  .gitem .cat-lbl{font-family:var(--display); font-weight:600; font-size:.64rem; letter-spacing:.11em; text-transform:uppercase; color:var(--muted)}
  .gitem h3{font-size:1rem}
  .gitem p{font-size:.85rem; color:var(--muted)}
  .gitem .gfoot{margin-top:auto; padding-top:8px; display:flex; gap:8px; align-items:center; flex-wrap:wrap; font-size:.76rem; color:var(--muted)}
  .badge{font-family:var(--display); font-weight:600; font-size:.62rem; letter-spacing:.08em; text-transform:uppercase; padding:3px 7px; border-radius:5px}
  .badge.new{background:var(--accent); color:var(--accent-ink)}
  .badge.pop{background:var(--surface-2); color:var(--ink); border:1px solid var(--border)}
  mark{background:color-mix(in srgb, var(--accent) 55%, transparent); color:inherit; border-radius:2px}
  .more{display:flex; flex-direction:column; align-items:center; gap:8px; padding-top:26px}
  .empty{padding:40px 20px; text-align:center; border:1px dashed var(--border-strong); border-radius:11px; margin-top:16px; display:flex; flex-direction:column; gap:10px; align-items:center}
  .empty p{color:var(--muted); font-size:.9rem}
  .toast{position:fixed; left:50%; bottom:calc(20px + env(safe-area-inset-bottom,0px)); transform:translateX(-50%); background:var(--ink); color:var(--bg); font-size:.85rem; padding:10px 16px; border-radius:9px; z-index:100; max-width:calc(100% - 32px)}



  /* Brand intro */
  .intro{background:var(--surface); border-top:1px solid var(--border)}
  .intro-in{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start; padding-block:clamp(40px,6vw,60px)}
  @media (max-width:860px){ .intro-in{grid-template-columns:1fr; gap:24px} }
  .intro-in .body{font-size:1rem; color:var(--ink-soft); max-width:56ch}
  .principles{display:flex; flex-direction:column}
  .principle{padding-block:14px; border-top:1px solid var(--border); display:flex; flex-direction:column; gap:3px}
  .principle:last-child{border-bottom:1px solid var(--border)}
  .principle b{font-family:var(--display); font-weight:600; font-size:.96rem}
  .principle span{font-size:.88rem; color:var(--muted)}
  .textlink{font-weight:500; font-size:.9rem; color:var(--ink); text-underline-offset:3px; width:fit-content}
  .newhere{font-size:.84rem; color:var(--muted); background:var(--surface); border:1px solid var(--border); border-radius:8px; padding:10px 14px; max-width:var(--readw)}
  .newhere b{font-family:var(--display); font-weight:600; color:var(--ink)}
  .newhere a{color:var(--ink); text-underline-offset:3px}


  /* About GarageClever, option B */
  .about-b{border-top:1px solid var(--border)}
  .about-b-in{padding-block:clamp(48px,7vw,84px)}
  .ab-eb{display:inline-flex; align-items:center; gap:10px; margin-bottom:18px}
  .ab-eb::before{content:""; width:22px; height:2px; background:var(--accent); border-radius:2px}
  .about-b h2{font-weight:800; font-size:clamp(1.9rem,4.6vw,3.2rem); letter-spacing:-.03em; line-height:1.08; max-width:18ch}
  .about-b h2 span{background:linear-gradient(transparent 64%, color-mix(in srgb, var(--accent) 75%, transparent) 64% 90%, transparent 90%)}
  .ab-row{display:grid; grid-template-columns:1fr 1fr; gap:56px; margin-top:28px; align-items:end}
  @media (max-width:820px){ .ab-row{grid-template-columns:1fr; gap:18px} }
  .ab-lead{font-size:1.02rem; color:var(--ink-soft); max-width:58ch}
  .ab-side{display:flex; justify-content:flex-end}
  @media (max-width:820px){ .ab-side{justify-content:flex-start} }
  .ab-link{display:inline-flex; align-items:center; gap:6px; font-weight:500; font-size:.92rem; color:var(--ink); text-underline-offset:3px}
  .ab-link::after{content:"\2192"; transition:transform .15s}
  .ab-link:hover::after{transform:translateX(3px)}
  .ab-cols{display:grid; grid-template-columns:repeat(4,1fr); gap:28px; margin-top:48px}
  @media (max-width:900px){ .ab-cols{grid-template-columns:repeat(2,1fr)} }
  @media (max-width:480px){ .ab-cols{grid-template-columns:1fr} }
  .ab-col{display:flex; flex-direction:column; gap:8px; padding-top:16px; border-top:1px solid var(--border-strong); position:relative}
  .ab-col::before{content:""; position:absolute; top:-1px; left:0; width:34px; height:2px; background:var(--accent)}
  .ab-col b{font-family:var(--display); font-weight:700; font-size:1rem}
  .ab-col span{font-size:.88rem; color:var(--muted); line-height:1.55}

  :focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:4px}
  @media (prefers-reduced-motion: reduce){ *{transition:none !important; scroll-behavior:auto !important} }

  /* ===== HOME A: Editorial Split ===== */
  .ha-hero{display:grid; grid-template-columns:1.05fr .95fr; gap:48px; align-items:center; padding-block:clamp(40px,6vw,72px)}
  .ha-hero h1{font-size:clamp(2rem,4.2vw,3rem); line-height:1.12; letter-spacing:-.02em}
  .ha-hero .lede{font-size:1.1rem}
  .ha-cta{display:flex; gap:10px; flex-wrap:wrap; margin-top:6px}
  .ha-cta .btn:not(.ghost){background:var(--accent); color:var(--accent-ink)}
  /* Match the original photo ratio instead of leaving an unfilled minimum-height frame. */
  .ha-photo.photo-real{min-height:0;aspect-ratio:16/9}
  .ha-photo.photo-real > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
  .ha-grid{gap:24px}
  .ha-card{display:flex; flex-direction:column; border:1px solid var(--border); border-radius:12px; overflow:hidden; text-decoration:none; color:inherit; min-width:0; transition:border-color .15s}
  .ha-card:hover{border-color:var(--border-strong)}
  .ha-card .photo{border-radius:0; aspect-ratio:16/10}
  .ha-body{padding:16px 18px 20px; display:flex; flex-direction:column; gap:6px}
  .ha-body h3{font-size:1.06rem}
  .ha-body p{font-size:.88rem; color:var(--muted)}
  .ha-card:hover h3{text-decoration:underline; text-underline-offset:3px; text-decoration-color:var(--accent)}
  @media (max-width:900px){ .ha-hero{grid-template-columns:1fr; gap:28px} .ha-photo{min-height:240px} }
  @media (max-width:760px){ .ha-grid{grid-template-columns:1fr 1fr} }
  @media (max-width:520px){ .ha-grid{grid-template-columns:1fr} }

  /* ===== HOME A additions ===== */
  .nav-search{display:grid; place-items:center; width:36px; height:36px; margin-left:4px; border-radius:8px; border:1px solid var(--border); background:var(--bg); color:var(--ink); cursor:pointer}
  .nav-search:hover{background:var(--surface-2)}
  .ha-cta .btn{border:0; cursor:pointer}
  .ha-cta a.btn.ghost{border:1px solid var(--border-strong)}
  .ha-prob{font-size:.88rem; color:var(--muted); display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:4px}
  .ha-prob span{color:var(--muted)}
  .ha-prob a{color:var(--ink); font-weight:500; text-decoration:none; border-bottom:1.5px solid var(--accent)}
  .ha-trust{border-top:1px solid var(--border); border-bottom:1px solid var(--border); background:var(--surface)}
  .ha-trust-in{display:flex; flex-wrap:wrap; align-items:center; gap:8px 26px; padding-block:14px; font-size:.84rem; color:var(--ink-soft)}
  .ha-trust-in span, .ha-trust-in a:not(.ha-about){display:inline-flex; align-items:center; gap:8px}
  .ha-trust-in span::before{content:""; width:14px; height:8px; border-left:2px solid var(--accent); border-bottom:2px solid var(--accent); transform:rotate(-45deg) translateY(-2px)}
  .ha-trust-in a{color:inherit}
  .ha-about{margin-left:auto; font-weight:600; text-decoration:none; color:var(--ink)}
  @media (max-width:760px){ .ha-about{margin-left:0} }
  .ha-card .photo{position:relative}
  .ha-badge{position:absolute; top:12px; left:12px; z-index:2; font-family:var(--display); font-weight:700; font-size:.66rem; letter-spacing:.06em; text-transform:uppercase; background:var(--bg); color:var(--ink); border-radius:999px; padding:4px 10px}
  .ha-badge.y{background:var(--accent); color:var(--accent-ink)}
  .ha-meta{font-size:.74rem; color:var(--muted)}
  .ha-pick{margin-top:auto; padding-top:12px; border-top:1px solid var(--border); font-size:.82rem; color:var(--muted); display:flex; align-items:center; gap:7px}
  .ha-pick i{width:7px; height:7px; border-radius:50%; background:var(--accent); flex:0 0 7px}
  .ha-pick b{color:var(--ink); font-weight:600}
  .ha-body{flex:1}
  @media (max-width:480px){ .nav{gap:0} .nav a{padding:7px 8px; font-size:.85rem} .nav-search{width:32px; height:32px; margin-left:2px} .brand-name{font-size:1rem} }
  @media (max-width:430px){
    .head-in{gap:8px}
    .brand-name{font-size:.9rem}
    .brand-rule{width:28px}
    .nav a{padding:6px;font-size:.79rem}
    .nav-search{width:30px;height:30px;margin-left:1px}
  }
  .newest-wide .newest{display:grid; grid-template-columns:1fr 1fr; column-gap:44px}
  @media (max-width:760px){ .newest-wide .newest{grid-template-columns:1fr} }

  .picks-strip.one{grid-template-columns:1fr}
  .picks-strip.one .pickcard{grid-template-columns:minmax(200px,38%) 1fr}
  .picks-strip.one .pickcard > div:last-child{justify-content:center; padding:24px 28px}
  @media (max-width:560px){ .picks-strip.one .pickcard{grid-template-columns:1fr} .picks-strip.one .pickcard .photo{border-right:0; border-bottom:1px solid var(--border)} }
  .crumbs a{display:inline-block; padding:6px 2px; margin:-6px 0}
  .newest a, .ha-card, .footer a{min-height:24px}

  /* Garage Types prototype */
  .types-preview{display:grid; grid-template-columns:1.2fr 1fr; gap:42px; align-items:end}
  .types-preview-copy{display:flex; flex-direction:column; gap:12px}
  .types-preview-copy p:last-child{max-width:62ch; color:var(--ink-soft)}
  .types-quick{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px}
  .type-quick{min-height:108px; padding:14px; border:1px solid var(--border); border-radius:10px; text-decoration:none; display:flex; flex-direction:column; justify-content:space-between; gap:18px; background:var(--bg); transition:transform .15s,border-color .15s,background .15s}
  .type-quick:hover{transform:translateY(-2px); border-color:var(--border-strong); background:var(--surface)}
  .type-quick b{font-family:var(--display); font-size:.84rem; line-height:1.3}
  .type-quick span{font-size:.72rem; color:var(--muted)}
  .type-mark{width:28px; height:5px; border-radius:999px; background:var(--accent)}
  @media (max-width:900px){.types-preview{grid-template-columns:1fr}.types-quick{grid-template-columns:repeat(3,1fr)}}
  @media (max-width:560px){.types-quick{grid-template-columns:1fr 1fr}.type-quick:last-child{grid-column:1/-1}}

  .types-hero{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr); gap:54px; align-items:center; padding-block:clamp(44px,7vw,82px)}
  .types-hero-copy{display:flex; flex-direction:column; gap:18px}
  .types-hero-copy .lede{max-width:60ch}
  .types-map{min-height:330px; border:1px solid var(--border); border-radius:14px; background:var(--surface); padding:22px; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:10px; position:relative; overflow:hidden}
  .types-map::after{content:"GARAGE"; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:92px; height:92px; border-radius:50%; display:grid; place-items:center; background:var(--ink); color:var(--bg); border:7px solid var(--surface); font-family:var(--display); font-weight:700; font-size:.67rem; letter-spacing:.12em}
  .map-zone{border:1px solid var(--border); background:var(--bg); border-radius:10px; padding:14px; display:flex; align-items:flex-start; font-family:var(--display); font-weight:600; font-size:.73rem; color:var(--ink-soft)}
  .map-zone:nth-child(1){border-top:4px solid #FFC933}
  .map-zone:nth-child(2){border-top:4px solid #9CA3AF; justify-content:flex-end; text-align:right}
  .map-zone:nth-child(3){border-bottom:4px solid #D1D5DB; align-items:flex-end}
  .map-zone:nth-child(4){border-bottom:4px solid #374151; align-items:flex-end; justify-content:flex-end; text-align:right}
  @media (max-width:860px){.types-hero{grid-template-columns:1fr; gap:30px}.types-map{min-height:270px}}

  .type-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px}
  .type-card{border:1px solid var(--border); border-radius:14px; overflow:hidden; background:var(--bg); display:flex; flex-direction:column; scroll-margin-top:calc(var(--headh) + 24px)}
  .type-card:first-child{grid-column:1/-1; display:grid; grid-template-columns:minmax(260px,.8fr) 1.2fr}
  .type-visual{min-height:210px; padding:20px; background:linear-gradient(145deg,#F3F4F6,#E5E7EB); border-bottom:1px solid var(--border); position:relative; display:flex; align-items:flex-end; overflow:hidden}
  .type-card:first-child .type-visual{border-bottom:0; border-right:1px solid var(--border); min-height:300px}
  .type-visual::before{content:""; position:absolute; inset:20px 20px 54px; border:1px solid rgba(17,24,39,.15); background:repeating-linear-gradient(90deg,transparent 0 46px,rgba(17,24,39,.07) 46px 47px),repeating-linear-gradient(180deg,transparent 0 38px,rgba(17,24,39,.07) 38px 39px)}
  .type-visual.type-image{padding:0; background:#E5E7EB}
  .type-visual.type-image::before{display:none}
  .type-visual.type-image img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
  .type-number{position:absolute; top:18px; left:18px; z-index:1; width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:var(--accent); font-family:var(--display); font-weight:800; font-size:.75rem}
  .type-scene{position:relative; z-index:1; font-size:.72rem; color:var(--muted); max-width:32ch}
  .type-scene b{display:block; font-family:var(--display); text-transform:uppercase; letter-spacing:.1em; font-size:.61rem; color:var(--ink-soft); margin-bottom:2px}
  .type-body{padding:22px 24px 24px; display:flex; flex-direction:column; gap:12px}
  .type-kicker{font-family:var(--display); font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted)}
  .type-body > p{font-size:.9rem; color:var(--ink-soft)}
  .type-topics{display:flex; flex-wrap:wrap; gap:7px; padding-top:2px}
  .type-topics span{font-size:.72rem; padding:4px 8px; background:var(--surface-2); border-radius:999px; color:var(--ink-soft)}
  .type-link{margin-top:auto; padding-top:6px; font-size:.83rem; font-weight:600; text-decoration:none; color:var(--ink); width:fit-content}
  .type-link:hover{text-decoration:underline; text-underline-offset:3px; text-decoration-color:var(--accent)}
  @media (max-width:760px){.type-grid{grid-template-columns:1fr}.type-card:first-child{grid-column:auto; display:flex}.type-card:first-child .type-visual{border-right:0; border-bottom:1px solid var(--border); min-height:230px}}

  .journey{display:grid; grid-template-columns:1fr auto 1fr auto 1fr; gap:16px; align-items:center; border:1px solid var(--border); border-radius:14px; padding:24px; background:var(--surface)}
  .journey-step{display:flex; flex-direction:column; gap:5px}
  .journey-step span{font-family:var(--display); font-size:.64rem; letter-spacing:.1em; color:var(--muted)}
  .journey-step b{font-family:var(--display); font-size:.96rem}
  .journey-step p{font-size:.8rem; color:var(--muted)}
  .journey-arrow{font-size:1.3rem; color:var(--border-strong)}
  @media (max-width:700px){.journey{grid-template-columns:1fr}.journey-arrow{transform:rotate(90deg); justify-self:center}}

  /* Garage type child hub */
  .hub-crumbs{padding-top:24px; font-size:.78rem; color:var(--muted); display:flex; gap:7px; flex-wrap:wrap}
  .hub-crumbs a{text-decoration:none}
  .hub-crumbs a:hover{color:var(--ink)}
  .type-hub-hero{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr); gap:54px; align-items:center; padding-block:clamp(32px,6vw,68px)}
  .type-hub-copy{display:flex; flex-direction:column; gap:17px}
  .type-hub-copy .lede{max-width:61ch}
  .hub-tags{display:flex; flex-wrap:wrap; gap:7px}
  .hub-tags span{font-size:.75rem; color:var(--ink-soft); background:var(--surface-2); border-radius:999px; padding:5px 9px}
  .type-plan{border:1px solid var(--border); border-radius:14px; background:var(--surface); padding:20px; display:grid; grid-template-columns:1fr 1fr; gap:10px; min-height:320px}
  .type-plan-zone{border:1px solid var(--border); border-radius:10px; background:var(--bg); padding:15px; display:flex; flex-direction:column; justify-content:space-between; gap:18px}
  .type-plan-zone span{font-family:var(--display); font-size:.66rem; color:var(--muted); letter-spacing:.1em}
  .type-plan-zone b{font-family:var(--display); font-size:.9rem}
  .type-plan-zone:first-child{border-top:4px solid var(--accent)}
  .type-plan-zone:nth-child(2){border-top:4px solid #9CA3AF}
  .type-plan-zone:nth-child(3){border-bottom:4px solid #D1D5DB}
  .type-plan-zone:nth-child(4){border-bottom:4px solid var(--ink)}
  @media (max-width:860px){.type-hub-hero{grid-template-columns:1fr;gap:28px}.type-plan{min-height:260px}}

  .setup-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px}
  .setup-card{border:1px solid var(--border); border-radius:11px; padding:17px; display:flex; flex-direction:column; gap:7px; background:var(--bg)}
  .setup-card span{font-family:var(--display); font-size:.63rem; letter-spacing:.1em; color:var(--muted)}
  .setup-card b{font-family:var(--display); font-size:.94rem}
  .setup-card p{font-size:.8rem; color:var(--muted)}
  @media (max-width:850px){.setup-grid{grid-template-columns:1fr 1fr}}
  @media (max-width:480px){.setup-grid{grid-template-columns:1fr}}

  .hub-topic-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px}
  .hub-topic{border-top:1px solid var(--border); padding:18px 2px 4px; display:flex; flex-direction:column; gap:6px}
  .hub-topic span{font-family:var(--display); font-size:.62rem; letter-spacing:.1em; color:var(--muted)}
  .hub-topic h3{font-size:1rem}
  .hub-topic p{font-size:.82rem; color:var(--muted)}
  .hub-topic-grid.is-seven .hub-topic:last-child{grid-column:1/-1}
  @media (max-width:760px){.hub-topic-grid{grid-template-columns:1fr 1fr}}
  @media (max-width:480px){.hub-topic-grid{grid-template-columns:1fr}}

  .planned-guides{display:grid; grid-template-columns:repeat(2,1fr); gap:14px}
  .planned-guide{position:relative;border:1px solid var(--border); border-radius:11px; padding:18px; display:flex; flex-direction:column; gap:9px; background:var(--bg); color:inherit; text-decoration:none}
  .planned-guide.is-live{border-color:var(--border-strong)}
  .planned-guide.is-live:hover{border-color:var(--ink)}
  .planned-guide-link{color:inherit;text-decoration:none}
  .planned-guide-link::after{content:"";position:absolute;inset:0;border-radius:11px}
  .planned-guide:focus-within{outline:3px solid var(--ink);outline-offset:3px}
  .planned-guide-top{display:flex; align-items:center; justify-content:space-between; gap:12px}
  .planned-guide-num{font-family:var(--display); font-weight:700; font-size:.7rem; color:var(--muted)}
  .planned-pill{font-family:var(--display); font-weight:600; font-size:.61rem; letter-spacing:.06em; text-transform:uppercase; border-radius:999px; background:var(--surface-2); color:var(--muted); padding:4px 8px}
  .planned-pill.live{background:var(--accent); color:var(--accent-ink)}
  .planned-guide h3{font-size:1rem}
  .planned-guide p{font-size:.82rem; color:var(--muted)}
  .planned-route{margin-top:auto; padding-top:5px; font-size:.72rem; color:var(--ink-soft); overflow-wrap:anywhere}
  @media (max-width:640px){.planned-guides{grid-template-columns:1fr}}

  .hub-live{display:grid; grid-template-columns:1fr auto; gap:20px; align-items:center; border:1px solid var(--border); border-radius:12px; padding:20px 22px}
  .hub-live div{display:flex; flex-direction:column; gap:5px}
  .hub-live p{font-size:.84rem; color:var(--muted)}
  @media (max-width:600px){.hub-live{grid-template-columns:1fr}.hub-live .btn{justify-self:start}}

  .future-picks{display:grid; grid-template-columns:repeat(3,1fr); gap:12px}
  .future-pick{background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:15px 17px; display:flex; flex-direction:column; gap:5px}
  .future-pick b{font-family:var(--display); font-size:.88rem}
  .future-pick span{font-size:.75rem; color:var(--muted)}
  @media (max-width:680px){.future-picks{grid-template-columns:1fr 1fr}}
  @media (max-width:440px){.future-picks{grid-template-columns:1fr}}

  /* GC011 zone-planning diagrams and worksheet */
  .zone-principle{display:grid;grid-template-columns:1fr 36px 1fr;gap:14px;align-items:stretch}
  .zone-layer{border:1px solid var(--border);border-radius:11px;padding:18px;display:flex;flex-direction:column;gap:8px;background:var(--bg)}
  .zone-layer span{font-family:var(--display);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
  .zone-layer p{font-size:.88rem;color:var(--ink-soft)}
  .zone-arrow{display:grid;place-items:center;color:var(--muted);font-size:1.2rem}
  @media (max-width:620px){.zone-principle{grid-template-columns:1fr}.zone-arrow{transform:rotate(90deg);min-height:22px}}

  .zone-map-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .zone-map-card{border:1px solid var(--border);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:12px;background:var(--bg)}
  .zone-map-card h3{font-size:1rem}
  .zone-map-card > p{font-size:.8rem;color:var(--muted)}
  .garage-map{position:relative;display:grid;gap:6px;min-height:330px;border:2px solid var(--ink);padding:8px;background:var(--surface);isolation:isolate}
  .garage-map.one{grid-template-columns:1.2fr .8fr;grid-template-rows:52px 1fr 62px}
  .garage-map.two{grid-template-columns:.7fr 1fr 1fr .7fr;grid-template-rows:58px 1fr 58px}
  .map-zone{display:flex;align-items:center;justify-content:center;text-align:center;padding:7px;border:1px solid var(--border-strong);background:var(--bg);font-family:var(--display);font-size:.68rem;font-weight:600;line-height:1.25}
  .map-zone.daily{background:#fff1b8}.map-zone.weekly{background:#e8edf2}.map-zone.seasonal{background:#f3f4f6}.map-zone.controlled{background:#e5e7eb;border-style:dashed}
  .map-car{display:flex;align-items:center;justify-content:center;border:2px solid var(--ink);border-radius:38px 38px 16px 16px;background:#d9dee4;font-family:var(--display);font-size:.72rem;font-weight:700;letter-spacing:.04em}
  .one .map-entry{grid-column:1}.one .map-seasonal{grid-column:2}.one .map-car{grid-column:1;grid-row:2}.one .map-wall{grid-column:2;grid-row:2}.one .map-waste{grid-column:1}.one .map-control{grid-column:2}
  .two .map-entry{grid-column:1}.two .map-sports{grid-column:2}.two .map-garden{grid-column:3}.two .map-seasonal{grid-column:4}.two .map-car.first{grid-column:2;grid-row:2}.two .map-car.second{grid-column:3;grid-row:2}.two .map-wall{grid-column:1;grid-row:2}.two .map-overflow{grid-column:4;grid-row:2}.two .map-waste{grid-column:1}.two .map-control{grid-column:4}.two .map-path{grid-column:2/4;grid-row:3}
  .map-door{position:absolute;left:8px;right:8px;bottom:-2px;border-bottom:6px double var(--border-strong);z-index:-1}
  .zone-legend{display:flex;flex-wrap:wrap;gap:10px 14px;font-size:.74rem;color:var(--muted)}
  .zone-legend span{display:inline-flex;gap:6px;align-items:center}.zone-legend i{width:11px;height:11px;border:1px solid var(--border-strong);display:inline-block}
  @media (max-width:760px){
    .zone-map-grid{grid-template-columns:minmax(0,1fr)}
    .zone-map-card,.garage-map,.map-zone,.map-car{min-width:0}
    .garage-map{min-height:310px}
    .garage-map.one{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);grid-template-rows:minmax(52px,auto) 1fr minmax(62px,auto)}
    .garage-map.two{grid-template-columns:minmax(0,.7fr) minmax(0,1fr) minmax(0,1fr) minmax(0,.7fr);grid-template-rows:minmax(58px,auto) 1fr minmax(58px,auto)}
    .map-zone,.map-car{overflow-wrap:anywhere}
  }

  .score-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
  .score-card{border-top:3px solid var(--accent);background:var(--surface);padding:16px;display:flex;flex-direction:column;gap:7px}
  .score-card b{font-family:var(--display);font-size:.9rem}.score-card p{font-size:.8rem;color:var(--muted)}
  @media (max-width:600px){.score-grid{grid-template-columns:1fr}}

  .worksheet-preview{border:1px solid var(--border);border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:15px;background:var(--surface)}
  .worksheet-preview h3{font-size:1.05rem}.worksheet-preview p{font-size:.86rem;color:var(--muted)}
  .worksheet-fields{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}
  .worksheet-field{min-height:46px;border:1px solid var(--border);border-radius:7px;background:var(--bg);padding:9px 11px;font-size:.75rem;color:var(--muted)}
  .worksheet-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
  .worksheet-grid-canvas{min-height:320px;border:2px solid var(--ink);background:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);background-size:24px 24px}
  @media (max-width:520px){.worksheet-fields{grid-template-columns:1fr}}

  .source-list{display:flex;flex-direction:column;gap:9px;padding-left:1.15em}
  .source-list li{font-size:.84rem;color:var(--ink-soft)}
  .source-list a{text-underline-offset:3px}

  .editorial-photo{margin:0;display:flex;flex-direction:column;gap:8px}
  .editorial-photo img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border:1px solid var(--border);border-radius:10px;background:var(--surface)}
  .editorial-photo figcaption{font-size:.76rem;line-height:1.5;color:var(--muted)}
  .editorial-photo-lead img{aspect-ratio:16/9}
  @media (max-width:520px){.editorial-photo img{aspect-ratio:4/3}.editorial-photo-lead img{aspect-ratio:16/10}}

  .print-sheet{max-width:960px;margin:0 auto;padding:32px 24px;display:flex;flex-direction:column;gap:22px}
  .print-sheet-head{display:flex;justify-content:space-between;gap:20px;align-items:start;border-bottom:3px solid var(--accent);padding-bottom:16px}
  .print-sheet-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
  .print-field{border:1px solid var(--border-strong);min-height:76px;padding:10px;display:flex;flex-direction:column;gap:18px;font-size:.78rem;color:var(--muted)}
  .print-line{border-bottom:1px solid var(--border-strong);min-height:22px}
  .print-zone-table{width:100%;min-width:0}
  .print-zone-table td{height:52px}
  @media (max-width:620px){.print-sheet-grid{grid-template-columns:1fr}.print-sheet-head{flex-direction:column}}
  @media print{
    body.worksheet-page .site-head,body.worksheet-page .site-foot,body.worksheet-page .print-controls{display:none!important}
    body.worksheet-page .print-sheet{padding:0;max-width:none}
    body.worksheet-page{font-size:10pt;color:#000;background:#fff}
    body.worksheet-page .print-field,body.worksheet-page .print-zone-table th,body.worksheet-page .print-zone-table td{break-inside:avoid;border-color:#777}
    body.worksheet-page a{color:#000;text-decoration:none}
  }

/* Non-visual accessibility helper */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.skip-link{position:fixed;top:calc(env(safe-area-inset-top,0px) + 8px);left:20px;z-index:100;background:var(--accent);color:var(--accent-ink);padding:9px 14px;border-radius:7px;font-family:var(--display);font-weight:700;text-decoration:none;transform:translateY(-160%)}
.skip-link:focus{transform:translateY(0);outline-color:var(--ink)}
.nrow.is-coming:hover h4{text-decoration:none}
.foot-col:not(.foot-brand) a{display:flex;align-items:center;min-height:24px}
.cta-card :focus-visible{outline-color:var(--ink)}
.admin-bar .site-head{top:calc(32px + env(safe-area-inset-top,0px))}
@media (max-width:782px){.admin-bar .site-head{top:calc(46px + env(safe-area-inset-top,0px))}}
/* Reserve flow space for the absolute mobile admin toolbar without collapsing margins. */
@media (max-width:600px){body.admin-bar{padding-top:46px}.admin-bar .site-head{top:env(safe-area-inset-top,0px)}}
.native-search{display:flex;flex-direction:column;gap:8px;margin-block:18px}
.native-search > div{display:flex;flex-wrap:wrap;gap:8px}
.native-search input{min-width:0;flex:1;padding:10px;border:1px solid var(--border-strong);border-radius:7px;font:inherit;color:var(--ink);background:var(--bg)}
.lib-grid > article:focus{outline:3px solid var(--ink);outline-offset:3px}
@media (max-width:480px){
  /* Keep full words legible in the four-column garage diagram. */
  .garage-map.two{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;padding:5px}
  .garage-map.two .map-zone{padding:3px 1px;font-size:.58rem;overflow-wrap:normal;word-break:normal}
}
@media (max-width:385px){
  .head-in{height:auto;min-height:var(--headh);flex-wrap:wrap;gap:8px;padding-block:10px}
  .brand-name{font-size:1rem}
  .brand-rule{width:28px}
  .nav{width:100%;margin-left:0;justify-content:space-between}
  .nav a{display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:6px 8px;font-size:.8rem}
  .nav-search{width:32px;height:32px;margin-left:0}
}