/* ==== BARS EVERYWHERE — SITEWIDE FRAME LAYER (2026-11-09) ====
   Steve's order: the entire site, front to back, wears the left bar
   and the right bar — every reader page. At >=1500px two fixed
   full-height skins (~300px) flank the page while each family's own
   content wrapper narrows into the centered channel between them.
   Below 1500px the skins do not render at all: phones stay clean and
   mid widths keep each family's shipped layout.
   LEFT BAR (Steve, 2026-11-09 23:50 + 23:55, confirmed via Design
   2026-11-10): the whole side bar as REAL ELEMENTS reproducing the
   approved graphic — house line, Re4rge, AuditThenFix, CalculateMine,
   Jynxies, SinScents, Mintalgic as the sixth logo, USA line. No
   pasted image, no tease card on this bar (tease = article rails).
RIGHT BAR: the pets panel (real elements, as shipped). */
.sd-skin{--gold:#C9A227;--gold-lo:#8C6D1F;--bone2:#F4EEE1;
  --ink:#17130B;--ink85:rgba(23,19,11,.85);--ink60:rgba(23,19,11,.6);
  --ink14:rgba(23,19,11,.14);--paper-txt:#FFF6E6;
  --seam:linear-gradient(100deg,#8C6D1F 0%,#E9CE7A 22%,#C9A227 48%,#F4E08D 71%,#96771F 100%);
  --serif:'Fraunces',Georgia,serif;--sans:'Libre Franklin',Helvetica,Arial,sans-serif}
.sd-skin{display:none}
@media (min-width:1500px){
  .mh-bar,.mh-desk,.site-ticker,.sdnav,.gp-head{margin-left:300px;margin-right:300px}
  /* pet base (front.css, scoped — families without .pet rules);
     precedes the skin overrides so they win ties, as on articles */
  .sd-skin .pet{border:2px solid var(--ink);border-radius:8px;background:#fff;   box-shadow:4px 4px 0 var(--gold);padding:15px 16px 16px}
  .sd-skin .pet-kick{font-size:11px;font-weight:800;letter-spacing:2.2px;   text-transform:uppercase;color:var(--gold-lo)}
  .sd-skin .pet-frame{aspect-ratio:1;border:1.5px dashed var(--gold-lo);   border-radius:6px;background:var(--bone2);display:flex;align-items:center;   justify-content:center;margin:12px 0}
  .sd-skin .pet-frame-photo{border:1.5px solid var(--ink);overflow:hidden;display:block}
  .sd-skin .pet-frame img{width:100%;height:100%;object-fit:cover;display:block}
  .sd-skin .pet-line{font-family:var(--serif);font-weight:700;font-size:16px;   line-height:1.35;margin:0}
  .sd-skin .pet-sub{font-size:12.5px;line-height:1.55;color:var(--ink85);margin:8px 0 0}
  .sd-skin .pet-credit{font-size:10.5px;font-weight:700;letter-spacing:1.1px;   text-transform:uppercase;color:var(--ink60);margin:10px 0 0}
  .sd-skin .pet-frame-photo{aspect-ratio:auto}
  .sd-skin .pet-frame-photo img{height:auto}
  .sd-skin .pet-link{display:block;text-decoration:none;color:inherit}
  .sd-skin .pet-link:hover .pet-line{text-decoration:underline;   text-underline-offset:3px}
  .sd-skin{display:block;position:fixed;top:0;bottom:0;width:300px;
    z-index:40;overflow:hidden}
  .sd-skin-l{left:0;border-right:1px solid var(--gold-lo)}
  .sd-skin-r{right:0;border-left:1px solid var(--gold-lo);
    background:var(--bone2)}
  .sd-skin-l{background:#070708}
  .sd-skin-art{position:absolute;inset:0;
    background:url(assets/house/skin-left-b.webp?v=de9485e70f) center/cover no-repeat}
  .sd-hot{position:absolute;left:0;right:0;display:block}
  .sd-hot-re4rge{top:16.5%;height:8%}
  .sd-hot-atf{top:25%;height:16%}
  .sd-hot-cm{top:42.5%;height:10.5%}
  .sd-hot-jynx{top:53.5%;height:11.5%}
  .sd-hot-ss{top:66%;height:10%}
  .sd-hot-mint{top:76.5%;height:17.5%}
  .sd-skin-in{position:relative;height:100%;overflow:hidden;
    display:flex;flex-direction:column;align-items:stretch;
    padding:26px 22px;gap:14px}
  .sd-skin-l .sd-skin-in{padding:var(--bartop,52px) 20px 24px}
  .sd-skin-r .sd-skin-in{padding:calc(var(--bartop,52px) - 57px) 0 0}
  .sd-skin-r .pet{border:none;box-shadow:none;background:transparent;
    border-radius:0;padding:20px 20px 16px;margin:0}
  .sd-skin-r .pet-frame{width:100%;height:auto;margin:12px 0}
  .sd-skin-r .pet-kick{font-size:11px}
  .sd-skin-r .pet-line{font-family:var(--serif);font-size:19px;
    line-height:1.3}
  .sd-skin-r .pet-sub{font-size:12.5px;line-height:1.55}
  /* — the house card (Steve's rail design, values as shipped on
     articles): parchment card, real text, real linked logos — */
  .house{border:2px solid var(--ink);border-radius:8px;
    background:linear-gradient(180deg,#F8EFDA,#F2E4C4);
    box-shadow:4px 4px 0 var(--gold);padding:0 16px 15px}
  .house-seam{height:6px;background:var(--seam);box-shadow:0 1.5px 0 var(--ink);
    margin:0 -16px 13px}
  .house-line{font-family:var(--serif);font-weight:700;font-size:16.5px;
    line-height:1.4;margin:0;color:var(--ink)}
  .house-list{margin-top:4px}
  .house-row{display:flex;align-items:center;gap:10px;text-decoration:none;
    padding:10px 0;border-top:1px solid var(--ink14)}
  .house-row:first-child{border-top:none;padding-top:6px}
  .house-row:hover .house-name{text-decoration:underline;
    text-underline-offset:3px}
  .house-logo{display:block;width:148px;max-width:100%;height:auto}
  .house-ss{display:block;background:#000;border-radius:6px;
    padding:5px 7px;width:100%}
  .house-ss .house-logo{width:100%}
  .house-jynx{height:42px;width:auto;flex:none}
  .house-name{font-family:var(--serif);font-weight:900;font-size:19px;
    line-height:1.15;color:var(--ink)}
  .house-atf-logo{display:block;height:46px;width:46px;flex:none}
  .house-cm-logo{display:block;width:156px;max-width:100%;height:auto;
    border-radius:6px}
  .house-mint-logo{display:block;width:150px;max-width:100%;height:auto}
  .house-usa{font-size:12.5px;font-weight:700;line-height:1.55;
    color:var(--ink85);border-top:1px solid var(--ink14);
    padding-top:11px;margin:4px 0 0}
  /* — the Mintalgic tease card: ink card, his copy verbatim — */
  .tease{display:block;text-decoration:none;background:var(--ink);
    border:2px solid var(--ink);border-radius:8px;
    box-shadow:4px 4px 0 var(--gold);padding:16px}
  .tease-copy{font-family:var(--serif);font-weight:600;font-size:15px;
    line-height:1.55;color:var(--paper-txt);margin:0}
  .tease:hover .tease-copy{text-decoration:underline;
    text-underline-offset:3px}
  /* — the tip jar (Buy Me a Coffee rail unit) — */
  .cfu{border:2px solid var(--ink);border-radius:8px;background:#fff;
    box-shadow:6px 6px 0 var(--gold);padding:0 20px 20px;max-width:520px}
  .cfu-seam{height:6px;background:var(--seam);box-shadow:0 1.5px 0 var(--ink);
    margin:0 -20px 15px}
  .cfu-line{font-family:var(--serif);font-weight:700;font-size:19px;
    line-height:1.42;margin:0;color:var(--ink)}
  .cfu-draft{display:inline-block;vertical-align:2px;font-family:var(--sans);
    font-size:9px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase;
    color:#7E0A1A;border:1.5px solid #A60E22;border-radius:4px;padding:2px 6px;
    background:rgba(166,14,34,.06);white-space:nowrap}
  .cfu-btn{display:inline-block;margin-top:14px;font-size:13.5px;font-weight:600;
    letter-spacing:.2px;text-decoration:none;color:var(--gold-lo);
    border:1.5px solid var(--gold-lo);border-radius:999px;padding:10px 18px;
    background:rgba(201,162,39,.06)}
  .cfu-btn:hover{background:rgba(201,162,39,.15)}
  .cfu-rail{max-width:none;box-shadow:4px 4px 0 var(--gold);padding:0 16px 16px}
  .cfu-rail .cfu-seam{margin:0 -16px 13px}
  .cfu-rail .cfu-line{font-size:16.5px}
  .cfu-rail .cfu-btn{padding:9px 14px;font-size:13px}
  .site-ticker{position:relative;z-index:60}
  /* — sleeve caps: each family's own wrapper, same channel — */
  .lf-wrap{max-width:min(1360px,calc(100vw - 660px))}
  .sheet{max-width:min(1180px,calc(100vw - 660px))}
  .gx-top,.gx-wrap,.gx-foot{max-width:min(920px,calc(100vw - 660px))}
  .gp-head,.gp-main{max-width:min(780px,calc(100vw - 660px))}
  .gp-head.gp-wide,.gp-main.gp-wide{max-width:min(920px,calc(100vw - 660px))}
  .mh-desk-in{max-width:min(1460px,calc(100vw - 660px))}
}
/* skin-compact stack (2026-11-09): inside the fixed bar the stack
   must fit under --bartop at real viewport heights, so the bar runs
   the rail design's compressed sizes at every height; below 920px
   the tip jar leaves the bar (it lives on in the page closers and
   the section-bar menu). In-flow rails keep their shipped sizes. */
@media (min-width:1500px){
  .sd-skin-l .house-line{font-size:15px}
  .sd-skin-l .house-row{padding:5px 0}
  .sd-skin-l .house-row:first-child{padding-top:3px}
  .sd-skin-l .house-logo{width:116px}
  .sd-skin-l .house-mint-logo{width:132px}
  .sd-skin-l .house-ss .house-logo{width:56%}
  .sd-skin-l .house-jynx{height:30px}
  .sd-skin-l .house-atf-logo{height:40px;width:40px}
  .sd-skin-l .house-cm-logo{width:140px}
  .sd-skin-l .house-usa{font-size:11.5px;line-height:1.45;padding-top:8px}
  .sd-skin-l .tease{padding:12px}
  .sd-skin-l .tease-copy{font-size:13px;line-height:1.45}
  .sd-skin-l .cfu-rail .cfu-line{font-size:14.5px}
  .sd-skin-l .cfu-rail .cfu-btn{margin-top:10px}
}
@media (min-width:1500px) and (max-height:919px){
  .sd-skin-l .cfu{display:none}
}

/* ——— DIRECTORY FOOTER (Screen Daily model, Steve 2026-11-10) ——— */
  .ft-dir{margin-top:26px;border-top:2px solid #C9A227;padding-top:16px}
  .ft-quick{display:flex;flex-wrap:wrap;gap:4px 18px;margin-bottom:16px}
  .ft-dir .ft-quick a,.lf-foot .ft-quick a{color:#17130B;font-family:"Libre Franklin",sans-serif;
    font-size:11.5px;font-weight:800;letter-spacing:1.4px;
    text-transform:uppercase;text-decoration:none}
  .ft-dir .ft-quick a:hover,.lf-foot .ft-quick a:hover{color:#8C6D1F}
  .ft-cols{display:flex;flex-wrap:wrap;gap:18px 34px}
  .ft-col{display:flex;flex-direction:column;gap:6px;min-width:150px}
  .ft-h{font-family:"Libre Franklin",sans-serif;font-size:11px;
    font-weight:800;letter-spacing:2px;text-transform:uppercase;
    color:#8C6D1F;margin:0 0 4px}
  .ft-dir .ft-col a{color:#17130B;font-size:13.5px;font-weight:600;
    text-decoration:none}
  .ft-dir .ft-col a:hover{color:#8C6D1F;text-decoration:underline}

  .ft-dir .ft-col a.ft-boss{font-family:"Fraunces",Georgia,serif;font-size:17px;font-weight:900;color:#17130B}
  .ft-dir .ft-col a.ft-sub{margin-left:12px}