/* Section styles for farrarilabs.com — carried 1:1 from the approved design
   mocks (round 13/14, job j1004-2e456a). theme.css holds the theme tokens;
   this file holds the page sections. The additions block at the bottom covers
   only what the mocks rendered as static divs but the real site needs as
   working elements (form fields, images in frames). */

/* 01 — hero */
.hero{padding:26px 24px 0;text-align:center;flex:none}
.cave-tag{transform:rotate(-2deg);display:inline-block;margin-bottom:14px}
.hero h1{font-size:44px;letter-spacing:-.025em;line-height:1.02}
.hero h1 .inl{display:inline-block;width:30px;height:30px;border-radius:9px;background:#fff;border:1px solid var(--line);box-shadow:0 4px 10px rgba(61,41,26,.1);vertical-align:-4px;padding:6px;margin:0 2px}
.hero p{font-size:15px;color:var(--text);line-height:1.5;margin:14px auto 0;max-width:290px}
.hero-cta{display:flex;gap:10px;justify-content:center;margin-top:18px}
.ring{position:relative;height:400px;margin-top:14px;flex:none}
.ring .core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:0 10px 24px rgba(61,41,26,.1);display:flex;align-items:center;justify-content:center}
.mini{position:absolute;width:118px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 30px rgba(61,41,26,.1);padding:12px 12px 10px;text-align:left}
a.mini{color:inherit;text-decoration:none;cursor:pointer;transition:box-shadow .15s}a.mini:hover,a.mini:focus-visible{box-shadow:0 14px 30px rgba(61,41,26,.1),0 0 0 2px var(--line)}
.mini .chip{font-size:9px;padding:3px 8px;letter-spacing:.08em}
.mini b{display:block;font-size:20px;letter-spacing:-.02em;margin-top:8px}
.mini i{display:block;font-style:normal;font-size:9.5px;color:var(--text);line-height:1.45;margin-top:4px}
.learn{position:absolute;left:50%;transform:translateX(-50%);bottom:0}
.pipe{display:block;font-family:var(--hand);font-weight:400;color:var(--pen);font-size:23px;letter-spacing:0;line-height:1.15;transform:rotate(-2deg);margin-top:9px}
.pipe-sec{padding:2px 20px 8px;flex:none}

/* 02 — the districts */
.wrap{padding:10px 20px 0;flex:none}
.wrap h1{font-size:26px}
.sub{font-size:13px;color:var(--text);margin-top:6px}
.pick{float:right;margin-top:-30px;transform:rotate(-2deg)}
.list{display:flex;flex-direction:column;gap:14px;padding:18px 20px 0;flex:none}
.rcard{display:block;text-decoration:none;color:var(--ink);padding:16px 18px}
.rrow{display:flex;align-items:center;justify-content:space-between;gap:10px}.rrow .mono{font-size:9.5px;text-align:right}
.rname{font-size:23px;font-weight:800;letter-spacing:-.02em;margin-top:10px}
.rrole{font-size:13px;color:var(--text);margin-top:3px}
.rfig{margin-top:12px;padding-top:12px;border-top:1px solid var(--line-soft);display:flex;align-items:baseline;gap:10px}
.rfig b{font-size:20px;letter-spacing:-.02em}
.rfig span{font-size:11px;color:var(--mute);line-height:1.4}
.ropen{margin-top:12px;font-size:13px;font-weight:800;color:var(--accent)}
.fleetnote{padding:20px 20px 0;flex:none}
.fleetcard{display:block;margin:8px 20px 0;text-decoration:none;background:var(--ink);color:var(--bg);border-radius:18px;padding:18px 18px 16px;box-shadow:0 14px 30px rgba(51,38,26,.3);position:relative;overflow:hidden}
.frow{display:flex;align-items:center;justify-content:space-between}
.fchip{font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:.18em;border:1px solid rgba(253,250,244,.4);color:#fdfaf4;border-radius:999px;padding:4px 10px}
.fmono{font-family:var(--mono);font-size:9px;color:rgba(253,250,244,.55)}
.fname{font-size:23px;font-weight:800;letter-spacing:-.02em;margin-top:12px;color:#fdfaf4}
.frole{font-size:13px;line-height:1.45;color:rgba(253,250,244,.72);margin-top:4px}
.fopen{margin-top:12px;font-size:13px;font-weight:800;color:#f0a284}
.fspark{position:absolute;right:-14px;bottom:-18px;width:96px;height:96px;opacity:.14}

/* 03–06 — district profiles */
.head{padding:8px 20px 0;flex:none}
.head h1{font-size:42px;margin-top:12px}
.tagline{font-size:14px;color:var(--text);margin-top:6px}
.stats{display:flex;gap:10px;margin-top:20px}
.stats .stat{flex:1;background:var(--bg-soft);border-radius:14px;padding:12px 12px 10px}
.proofwrap{padding:20px 20px 0;flex:none}
.tabs{margin-bottom:16px}
.proof{padding:16px 18px}
.proof .cap{font-size:11px;font-weight:800;letter-spacing:.09em;color:var(--mute)}
.prow{display:flex;gap:10px;align-items:flex-start;margin-top:12px;font-size:14px;line-height:1.45}
.prow .spark{margin-top:3px;width:12px;height:12px}
.nref{margin-top:14px;padding:12px 16px;background:var(--bg-soft);border-radius:14px;font-size:12.5px;color:var(--text)}
.nref b{color:var(--ink);font-weight:700}
.nb{display:flex;justify-content:space-between;padding:20px 20px 0;flex:none}
.quiet{padding:16px 18px;display:flex;align-items:center;justify-content:space-between;gap:10px}

/* 07 — notes index */
.nlist{display:flex;flex-direction:column;gap:12px;padding:18px 20px 0;flex:none}
.ncard{display:block;text-decoration:none;color:var(--ink);padding:14px 16px}
.nrow{display:flex;align-items:center;justify-content:space-between}
.ndate{font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--mute)}
.ntitle{font-size:16px;font-weight:700;margin-top:8px;letter-spacing:-.01em}

/* 08 — single note */
.np{padding:14px 24px 0;flex:none}
.kick{display:flex;align-items:center;gap:10px}
.np h1{font-size:29px;margin-top:14px}
.body{padding:16px 24px 0;flex:none;font-size:15px;line-height:1.65;color:var(--text)}
.body p{margin-bottom:14px}
.body b{color:var(--ink)}
.rename{padding:16px 18px;margin-top:4px}
.rename div{font-family:var(--mono);font-size:12px;color:var(--text);padding:5px 0;border-bottom:1px solid var(--line-soft)}
.rename div:last-child{border-bottom:0}
.rename b{color:var(--ink);font-weight:500}
.next{padding:6px 24px 0;flex:none;font-size:14px;font-weight:700;color:var(--accent);text-decoration:none;display:block}
.back{padding:18px 24px 0;flex:none}

/* 09 — the desk */
.desk{flex:1;display:flex;flex-direction:column;align-items:center;padding:18px 28px 0;text-align:center;min-height:0}
.mark{width:56px;height:56px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:0 10px 24px rgba(61,41,26,.1);display:flex;align-items:center;justify-content:center;margin-top:26px}
.mark .spark{width:24px;height:24px}
.desk h1{font-size:26px;margin-top:20px;letter-spacing:-.02em}
.desk .sub{font-size:13.5px;color:var(--text);margin-top:8px;line-height:1.5;max-width:280px}
.form{width:100%;margin-top:22px;display:flex;flex-direction:column;gap:12px}
.f{width:100%;background:#f3ecdf;border:0;border-radius:14px;padding:15px 16px;font-family:var(--font);font-size:14px;color:var(--mute);text-align:left}
.f.area{height:104px}
.send{width:100%;background:var(--accent);color:#fff;border-radius:999px;padding:14px 0;font-size:15px;font-weight:800;font-family:var(--font);border:0}
.help{font-size:11px;color:var(--mute);margin-top:10px}
.scribble{align-self:flex-end;margin:10px 6px 0 0;transform:rotate(-3deg)}

/* 10 — the fleet */
.blk{padding:16px 20px 0;flex:none}
.blk .scap{margin-bottom:10px}
.kb{padding:16px 16px 14px;position:relative}
.kb .cap{font-size:11px;font-weight:800;letter-spacing:.09em;color:var(--mute)}
.kbt{font-size:17px;font-weight:800;letter-spacing:-.02em;margin-top:6px}
.kbd{font-size:12.5px;color:var(--text);line-height:1.5;margin-top:5px}
.kbchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}
.kbmono{margin-top:11px;padding-top:10px;border-top:1px solid var(--line-soft)}
.kb .pick{position:absolute;right:14px;top:12px;transform:rotate(3deg)}
.bigstack{padding:14px 16px;display:flex;flex-direction:column;gap:13px}
.gcap{font-size:9px;font-weight:800;letter-spacing:.1em;color:var(--mute);margin-bottom:7px}

/* 11 — swap the brain (its own proof values, scoped so the district
   profile keeps the mock 03 values) */
.quote{padding:16px 18px}
.quote p{font-size:14.5px;line-height:1.55;color:var(--ink)}
.quote .mono{display:block;margin-top:10px}
body.swap .proof{padding:14px 18px}
body.swap .prow{margin-top:11px}
body.swap .prow:first-of-type{margin-top:0}
body.swap .prow .spark{flex:none}

/* additions — real elements where the mocks had static divs */
input.f,textarea.f{appearance:none;-webkit-appearance:none;resize:none;outline:none;color:var(--ink)}
input.f::placeholder,textarea.f::placeholder{color:var(--mute);opacity:1}
input.f:focus,textarea.f:focus{box-shadow:0 0 0 2px rgba(45,102,201,.22)}
.send{cursor:pointer}
.form-status{display:none;font-size:12px;color:var(--accent);text-align:center}
.form-status.err{color:var(--red)}
.shot .ph img{width:100%;height:104px;display:block}
.note-shots{flex-wrap:wrap}
.note-shots .shot{flex:1 1 calc(50% - 5px)}
a.nref{display:block;text-decoration:none}

/* ============================================================
   Responsive shell, persistent menu, lottie + reveals
   (approved mock j1005-311d47, design round 1). Phone first;
   tablet ≥768, desktop ≥1100. Content centers in a 1200 shell.
   ============================================================ */
main.shell{width:100%;max-width:1200px;margin:0 auto;flex:1;display:flex;flex-direction:column}
footer{width:100%;max-width:1200px;margin:auto auto 0}

/* sticky header */
.topbar{position:sticky;top:0;z-index:20;background:rgba(253,250,244,.88);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line-soft)}
.soft .topbar{background:rgba(246,239,228,.9)}
.bar{height:60px;display:flex;align-items:center;gap:14px;padding:0 20px}
.bar .wordmark{text-decoration:none;color:var(--ink);margin-right:auto}
nav.links{display:none;height:auto;padding:0;gap:26px;margin-right:22px}
.links a{font-size:14.5px;font-weight:600;color:var(--text);text-decoration:none;padding:20px 0 18px}
.links a.on{color:var(--red);font-weight:800;box-shadow:inset 0 -2px 0 var(--red)}
.bar .pill-blue{font-size:13px;padding:8px 14px}
.pill-blue.on{box-shadow:0 0 0 3px var(--bg),0 0 0 5px var(--accent)}
.menubtn,.closebtn{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 12px;font:700 13px var(--font);color:var(--ink);box-shadow:0 4px 10px rgba(61,41,26,.06);cursor:pointer}
.menubtn i{display:flex;flex-direction:column;gap:3px}
.menubtn i b{display:block;width:13px;height:1.6px;background:var(--ink);border-radius:2px}
nav.crumb{height:auto;justify-content:flex-start;gap:8px;padding:12px 20px 0}
.crumb a{font-size:12.5px;font-weight:700;color:var(--accent);text-decoration:none}
.crumb .sep{color:var(--mute);font-size:12px}
.crumb .here{font-size:12.5px;font-weight:700;color:var(--ink)}

/* phone menu sheet */
.sheet{display:none;position:fixed;inset:0;z-index:40;background:rgba(51,38,26,.28)}
.menu-open .sheet{display:block}
.sheet[hidden]{display:none!important}
.menu-open{overflow:hidden}
.sheet .panel{background:var(--bg);border-radius:0 0 24px 24px;box-shadow:0 24px 50px rgba(51,38,26,.22);padding-bottom:22px;max-height:100vh;overflow:auto}
.sheet .bar{border-bottom:1px solid var(--line-soft)}
nav.mlist{display:block;height:auto;padding:8px 20px 0}
.mitem{display:flex;align-items:center;gap:14px;padding:15px 0;border-bottom:1px solid var(--line-soft);text-decoration:none;color:var(--ink)}
.mitem .n{font-family:var(--mono);font-size:11px;font-weight:700;color:var(--mute);width:22px}
.mitem b{font-size:27px;font-weight:800;letter-spacing:-.02em}
.mitem em{margin-left:auto;font-style:normal;font-family:var(--mono);font-size:10px;color:var(--mute)}
.mitem.on b,.mitem.on .n{color:var(--red)}
.mitem.on em{font-family:var(--hand);font-size:17px;color:var(--pen);transform:rotate(-3deg)}
.mcities{padding:16px 20px 0}
.mcities .row{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.mcities .chip{font-size:10.5px;padding:6px 11px;text-decoration:none}

/* lottie slots */
.lot{display:block;pointer-events:none}
.lot svg{display:block;width:100%;height:100%}
.ring .orbit{position:absolute;left:50%;top:50%;width:230px;height:230px;transform:translate(-50%,-50%);z-index:0}
.mini,.ring .core,.learn{z-index:1}
.mini .lot{position:absolute;right:8px;bottom:8px;width:24px;height:24px}
.mini i{padding-right:20px}
.rcard{position:relative}
.rcard .lot{position:absolute;right:14px;bottom:12px;width:46px;height:46px}
.head{position:relative}
.head .lot{position:absolute;right:20px;top:14px;width:84px;height:84px}
.desk-intro{display:flex;flex-direction:column;align-items:center}

/* scroll reveals (anim.js only tags what starts below the fold) */
.rv{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
.list .rcard:nth-child(2).rv,.nlist .ncard:nth-child(3n+2).rv{transition-delay:.08s}
.list .rcard:nth-child(3).rv,.nlist .ncard:nth-child(3n).rv{transition-delay:.16s}
.list .rcard:nth-child(4).rv{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ---------- tablet ≥768 ---------- */
@media (min-width:768px){
  .bar{padding:0 32px;height:64px}
  nav.links{display:flex}
  .menubtn{display:none}
  nav.crumb{padding:16px 20px 0}
  main.shell{padding:0 12px}
  footer{padding:16px 32px 22px}
  .hero{padding-top:44px}
  .hero h1{font-size:62px}
  .hero p{max-width:520px;font-size:17px}
  .ring{width:100%;max-width:640px;margin:22px auto 0;height:470px}
  .ring .orbit{width:300px;height:300px}
  .ring .core{width:64px;height:64px}
  .mini{width:160px;padding:14px}
  .mini b{font-size:24px}
  .mini i{font-size:11px}
  .pipe-sec{max-width:640px;margin:18px auto 0;width:100%}
  .wrap h1{font-size:36px}
  .list{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .nlist{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .head h1{font-size:56px}
  .head .lot{width:110px;height:110px;right:24px}
  .stats .stat{padding:16px 16px 14px}
  .shot .ph,.shot .ph img{height:180px}
  .np,.note-rest{max-width:720px;margin-left:auto;margin-right:auto;width:100%}
  .np{padding:22px 24px 0}
  .np h1{font-size:40px}
  .tldr{margin:18px 0 0}
  .desk{max-width:560px;margin:0 auto;width:100%}
}

/* ---------- desktop ≥1100 ---------- */
@media (min-width:1100px){
  .bar{padding:0 48px;height:72px;max-width:1296px;margin:0 auto}
  nav.crumb{padding:22px 20px 0}
  main.shell{padding:0 28px}
  footer{padding:18px 48px 24px;max-width:1296px}
  /* home: text | animated ring */
  .home-top{display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:24px;padding-top:30px}
  .home-top .hero{text-align:left;padding:0 20px}
  .home-top .hero h1{font-size:84px}
  .home-top .hero .pipe{font-size:34px}
  .home-top .hero p{margin-left:0;max-width:460px;font-size:18px}
  .home-top .hero-cta{justify-content:flex-start;margin-top:26px}
  .home-top .ring{height:560px;max-width:600px;margin:0}
  .home-top .ring .orbit{width:340px;height:340px}
  .home-top .ring .core{width:84px;height:84px;border-radius:22px}
  .home-top .ring .core .spark{width:22px;height:22px}
  .mini{width:178px}
  .mini b{font-size:27px}
  .pipe-sec{max-width:none;margin:30px 0 0;padding:0 20px 8px}
  /* districts: four across */
  .wrap{padding-top:28px}
  .wrap h1{font-size:44px}
  .pick{margin-top:-36px}
  .list{grid-template-columns:repeat(4,1fr)}
  .fleetcard{padding:24px 28px}
  .nlist{grid-template-columns:repeat(3,1fr)}
  /* district page: header row + two columns */
  .head{padding-top:18px}
  .head h1{font-size:72px}
  .head .tagline{font-size:17px;max-width:640px}
  .dcols{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:start}
  /* desk: intro left, form right */
  .desk{max-width:1000px;display:grid;grid-template-columns:1fr 1fr;gap:56px;text-align:left;align-items:start;padding-top:56px}
  .desk-intro{align-items:flex-start}
  .desk .mark{margin-top:0}
  .desk h1{font-size:40px}
  .desk .sub{max-width:380px;font-size:15px}
  .desk .form{margin-top:0;background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px;box-shadow:0 10px 24px rgba(61,41,26,.06)}
  .desk{align-content:start}
  .desk .scribble{grid-row:2;grid-column:2;justify-self:end;align-self:start;margin-top:4px}
  /* fleet */
  .fleet-cols{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:start}
}

/* ---------- workflow visuals (job j1005-e6521b): how an ask travels, planned-city
   flows, WHY THIS CITY pin tiles, proof ledgers, district flow diagrams, fleet map.
   Markup comes from build.py (travel_html, flow_html, ...); data from content/. */
.lock{width:12px;height:12px;display:block}
.lock rect{fill:currentColor}.lock path{stroke:currentColor;fill:none;stroke-width:1.7}

/* ---------- how an ask travels ---------- */
.travel-sec{padding:26px 20px 6px;flex:none}
.travel{padding:18px 16px 14px;position:relative}
.travel .lead{font-size:20px;font-weight:800;letter-spacing:-.02em;line-height:1.15}
.travel .lead i{font-style:normal;color:var(--text);font-weight:500;font-size:13px;display:block;letter-spacing:0;margin-top:4px}
.tsteps{list-style:none;margin-top:16px;position:relative}
.tn:before{content:"";position:absolute;left:14px;top:50%;height:100%;width:2px;background:var(--line-soft);transition:background .3s}
.tn:last-child:before{display:none}
.tn.past:before{background:#e8a28f}
.tn .here{display:none}
.tn{display:grid;grid-template-columns:30px 1fr auto;gap:10px;align-items:center;position:relative;padding:5px 0}
.td{width:30px;height:30px;border-radius:999px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:10.5px;font-weight:700;color:var(--red);position:relative;z-index:1}
.tn .td{transition:background .3s,border-color .3s,color .3s,box-shadow .3s}
.tn.past .td{background:#fff5ef;border-color:#f0c9b6}
.tn b{font-size:14px;font-weight:800;letter-spacing:-.01em;display:block;line-height:1.2}
.tn small{display:block;font-size:11.5px;color:var(--text);line-height:1.35;margin-top:1px}
.tn .chip{font-size:8.5px;padding:3px 7px}
.tn .chips{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end;max-width:140px}
.lanepills{display:flex;gap:4px;margin-top:5px}
.lanepills span{font-family:var(--mono);font-size:9px;border:1px solid var(--line);border-radius:999px;padding:2px 7px;color:var(--mute)}
.lanepills span.on{border-color:var(--red);color:var(--red);font-weight:700}
.tn.gate{margin:4px 0;padding:8px 8px 8px 0;}
.tn.gate:after{content:"";position:absolute;left:-6px;right:-6px;top:0;bottom:0;border-radius:12px;background:var(--bg-soft);z-index:0}
.tn.gate>*{position:relative;z-index:1}
.tn.gate .td{border:1.5px solid var(--mute);color:var(--mute);background:#fff}
.tn.gate.past .td,.tn.gate.lit .td{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 0 0 4px rgba(201,67,43,.16)}
.gtag{font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:.08em;border-radius:999px;padding:3px 7px;border:1px solid var(--mute);color:var(--mute);white-space:nowrap}
.lit .gtag{border-color:var(--red);color:var(--red)}
.tn.now .td{border:2px solid var(--red);box-shadow:0 0 0 5px rgba(201,67,43,.12)}
.tn.now .td:after{content:"";position:absolute;width:8px;height:8px;border-radius:9px;background:var(--red)}
.tn.now .td span{display:none}
.tn.now .here{display:block;font-family:var(--hand);color:var(--pen);font-size:15px;transform:rotate(-3deg);white-space:nowrap}
.tn.end .td{background:var(--ink);border-color:var(--ink);color:#fff}
.tlegend{display:flex;gap:14px;flex-wrap:wrap;margin-top:12px;padding-top:11px;border-top:1px solid var(--line-soft);font-family:var(--mono);font-size:9.5px;color:var(--mute);align-items:center}
.tlegend span{display:inline-flex;align-items:center;gap:6px}
.tlegend .k{width:16px;height:16px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center}
.tlegend .k.l{background:var(--red);color:#fff}.tlegend .k.w{border:1.5px solid var(--mute);color:var(--mute)}
.tlegend .k .lock{width:9px;height:9px}

/* ---------- planned cities (greyed pre-wired flow) ---------- */
.soonflows{display:flex;flex-direction:column;gap:10px}
.sflow{background:#fff;border:1.5px dashed var(--line);border-radius:14px;padding:12px 12px 12px;box-shadow:0 6px 16px rgba(61,41,26,.05);filter:grayscale(1);opacity:.62}
.sflow .top{display:flex;align-items:center;justify-content:space-between}
.sflow .chip{font-size:9px;padding:3px 9px;background:transparent;border:1.5px dashed var(--mute);color:var(--text);letter-spacing:.09em}
.wnext{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.08em;color:var(--text);border:1px solid var(--mute);border-radius:999px;padding:2px 8px}
.sflow .job{font-size:12px;color:var(--text);margin-top:7px}
.fchain{display:flex;align-items:center;gap:4px;margin-top:9px;flex-wrap:wrap}
.fchain span{font-size:10.5px;font-weight:700;border:1px solid var(--line);border-radius:999px;padding:4px 8px;display:inline-flex;align-items:center;gap:4px;color:var(--ink)}
.fchain span.g{border:1.5px solid var(--ink)}
.fchain span.x{text-decoration:line-through;color:var(--text)}
.fchain em{font-style:normal;color:var(--mute);font-size:11px}
.fchain .lock{width:10px;height:10px}
.moretag{display:flex;justify-content:center;margin-top:2px}
.moretag .chip{font-size:9px;padding:3px 9px;background:transparent;border:1.5px dashed var(--line);color:var(--mute);letter-spacing:.09em}

/* ---------- city origin: caption + map pin ---------- */
.origin{display:grid;grid-template-columns:104px 1fr;gap:14px;padding:12px;align-items:center}
.otile{position:relative;height:84px;border-radius:12px;background:var(--bg-soft);overflow:hidden}
.otile svg{position:absolute;inset:0;width:100%;height:100%}
.otile path{stroke:#d9cbb4;stroke-width:1.7;stroke-linecap:round}
.otile .pin{position:absolute;left:50%;top:50%;width:14px;height:14px;border-radius:99px;transform:translate(-50%,-50%);border:3px solid #fff;box-shadow:0 2px 8px rgba(61,41,26,.25)}
.otile .pin:before{content:"";position:absolute;inset:-9px;border-radius:99px;border:1.5px solid currentColor;opacity:.35}
.origin p{font-size:14px;line-height:1.45;color:var(--ink);font-weight:500}
.origin .mono{display:block;margin-top:6px;font-size:9.5px}

/* ---------- dated ledger (proof) ---------- */
.ledger{padding:6px 16px}
.lrow{display:grid;grid-template-columns:62px 14px 1fr auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line-soft);position:relative}
.lrow:last-child{border-bottom:0}
.lrow .ld{font-family:var(--mono);font-size:10px;color:var(--mute);line-height:1.3}
.lrow .lt{font-size:13.5px;line-height:1.35}
.lrow .lt b{font-weight:800}
.lrow .dot{width:10px;height:10px;border-radius:9px;background:var(--red);justify-self:center}
.lrow .dot.o{background:#fff;border:2px solid var(--red)}
.lrow .dot.x{background:var(--mute)}
.lrow .ok{font-family:var(--mono);font-size:11px;font-weight:700;color:var(--red)}
.lrow .ok.n{color:var(--mute)}

/* ---------- per-district flow strip (vertical rail) ---------- */
.flow{padding:14px 14px 12px}
.fsteps{position:relative}
.fsteps:before{content:"";position:absolute;left:11px;top:10px;bottom:10px;width:2px;background:var(--line-soft)}
.fs{display:grid;grid-template-columns:24px 1fr;gap:10px;align-items:center;padding:5px 0;position:relative}
.fs .fd{width:24px;height:24px;border-radius:99px;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:9.5px;font-weight:700;z-index:1;background:var(--c-bg);color:var(--c-tx)}
.fs b{font-size:13.5px;font-weight:800;letter-spacing:-.01em}
.fs i{font-style:normal;font-size:11.5px;color:var(--text);margin-left:6px}
.fs.gate .fd{background:#fff;border:1.5px solid var(--red);color:var(--red)}
.fs.gate b{color:var(--red)}
.fs.gate .gtag{margin-left:6px;border-color:var(--red);color:var(--red)}
.fs.end .fd{background:var(--ink);color:#fff}
.c-manc-v{--c-bg:var(--manc-bg);--c-tx:var(--manc-tx)}
.c-det-v{--c-bg:var(--det-bg);--c-tx:var(--det-tx)}
.c-alex-v{--c-bg:var(--alex-bg);--c-tx:var(--alex-tx)}
.c-core-v{--c-bg:#f3ecdf;--c-tx:#7d6a58}
.c-ranni-v{--c-bg:var(--ranni-bg);--c-tx:var(--ranni-tx)}

/* detroit wall */
.wall{margin:2px -14px 10px;padding:0 14px}
.wall .side{display:flex;align-items:center;justify-content:space-between;font-family:var(--mono);font-size:9.5px;color:var(--mute);padding:4px 0}
.wall .side .chip{font-size:8.5px;padding:2px 7px;opacity:.55}
.wall .brick{height:22px;border-radius:6px;background:repeating-linear-gradient(135deg,var(--det-bg) 0 8px,#fff 8px 13px);border:1.5px solid var(--det-tx);display:flex;align-items:center;justify-content:center}
.wall .brick span{background:#fff;font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.1em;color:var(--det-tx);padding:1px 8px;border-radius:99px}

/* alexandria lane clock */
.lclock{display:grid;grid-template-columns:118px 1fr;gap:14px;align-items:center;padding-bottom:12px;margin-bottom:8px;border-bottom:1px solid var(--line-soft)}
.lclock svg.dial{width:118px;height:118px}
.lanes-l{display:flex;flex-direction:column;gap:8px}
.lane1{display:flex;flex-direction:column}
.lane1 b{font-family:var(--mono);font-size:17px;letter-spacing:-.02em}
.lane1 span{font-size:12px;color:var(--text)}
.lane1 .chip{align-self:flex-start;font-size:8.5px;padding:2px 7px;margin-top:3px}

/* ---------- ranni three-lane route ---------- */
.route{padding:14px 12px 12px}
.rnode{display:flex;align-items:center;gap:8px;justify-content:center;font-size:13px;font-weight:800}
.rnode .td{width:26px;height:26px;font-size:10px}
.rnode.src .td{background:var(--ink);color:#fff;border-color:var(--ink)}
.rsplit{height:26px;position:relative;margin:2px 0}
.rsplit svg{width:100%;height:100%;display:block}
.rsplit path{stroke:#e0d3bf;stroke-width:2;fill:none;vector-effect:non-scaling-stroke}
.rstem{width:2px;height:14px;background:#e0d3bf;margin:0 auto}
.rlanes{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.rlane{border-radius:12px;background:var(--bg-soft);padding:9px 7px 8px;display:flex;flex-direction:column;gap:6px;align-items:stretch}
.rlane .lh{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.08em;color:var(--ink);text-align:center}
.rlane .chip{font-size:8px;padding:2px 6px;align-self:center}
.rlane .st{background:#fff;border:1px solid var(--line);border-radius:9px;font-size:10.5px;line-height:1.3;padding:6px 6px;text-align:center;color:var(--ink);font-weight:600}
.rlane .st.g{border:1.5px solid var(--red);color:var(--red);display:flex;gap:4px;align-items:center;justify-content:center;font-weight:800}
.rlane .st.g .lock{width:10px;height:10px}
.rlane .arr{text-align:center;color:var(--mute);font-size:10px;line-height:1}
.rnode.out{margin-top:2px}
.rnode.out .td{background:var(--red);color:#fff;border-color:var(--red)}

/* ---------- fleet world map ---------- */
.wmap{padding:14px 14px 12px}
.wmap .stage{position:relative;border-radius:12px;background:var(--bg-soft);overflow:hidden}
.wmap .stage svg.wdots{display:block;width:100%;height:auto}
.wmap .wdots path{stroke:#dccfb9;stroke-width:1.7;stroke-linecap:round}
.wmap .mlinks{position:absolute;inset:0;width:100%;height:100%}
.wmap .mlinks path{fill:none;stroke:var(--red);stroke-width:.5;stroke-dasharray:1.6 1.4;opacity:.7}
.wmap .mlinks path.later{stroke:var(--mute);opacity:.6}
.mpin{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center}
.mpin .p{width:11px;height:11px;border-radius:99px;border:2.5px solid #fff;box-shadow:0 2px 6px rgba(61,41,26,.3)}
.mpin .chip{font-size:7.5px;padding:2px 6px;margin-top:3px;box-shadow:0 2px 6px rgba(61,41,26,.12)}
.mpin.up{flex-direction:column-reverse}.mpin.up .chip{margin:0 0 3px}
.mpin.later .p{background:#fff;border:2px dashed var(--mute);box-shadow:none}
.mpin.later .chip{background:#fff;border:1px dashed var(--mute);color:var(--mute)}
.mpin.hq .p{width:16px;height:16px;background:var(--red);display:flex;align-items:center;justify-content:center}
.mpin.hq .spark{width:8px;height:8px}
.mlegend{display:grid;grid-template-columns:1fr 1fr;gap:8px 10px;margin-top:12px}
.mlegend div{display:flex;gap:7px;align-items:center;font-size:11.5px;color:var(--text)}
.mlegend b{color:var(--ink);font-weight:800}
.mlegend .chip{font-size:8.5px;padding:2px 6px}
.mlegend .seat{margin-left:auto;font-style:normal;font-family:var(--mono);font-size:9px;color:var(--mute);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.mlegend .later .chip{background:#fff;border:1px dashed var(--mute);color:var(--mute)}
.mlegend .later{color:var(--mute)}.mlegend .later b{color:var(--text)}
/* side labels: the dot stays on its coordinate, the chip hangs off it */
.mpin.rt .chip,.mpin.lt .chip,.mpin.ru .chip,.mpin.rd .chip,.mpin.ld .chip{position:absolute;white-space:nowrap;margin:0}
.mpin.rt .chip{left:100%;top:50%;margin-left:4px;transform:translateY(-50%)}
.mpin.lt .chip{right:100%;top:50%;margin-right:4px;transform:translateY(-50%)}
.mpin.ru .chip{left:50%;bottom:100%;margin-bottom:3px}
.mpin.rd .chip{left:50%;top:100%;margin-top:3px}
.mpin.ld .chip{right:50%;top:100%;margin-top:3px}
.mowner{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:12px;color:var(--text)}
.mowner b{color:var(--ink)}

.pen-note{font-family:var(--hand);color:var(--pen);font-size:15px;transform:rotate(-2deg);display:inline-block}

/* ---------- desktop ---------- */
@media (min-width:1100px){
  .travel-sec{padding:40px 20px 8px}
  .travel{padding:26px 28px 20px}
  .travel .lead{font-size:28px}
  .tsteps{display:grid;grid-template-columns:repeat(6,1fr);gap:18px 0;margin-top:26px}
  .tn{grid-template-columns:1fr;justify-items:center;text-align:center;gap:6px;padding:10px 8px 12px;align-content:start}
  .tn:before{top:25px;left:0;right:0;height:2px;width:auto;z-index:0}
  .tn:last-child:before{display:block;right:50%}
  .tn:nth-child(6n+1):before{left:50%}.tn:nth-child(6n):before{right:50%}
  .tn .chips{justify-content:center;max-width:none}
  .tn.gate,.tn.end{margin:0;padding-top:30px}
  .tn.gate:before,.tn.end:before{top:45px}
  .tn.gate:after{left:0;right:0}
  .tn.now .here{position:absolute;top:-14px;right:-6px}
  .lanepills{justify-content:center}
  .origin{grid-template-columns:150px 1fr}
  .otile{height:100px}
  .route{padding:18px 18px 16px}
  .rlane .st{font-size:12px}
}
@media (min-width:1100px){.soonflows{display:grid;grid-template-columns:1fr 1fr}.moretag{grid-column:1/-1}}
.fs .fd:empty:after{content:"";width:7px;height:7px;border-radius:9px;background:var(--c-tx)}
.fs.end .fd:empty:after{background:#fff}
.mpin .chip{position:relative;z-index:2}
.rlane .arr:before{content:"↓"}
.lrow .ok:before{content:attr(data-mark)}
.rnode.out .td:before{content:"✓"}
.fchain em:before{content:"→"}

/* ---------------------------------------------------------------------------
   Home + districts, grouped like an airport: a departures board, then one
   terminal per function (Check-in = Ranni, A Engineering, B Money,
   C Content and research, Control Tower = Watch). Cards keep the locked skin
   (white card, chip, city mark); the ticket just adds a perforated code stub.
   --------------------------------------------------------------------------- */
.board{background:#2a1f18;border-radius:16px;padding:14px 16px 10px;color:#f4ead8;box-shadow:0 18px 40px rgba(61,41,26,.22);font-family:var(--mono);margin:22px 20px 0}
.board .bh{display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:.2em;color:#f2b84b;padding-bottom:10px;border-bottom:1px dashed #5a4636}
.board .bh i{font-style:normal;color:#9c8670;letter-spacing:.12em;font-size:9px}
.bd{display:grid;grid-template-columns:auto 1fr auto;gap:6px 12px;align-items:center;padding:9px 0;border-bottom:1px solid #3a2c22;color:inherit;text-decoration:none;font-size:11px;letter-spacing:.08em}
.bd:last-child{border-bottom:0}
.fl{display:inline-flex;gap:3px}.fl b{display:inline-block;width:20px;height:28px;line-height:28px;text-align:center;background:#3b2c21;border-radius:4px;color:#f2b84b;font-size:15px;position:relative;font-weight:700}
.fl b::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:#1d1510}
.bd .cn{color:#f4ead8;font-weight:700;letter-spacing:.1em;text-transform:uppercase;display:block}.bd .tm{display:block;color:#9c8670;font-size:9px;letter-spacing:.14em;margin-top:2px}
.bd .st{color:#7fd39a;font-size:9px;letter-spacing:.14em}
.tw{padding:0 20px}
.term{margin-top:26px}
.th{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.th .tl{font-family:var(--mono);font-size:10px;letter-spacing:.16em;color:#fff;background:var(--ink);border-radius:6px;padding:5px 9px;white-space:nowrap}
.th .tn{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--mute);white-space:nowrap}
.th .pen{font-family:var(--hand);font-size:16px;color:var(--pen);white-space:nowrap}
.th .fp{flex:1;height:0;border-top:2px dotted #d9c9b0;position:relative;min-width:24px}
.th .fp svg{position:absolute;right:-2px;top:-8px;background:var(--bg);padding-left:4px}
.tks{display:grid;gap:12px}
.tk{display:grid;grid-template-columns:1fr 84px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 26px rgba(61,41,26,.09);color:inherit;text-decoration:none;position:relative}
.tk::before,.tk::after{content:"";position:absolute;right:75px;width:14px;height:14px;background:var(--bg);border:1px solid var(--line);border-radius:50%;z-index:1}
.tk::before{top:-8px;clip-path:inset(50% 0 0 0)}.tk::after{bottom:-8px;clip-path:inset(0 0 50% 0)}
.tk-main{padding:14px 14px 15px 16px}
.tk-main .chip{font-size:10px;padding:3px 9px;letter-spacing:.1em}
.tk-main p{font-size:13.5px;line-height:1.45;font-weight:600;margin-top:10px;color:var(--ink)}
.tk-stub{border-left:2px dashed var(--line);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:10px 4px;background:linear-gradient(180deg,#fffaf0,#fff);border-radius:0 16px 16px 0}
.tk-stub .mkt{position:static}
.tk-stub b{font-family:var(--mono);font-size:21px;letter-spacing:.06em;color:var(--ink)}
.tk-stub small{font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;color:var(--mute)}
.tk.big .tk-main p{font-size:15.5px}.tk.big .tk-main{padding:18px 18px 19px 20px}
@media (min-width:768px){
 .tw{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}.tw .ranni-row{grid-column:1/-1}
 .board{margin:26px 20px 0}.tk{grid-template-columns:1fr 92px}.tk::before,.tk::after{right:83px}
 .tk-main p{font-size:14.5px}
 .tw .ranni-row .tk-main p{font-size:18px;max-width:560px}
}
@media (min-width:1100px){
 .home-top{display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:30px;padding-top:34px}
 .home-top .board{margin:0;padding:18px 22px 12px}.bd{font-size:12px;padding:11px 0}
 .fl b{width:24px;height:34px;line-height:34px;font-size:18px}
}
.th .tn{border:0!important;background:none!important;padding:0;box-shadow:none}.th .tn::before,.th .tn::after,.th .tl::after,.th .tl::before{content:none!important}
@media (max-width:767px){.th .pen{display:none}.th{gap:8px}}
@media (min-width:768px) and (max-width:1099px){.th .fp{display:none}.th .pen{margin-left:auto}.th .tn{font-size:10px;letter-spacing:.05em}}
.board{background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:0 12px 26px rgba(61,41,26,.09)}
.board .bh{color:var(--red);border-bottom:1px dashed var(--line)}.board .bh i{color:var(--mute)}
.bd{border-bottom:1px solid var(--line-soft)}
.fl b{background:#f6efe2;color:var(--ink);border:1px solid var(--line)}.fl b::after{background:var(--line)}
.bd .cn{color:var(--ink)}.bd .tm{color:var(--mute)}
.bd .st{color:var(--ink)}.bd .st::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#3f9a5b;margin-right:6px}
.th .tl{background:#f3ecdf;color:var(--ink);border:1px solid var(--line)}
.th .tn,.th .tl{flex:none}.th .fp{min-width:0}
.th .tn{position:relative;z-index:1;background:var(--bg)!important;padding-right:6px}
@media (min-width:768px) and (max-width:1099px){.th .tn{font-size:9.5px;letter-spacing:.02em}.th .pen{font-size:15px}.th{gap:8px}}
@media (max-width:767px){.th .tn{font-size:10px;letter-spacing:.06em}.th .fp{margin-left:6px}}
.th .tn{min-width:max-content;width:max-content}
@media (max-width:767px){.th .fp{border-top:0;height:14px}}

.th h2.tl,.glab h2.scap{margin:0}.th h2.tl{font-weight:400}
.glab{margin:22px 20px 10px}.glab .scap{margin:0}
.list.grp{padding-top:0;width:100%}
.planned{padding-top:8px}
@media (min-width:768px){
 .glab{margin:26px 20px 12px}
 .list.grp{grid-template-columns:repeat(2,minmax(0,1fr))}
 .planned{padding:8px 0 0}.planned .pipe-sec{max-width:none;margin:18px 0 0;padding:0 20px 8px}
}
.dgroup{width:100%;flex:none}
/* phone: one-column roster, planned pins keep their dashed dot only, m-* = phone label placement */
@media (max-width:767px){.mlegend{grid-template-columns:1fr}.mpin.later .chip{display:none}
  .mpin.m-dn .chip,.mpin.m-up .chip{position:absolute;white-space:nowrap;left:50%;right:auto;transform:translateX(-50%)}
  .mpin.m-dn .chip{top:100%;bottom:auto;margin:3px 0 0}
  .mpin.m-up .chip{bottom:100%;top:auto;margin:0 0 3px}}

/* ---------- fleet SHARED MEMORY mechanism diagram (job j1006-1cdce3) ----------
   Approved mock round 4: hub + eight cities, sync-in/write-back flows, brain slot,
   run loop, source-tagged atoms, never-shared private lane. All labels are DOM text;
   the SVG arrows are decorative (aria-hidden), the flows are named in text. */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.fm-blk .scap{margin-bottom:10px}
.fm-grid{display:grid;gap:14px}
.fm-mr{display:grid;gap:14px;align-content:start}
.fm-card{padding:16px 14px 14px;overflow:hidden}
.fm-card .kbt{font-size:17px;margin-top:0}
.fm-card .kbd{font-size:13.5px}
.fm-map{position:relative;aspect-ratio:350/400;max-width:350px;margin:6px auto 0}
.fm-svg{position:absolute;inset:0;width:100%;height:100%}
.fm-svg .fm-in{stroke:#2d66c9;stroke-width:1.8;fill:none}
.fm-svg .fm-out{stroke:#c9432b;stroke-width:1.8;fill:none;stroke-dasharray:4 3}
.fm-sw{display:none}
.fm-hub{position:absolute;left:50%;top:50%;width:96px;height:96px;margin:-48px 0 0 -48px;border-radius:50%;background:var(--ink);color:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 0 0 5px rgba(51,38,26,.12);text-align:center;font-family:var(--font)}
.fm-hub span{font-size:12px;font-weight:800;letter-spacing:.05em;color:#d9c9b3}
.fm-hub b{font-size:16px;font-weight:800;line-height:1.15}
.fm-hub em{font-style:normal;font-size:12px;font-weight:600;color:#d9c9b3}
.fm-cities{list-style:none}
.fm-city{position:absolute;left:var(--mx);top:var(--my);transform:translate(-50%,-50%);border-radius:999px;padding:6px 11px;font-size:12px;font-weight:800;letter-spacing:.04em;white-space:nowrap;cursor:default;transition:box-shadow .2s}
.fm-city.c-core{color:#6a584a}
.fm-city:hover{box-shadow:0 0 0 2px var(--ink)}
.fm-key{list-style:none;display:grid;gap:8px;margin-top:12px}
.fm-key li{display:flex;gap:10px;align-items:center;font-size:13.5px;line-height:1.4;color:var(--text)}
.fm-key b{color:var(--ink)}
.fm-ar{flex:none;width:108px;text-align:center;font-size:12px;font-weight:800;letter-spacing:.04em;border-radius:999px;padding:5px 0;white-space:nowrap}
.fm-ar.in{background:#dce8fa;color:#1e509e}.fm-ar.out{background:#fae0d0;color:#a0431d}.fm-ar.br{background:var(--ink);color:var(--bg)}
.fm-bcity{margin-top:10px;border:1px solid var(--line);border-radius:14px;padding:12px;background:#fffdf8}
.fm-bhead{display:flex;justify-content:space-between;align-items:center}
.fm-bhead .chip{font-size:12px}
.fm-soft{font-size:12px;font-weight:700;color:var(--mute)}
.fm-slot{margin-top:10px;border:2px dashed var(--ink);border-radius:12px;padding:10px;background:#fff}
.fm-slotcap{display:block;font-size:12px;font-weight:800;letter-spacing:.09em;color:var(--mute)}
.fm-brains{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:8px}
.fm-brains li{text-align:center;align-self:center;padding:9px 6px;border-radius:999px;font-size:13px;font-weight:800;background:#f3ecdf;border:1px solid var(--line);white-space:nowrap}
.fm-brains li.sel{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.fm-brains li.ghost{background:#fff;border:1px dashed var(--mute);color:var(--mute)}
.fm-swap{margin-top:9px;font-size:12.5px;font-weight:700;color:var(--pen)}
.fm-plug{display:flex;justify-content:space-around;font-size:12.5px;font-weight:700;margin:8px 0 6px}
.fm-plug span:first-child{color:#1e509e}.fm-plug span:last-child{color:#a0431d}
.fm-membar{background:var(--ink);color:var(--bg);border-radius:12px;padding:11px 12px;display:grid;gap:2px}
.fm-membar b{font-size:13px;letter-spacing:.08em}.fm-membar span{font-size:12.5px;font-weight:700;color:#b3a08b}
.fm-steps{list-style:none;margin-top:8px}
.fm-steps li{display:flex;gap:11px;padding:11px 0;border-top:1px solid var(--line-soft)}
.fm-steps li:first-child{border-top:0}
.fm-steps .n{flex:none;width:24px;height:24px;border-radius:50%;background:var(--red);color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center}
.fm-steps h4{font-size:15px;font-weight:800;letter-spacing:-.01em}
.fm-steps p{font-size:13.5px;color:var(--text);line-height:1.45;margin-top:2px}
.fm-tag{display:inline-block;font-size:12px;font-weight:800;padding:3px 9px;border-radius:999px;margin-top:5px}
.fm-tag.t-in{background:#dce8fa;color:#1e509e}.fm-tag.t-out{background:#fae0d0;color:#a0431d}.fm-tag.t-br{background:var(--ink);color:var(--bg)}
.fm-loopnote{margin:6px 0 0 35px;font-size:12.5px;font-weight:800;color:var(--pen)}
.fm-corpus{border:1.5px solid var(--ink);border-radius:16px;padding:12px;background:#fff;margin-top:10px}
.fm-corpcap{font-size:12px;font-weight:800;letter-spacing:.09em;color:var(--mute)}
.fm-atoms{list-style:none;display:grid;gap:8px;margin-top:10px}
.fm-atom{background:#fffdf8;border:1px solid var(--line);border-radius:12px;padding:10px 12px;box-shadow:0 4px 10px rgba(61,41,26,.05);display:grid;grid-template-columns:1fr auto;align-items:center;gap:0 6px}
.fm-atom small{font-size:12px;font-weight:700;color:var(--mute)}
.fm-atom i{grid-column:1/-1;display:block;height:6px;border-radius:3px;background:#efe5d2;margin:5px 0 0}
.fm-atom i:last-child{width:72%}
.fm-atom i:nth-of-type(1){margin-top:9px}
.fm-atag{font-size:12.5px;letter-spacing:.02em;justify-self:start}
.fm-gate{display:flex;align-items:center;gap:8px;margin:12px 0 0;font-size:12px;font-weight:800;letter-spacing:.04em;color:var(--pen);white-space:nowrap}
.fm-gate:before,.fm-gate:after{content:"";flex:1;border-top:1.5px dashed var(--pen)}
.fm-priv{margin-top:14px;border:2px dashed #7d6a58;border-radius:16px;padding:18px 14px 13px;background:repeating-linear-gradient(135deg,#f6efe4 0 10px,#f1e8d9 10px 20px);position:relative}
.fm-nv{position:absolute;right:14px;top:-12px;background:var(--ink);color:var(--bg);font-size:12px;font-weight:800;letter-spacing:.04em;padding:3px 9px;border-radius:999px}
.fm-lock{display:flex;align-items:center;gap:8px;font-weight:800;font-size:14px;color:var(--ink)}
.fm-lock span{white-space:nowrap}
.fm-priv ul{list-style:none;margin-top:9px;display:grid;gap:6px}
.fm-priv li{display:flex;gap:8px;align-items:center;font-size:13px;font-weight:700;color:var(--text);background:#fff;border:1px solid var(--line);border-radius:10px;padding:7px 10px}
.fm-priv li .fm-lk{flex:none;color:var(--ink)}
.fm-priv p{margin-top:10px;font-size:13.5px;color:var(--text);line-height:1.45}
@media (min-width:768px){
  .fm-grid{grid-template-columns:1fr 1fr;gap:14px}
  .fm-dg{grid-column:1/-1}
  .fm-mr{display:contents}
  .fm-cp{grid-column:1/-1}
  .fm-card{padding:16px 16px 14px}
  .fm-card .kbt{font-size:19px}.fm-card .kbd{font-size:14px}
  .fm-map{aspect-ratio:560/420;max-width:560px}
  .fm-sm{display:none}.fm-sw{display:block}
  .fm-svg .fm-in,.fm-svg .fm-out{stroke-width:2}
  .fm-city{left:var(--wx);top:var(--wy);font-size:13px;padding:8px 11px}
  .fm-hub{width:116px;height:116px;margin:-58px 0 0 -58px}
  .fm-hub span,.fm-hub em{font-size:13px}.fm-hub b{font-size:19px}
  .fm-key{grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
  .fm-key li{flex-direction:column;align-items:flex-start;gap:6px}
  .fm-cp{display:grid;grid-template-columns:1fr auto 1fr;gap:22px;align-items:stretch}
  .fm-atoms{grid-template-columns:1fr}
  .fm-gate{writing-mode:vertical-rl;margin:0;justify-content:center}
  .fm-gate:before,.fm-gate:after{border-top:0;border-left:1.5px dashed var(--pen)}
  .fm-cpr{display:flex}.fm-cpr .fm-priv{flex:1;margin-top:0;display:flex;flex-direction:column;justify-content:center}
}
@media (min-width:1100px){
  .fleet-cols{display:block}
  .fm-grid{grid-template-columns:1.25fr 1fr;align-items:stretch}
  .fm-dg{grid-column:1}
  .fm-mr{display:grid;gap:14px;align-content:start}
  .fm-map{max-width:620px;width:100%}
  .fm-key{grid-template-columns:1fr;max-width:560px;margin:14px auto 0}
  .fm-key li{flex-direction:row;align-items:center;gap:10px}
  .fm-atoms{grid-template-columns:repeat(3,1fr);gap:10px}
  .fm-brains{grid-template-columns:repeat(5,auto);justify-content:start}
}

/* ---------- fleet floor: isometric office (three.js, assets/floor3d.js) ---------- */
.wmap .stage.iso{background:linear-gradient(180deg,#f6efe4,#efe5d4);padding:4px 0 2px;aspect-ratio:auto;min-height:120px}
.wmap .stage.iso.nogl{display:none}
.iwrap{position:relative;width:100%}
.isofloor{display:block;width:100%;height:auto;touch-action:manipulation;cursor:pointer}
.ifx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.ipins{position:absolute;inset:0;pointer-events:none}
.ipin{position:absolute;transform:translate(-50%,-100%);z-index:2;pointer-events:auto;background:none;border:0;padding:0;margin:0;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.ipin .chip{font-size:7.5px;padding:2px 6px;box-shadow:0 2px 6px rgba(61,41,26,.12);gap:4px;white-space:nowrap}
.ipin:not(.later):after{content:"";position:absolute;left:50%;bottom:-4px;width:1px;height:4px;background:var(--mute);opacity:.6}
.ipin.later{transform:translate(-50%,-50%)}
.ipin.later .chip{background:#fff;border:1px dashed var(--mute);color:var(--mute);box-shadow:none}
.ipin.on .chip{outline:2px solid var(--red);outline-offset:1px}
.ipin:focus-visible .chip{outline:2px solid var(--blue,#2d66c9);outline-offset:2px}
.ipin .sd{width:5px;height:5px;border-radius:9px;border:1.2px solid currentColor;opacity:.7;flex:none}
.ipin .sd.working{background:var(--red);border-color:var(--red);opacity:1;box-shadow:0 0 0 2.5px rgba(201,67,43,.2)}
.ipin .sd.private{border-style:dashed}
.ibub{position:absolute;transform:translate(-50%,-100%);z-index:3;width:22px;height:22px;border-radius:999px;background:#fff;border:1px solid var(--line);box-shadow:0 4px 10px rgba(61,41,26,.14);display:flex;align-items:center;justify-content:center;pointer-events:none}
.ibub:after{content:"";position:absolute;left:4px;bottom:-3px;width:6px;height:6px;background:#fff;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)}
.ibub svg{width:13px;height:13px}
.ilive{position:absolute;left:9px;bottom:8px;font-family:var(--mono);font-size:8.5px;color:var(--text);display:flex;align-items:center;gap:5px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:3px 8px}
.ilive i{width:6px;height:6px;border-radius:9px;background:var(--red);box-shadow:0 0 0 3px rgba(201,67,43,.15)}
.mlegend .lst{display:inline-block;width:6px;height:6px;border-radius:9px;margin-right:6px;vertical-align:1px;border:1.3px solid var(--mute);background:#fff}
.mlegend .lst.working{background:var(--red);border-color:var(--red)}
.mlegend .lst.private{border-style:dashed}
.dcard{position:relative;margin-top:12px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 14px 13px;box-shadow:0 10px 24px rgba(61,41,26,.10)}
.dcard:before{content:"";position:absolute;top:-7px;left:var(--cx,50%);width:12px;height:12px;background:#fff;border-left:1px solid var(--line);border-top:1px solid var(--line);transform:rotate(45deg)}
.dtop{display:flex;align-items:center;gap:8px}
.dtop .chip{font-size:9.5px;padding:3px 9px}
.dtop .chip.later{background:#fff;border:1px dashed var(--mute);color:var(--mute)}
.dtop .seat{font-style:normal;font-family:var(--mono);font-size:9px;color:var(--mute);letter-spacing:.04em;text-transform:uppercase}
.dx{margin-left:auto;width:24px;height:24px;border-radius:99px;background:#f3ecdf;color:var(--text);display:flex;align-items:center;justify-content:center;font-size:15px;line-height:1;border:0;padding:0;cursor:pointer;font-family:inherit}
.drole{font-size:13px;color:var(--text);margin-top:9px}.drole b{color:var(--ink);font-weight:800}
.dline{font-size:13.5px;line-height:1.45;color:var(--ink);margin-top:4px}
.dst{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.08em;color:var(--text);background:#f3ecdf;border-radius:999px;padding:4px 10px}
.dst i{width:7px;height:7px;border-radius:9px;border:1.4px solid var(--mute);background:#fff}
.dst.on{background:#fbe6df;color:var(--red)}.dst.on i{background:var(--red);border-color:var(--red);box-shadow:0 0 0 3px rgba(201,67,43,.18)}
.dst.on span{font-weight:400;color:var(--text);letter-spacing:.02em}
.dst.priv{background:#fff;border:1px dashed var(--mute)}
.dst.plan{background:#fff;border:1px dashed var(--mute);color:var(--mute)}.dst.plan .chip{font-size:8px;padding:1px 6px;border:1px dashed var(--mute);color:var(--mute)}
.nowstrip{margin-top:10px;border:1px solid var(--line-soft);border-radius:12px;padding:10px 12px;background:#fffdf9}
.nowstrip[hidden]{display:none}
.nowcap{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.12em;color:var(--red);display:flex;align-items:center;gap:6px}
.nowcap i{width:6px;height:6px;border-radius:9px;background:var(--red);box-shadow:0 0 0 3px rgba(201,67,43,.15)}
.nowcap b{margin-left:auto;color:var(--mute);font-weight:400;letter-spacing:.06em}
.nowrows{display:grid;grid-template-columns:1fr;gap:7px;margin-top:9px}
.nowrow{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink);min-width:0}
.nowrow .chip{font-size:8.5px;padding:2px 7px}
.nowl{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nowic{width:18px;height:18px;flex:none;display:flex;align-items:center;justify-content:center;background:var(--bg-soft);border-radius:99px}
.nowic svg{width:11px;height:11px}
@media (min-width:768px){
  .wmap .stage.iso{padding:18px 0 14px}
  .iwrap{width:min(100%,640px);margin:0 auto}
  .ipin .chip{font-size:9px;padding:3px 8px}
  .ipin .sd{width:6px;height:6px}
  .ilive{font-size:10px;padding:4px 10px;left:14px;bottom:12px}
  .ibub{width:28px;height:28px}.ibub svg{width:16px;height:16px}
  .nowrows{grid-template-columns:1fr 1fr;gap:8px 18px}
  .dcard.pop{position:absolute;margin:0;right:22px;left:auto;width:300px;padding:16px 18px;z-index:5;box-shadow:0 18px 40px rgba(61,41,26,.16)}
  .dcard.pop:before{display:none}
  .dcard.pop .dline{font-size:14px}
  .stage.open .iwrap{margin-left:max(16px,calc(50% - 480px))}
}
@media (min-width:1100px){.iwrap{width:min(100%,780px)}.stage.open .iwrap{width:min(100%,700px);margin-left:max(16px,calc(50% - 510px))}}