
  :root{
    --hub-bg:#1e242b; --hub-bg2:#151a20; --hub-ink:#e9e2d4; --hub-mut:#8b9298;
    --th-bg:#eef0e9; --th-bg2:#e4e7dd; --th-ink:#2b322b; --th-mut:#5f6b5d; --th-accent:#5b7253; --th-line:#d3d8ca;
    --dz-bg:#14151a; --dz-bg2:#1c1e26; --dz-ink:#e6dfcf; --dz-mut:#8f8a7d; --dz-accent:#d98b3e; --dz-line:#2a2c36;
    --mt-bg:#1a201f; --mt-bg2:#141918; --mt-ink:#e9e2d4; --mt-mut:#8a938a; --mt-a1:#84996f; --mt-a2:#d98b3e; --mt-line:#2b332e;
    --serif:"Fraunces",Georgia,"Times New Roman",serif;
    --body:"Newsreader",Georgia,serif;
    --mono:"Spline Sans Mono",ui-monospace,"SF Mono",Menlo,monospace;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html,body{height:100%}
  body{font-family:var(--body);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.55;transition:background .6s ease,color .6s ease}
  body[data-room="hub"]{--bg:var(--hub-bg);--bg2:var(--hub-bg2);--ink:var(--hub-ink);--mut:var(--hub-mut);--accent:var(--hub-ink);--line:#2c333b}
  body[data-room="therapy"]{--bg:var(--th-bg);--bg2:var(--th-bg2);--ink:var(--th-ink);--mut:var(--th-mut);--accent:var(--th-accent);--line:var(--th-line)}
  body[data-room="design"]{--bg:var(--dz-bg);--bg2:var(--dz-bg2);--ink:var(--dz-ink);--mut:var(--dz-mut);--accent:var(--dz-accent);--line:var(--dz-line)}
  body[data-room="meet"]{--bg:var(--mt-bg);--bg2:var(--mt-bg2);--ink:var(--mt-ink);--mut:var(--mt-mut);--accent:var(--mt-a2);--line:var(--mt-line)}

  /* PHOTO BACKGROUNDS (author's travel photos) — fixed layer behind content, tinted with each room's palette */
  body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-size:cover;background-position:center}
  body[data-room="hub"]::before{background-image:linear-gradient(rgba(30,36,43,.6),rgba(21,26,32,.8)),url("/img/cubes.webp")}
  body[data-room="therapy"]::before{background-image:linear-gradient(rgba(238,240,233,.88),rgba(228,231,221,.94)),url("/img/therapy.webp")}
  body[data-room="design"]::before{background-image:linear-gradient(rgba(20,21,26,.85),rgba(20,21,26,.94)),url("/img/design.webp")}
  body[data-room="meet"]::before{background-image:linear-gradient(rgba(26,32,31,.85),rgba(20,25,24,.94)),url("/img/meet.webp")}

  .eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--mut)}
  h1{font-family:var(--serif);font-weight:500;line-height:1.02;letter-spacing:-.01em}
  h2{font-family:var(--serif);font-weight:500;line-height:1.08}
  a{color:inherit}

  /* HUB */
  .hub{position:relative;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:7vh 24px;text-align:center;background:radial-gradient(120% 90% at 50% 10%,rgba(30,36,43,.22) 0%,rgba(21,26,32,.55) 75%)}
  .hub .eyebrow{margin-bottom:30px}
  .hub h1{font-size:clamp(2.1rem,6vw,3.6rem);max-width:14ch;margin:0 auto 14px}
  .hub .sub{color:var(--hub-mut);font-size:1.02rem;max-width:36ch;margin:0 auto 46px}
  .doors{display:grid;grid-template-columns:1fr 1fr;gap:14px;width:100%;max-width:760px}
  .choices{width:100%;max-width:760px;margin:0 auto}
  .door{position:relative;display:block;text-align:left;cursor:pointer;background:rgba(255,255,255,.015);border:1px solid #2c333b;border-radius:3px;padding:30px 26px 34px;color:var(--hub-ink);overflow:hidden;transition:border-color .35s,background .35s,transform .35s}
  .door .num{font-family:var(--mono);font-size:.72rem;color:var(--hub-mut);letter-spacing:.18em}
  .door .lbl{font-family:var(--serif);font-size:1.5rem;font-weight:500;margin:18px 0 8px;line-height:1.1;display:block}
  .door .dsc{font-size:.95rem;color:var(--hub-mut);max-width:30ch;display:block}
  .door .go{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;margin-top:22px;display:inline-block;opacity:0;transform:translateY(4px);transition:opacity .35s,transform .35s}
  .door::after{content:"";position:absolute;inset:0;opacity:0;transition:opacity .45s;pointer-events:none}
  .door.d-th::after{background:radial-gradient(120% 100% at 20% 0%,rgba(132,153,111,.18),transparent 70%)}
  .door.d-dz::after{background:radial-gradient(120% 100% at 80% 0%,rgba(217,139,62,.16),transparent 70%)}
  .door:hover,.door:focus-visible{transform:translateY(-3px);outline:none}
  .door.d-th:hover,.door.d-th:focus-visible{border-color:rgba(132,153,111,.6)}
  .door.d-dz:hover,.door.d-dz:focus-visible{border-color:rgba(217,139,62,.55)}
  .door:hover::after,.door:focus-visible::after{opacity:1}
  .door:hover .go,.door:focus-visible .go{opacity:1;transform:none}
  .seam{margin-top:18px}
  .seam button{background:none;border:none;cursor:pointer;font-family:var(--mono);font-size:.74rem;letter-spacing:.12em;color:var(--hub-mut);padding:10px 14px;border-radius:3px;transition:color .3s}
  .seam button:hover,.seam button:focus-visible{color:var(--hub-ink);outline:none;text-decoration:underline;text-underline-offset:4px}
  .seam .meetsub{display:block;font-family:var(--body);letter-spacing:0;text-transform:none;font-size:.85rem;margin-top:4px;max-width:38ch;margin-inline:auto}
  .door3{position:relative;display:block;width:100%;max-width:440px;margin:22px auto 0;text-align:center;cursor:pointer;background:rgba(255,255,255,.02);border:1px solid #2c333b;border-radius:3px;padding:18px 26px 20px;color:var(--hub-ink);overflow:visible;transition:border-color .35s,background .35s,transform .35s}
  .door3::before{content:"";position:absolute;top:-16px;left:50%;width:1px;height:14px;background:linear-gradient(to bottom,transparent,#3a424c);transform:translateX(-50%)}
  .door3::after{content:"";position:absolute;inset:0;opacity:0;transition:opacity .45s;pointer-events:none;border-radius:3px;background:radial-gradient(130% 150% at 12% 0%,rgba(132,153,111,.18),transparent 60%),radial-gradient(130% 150% at 88% 0%,rgba(217,139,62,.17),transparent 60%)}
  .door3:hover,.door3:focus-visible{transform:translateY(-3px);border-color:rgba(176,158,120,.55);background:rgba(255,255,255,.03);outline:none}
  .door3:hover::after,.door3:focus-visible::after{opacity:1}
  .d3-label{display:block;font-family:var(--serif);font-size:1.2rem;font-weight:500}
  .d3-sub{display:block;margin-top:6px;font-family:var(--body);font-size:.86rem;color:var(--hub-mut);max-width:44ch;margin-inline:auto}

  /* TOP BAR */
  .topbar{position:sticky;top:0;z-index:10;display:none;align-items:center;justify-content:space-between;padding:14px 22px;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
  body:not([data-room="hub"]) .topbar{display:flex}
  .brand{font-family:var(--serif);font-size:1.05rem;font-weight:500;background:none;border:none;color:var(--ink);cursor:pointer;letter-spacing:-.01em}
  .brand:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
  .toggle{display:flex;gap:2px;border:1px solid var(--line);border-radius:3px;padding:3px;background:var(--bg2)}
  .toggle button,.toggle a{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;background:none;border:none;color:var(--mut);padding:7px 11px;border-radius:2px;cursor:pointer;transition:color .25s,background .25s}
  .toggle a[aria-current="page"],.toggle button[aria-pressed="true"]{color:var(--bg);background:var(--accent)}
  .toggle a:focus-visible,.toggle button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
  .topright{display:flex;align-items:center;gap:10px}
  .lang{display:flex;gap:2px;border:1px solid var(--line);border-radius:3px;padding:3px;background:var(--bg2)}
  .lang button{font-family:var(--mono);font-size:.64rem;letter-spacing:.06em;background:none;border:none;color:var(--mut);padding:7px 9px;border-radius:2px;cursor:pointer;transition:color .25s,background .25s}
  .lang button[aria-pressed="true"]{color:var(--bg);background:var(--accent)}
  .lang button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
  .hublang{position:absolute;top:18px;right:18px}
  body[data-lang="en"] .t-sr{display:none}
  body[data-lang="sr"] .t-en{display:none}

  /* VIEWS */
  .view{display:none}
  .view.active{display:block;animation:rise .5s ease both}
  @keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  .wrap{max-width:720px;margin:0 auto;padding:clamp(40px,7vw,82px) 24px 60px}
  .vhero .eyebrow{margin-bottom:22px}
  .vhero h1{font-size:clamp(2.2rem,6vw,3.2rem);margin-bottom:22px}
  .lead{font-size:1.22rem;color:var(--ink);max-width:42ch}
  .body p{margin-top:20px;font-size:1.07rem;color:var(--ink)}
  .body p.dim{color:var(--mut)}
  .meetnote{margin-top:18px;font-size:1.07rem;color:var(--mut);font-style:italic}

  .block{margin-top:54px;padding-top:30px;border-top:1px solid var(--line)}
  .block > .eyebrow{margin-bottom:18px;display:block}
  .subhead{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mut);margin:24px 0 12px;display:block}
  .subhead:first-of-type{margin-top:0}
  .tags{display:flex;flex-wrap:wrap;gap:8px}
  .tag{font-family:var(--mono);font-size:.74rem;letter-spacing:.04em;border:1px solid var(--line);border-radius:999px;padding:7px 13px;color:var(--mut)}

  .epigraph{font-family:var(--serif);font-style:italic;font-size:1.12rem;color:var(--mut);margin:4px 0 14px;max-width:52ch}
  .proj{padding:22px 0;border-top:1px solid var(--line)}
  .proj:first-of-type{border-top:none}
  .proj h3{font-family:var(--serif);font-size:1.32rem;font-weight:500;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
  .proj .meta{font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
  .proj p{margin-top:9px;color:var(--mut);font-size:1.02rem;max-width:56ch}
  .proj .links{margin-top:11px;display:flex;gap:18px;flex-wrap:wrap}
  .proj .links a{font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);text-decoration:none}
  .proj .links a:hover{text-decoration:underline;text-underline-offset:3px}

  .offer{margin-top:24px}
  .offer h3{font-family:var(--serif);font-size:1.18rem;font-weight:500;color:var(--ink)}
  .offer p{margin-top:6px;color:var(--mut);max-width:54ch}

  .inquiry{margin-top:44px;padding:20px 22px;border:1px solid var(--line);border-radius:3px;background:var(--bg2)}
  .inquiry .subhead{margin-top:0}
  .inquiry p{color:var(--mut);font-size:1rem;margin-top:6px;max-width:50ch}

  .cross{margin-top:48px;padding:22px 24px;border:1px solid var(--line);border-radius:3px;background:var(--bg2);display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
  .cross span{font-size:1.02rem;color:var(--ink);max-width:42ch}
  .cross button{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;background:none;border:1px solid var(--accent);color:var(--accent);padding:11px 16px;border-radius:3px;cursor:pointer;white-space:nowrap;transition:background .25s,color .25s}
  .cross button:hover,.cross button:focus-visible{background:var(--accent);color:var(--bg);outline:none}

  .ctarow{margin-top:46px;display:flex;gap:12px;flex-wrap:wrap}
  .cta{font-family:var(--mono);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;background:var(--accent);color:var(--bg);padding:15px 22px;border-radius:3px;transition:opacity .25s}
  .cta:hover{opacity:.86}
  .cta.ghost{background:none;color:var(--ink);border:1px solid var(--line)}

  .footer{margin-top:56px;padding-top:24px;border-top:1px solid var(--line);display:flex;gap:22px;flex-wrap:wrap;font-family:var(--mono);font-size:.74rem;letter-spacing:.06em}
  .footer a{color:var(--mut);text-decoration:none}
  .footer a:hover{color:var(--accent)}
  .footer .copyr{color:var(--mut)}

  .vids{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:6px}
  .vid{position:relative;aspect-ratio:16/9;border:1px solid var(--line);border-radius:3px;overflow:hidden;background:var(--bg2)}
  .vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
  .vid.wide{grid-column:1/-1}

  .creds{margin-top:4px;padding:0}
  .creds li{list-style:none;padding:13px 0;border-top:1px solid var(--line);font-size:1.04rem;color:var(--ink)}
  .creds li:first-child{border-top:none}
  .creds .small{display:block;font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);margin-top:6px}
  .creds a{color:var(--accent);text-decoration:none}
  .creds a:hover{text-decoration:underline;text-underline-offset:3px}
  .verify{margin-top:14px;font-size:.96rem;color:var(--mut);font-style:italic}

  @media(max-width:620px){.doors{grid-template-columns:1fr}.cross{flex-direction:column;align-items:flex-start}}
  @media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}.door .go{opacity:1;transform:none}}

  /* in-page text editor */
  .editbar{position:fixed;right:16px;bottom:16px;z-index:50;display:flex;gap:8px;font-family:var(--mono)}
  .editbar button{font-size:.72rem;letter-spacing:.05em;border:1px solid rgba(127,127,127,.6);background:#111418;color:#f2eee4;padding:11px 15px;border-radius:999px;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.25);opacity:.9}
  .editbar button:hover{opacity:1}
  body.editing .editable{outline:1px dashed rgba(127,127,127,.65);outline-offset:3px;border-radius:2px}
  body.editing .editable:focus{outline:2px solid #4a90d9;background:rgba(74,144,217,.07)}
  body.editing[data-lang="sr"] .t-sr:empty{display:inline-block;min-width:90px;min-height:1em;outline:1px dashed rgba(127,127,127,.5)}
  body.editing[data-lang="en"] .t-en:empty{display:inline-block;min-width:90px;min-height:1em;outline:1px dashed rgba(127,127,127,.5)}
  .exporter{position:fixed;inset:0;z-index:60;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.55);padding:24px}
  .exporter.open{display:flex}
  .exporter .panel{background:#15161b;color:#e6dfcf;border:1px solid #333;border-radius:6px;max-width:680px;width:100%;max-height:82vh;display:flex;flex-direction:column;font-family:var(--mono)}
  .exporter .panel header{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid #333;font-size:.78rem;letter-spacing:.06em}
  .exporter .panel header button{background:none;border:none;color:#999;font-size:1rem;cursor:pointer}
  .exporter textarea{flex:1;min-height:320px;background:#0e0f13;color:#cfc7b6;border:none;padding:16px;font-family:var(--mono);font-size:.82rem;line-height:1.55;resize:none}
  .exporter .panel footer{padding:12px 16px;border-top:1px solid #333;display:flex;gap:8px;justify-content:flex-end}
  .exporter footer button{font-family:var(--mono);font-size:.74rem;border:1px solid #555;background:#222;color:#fff;padding:9px 15px;border-radius:4px;cursor:pointer}
  @media print{.editbar{display:none}}

  .door,.door3,.brand{text-decoration:none}
  .brand{display:inline-block}

  /* editor hidden unless ?edit is in the URL */
  body:not(.editmode) .editbar{display:none}

  /* ---------- IF intro (hub scene) ---------- */
  .hub .scene{max-width:600px;width:100%}
  .hub .beat{font-family:var(--serif);font-weight:400;font-size:clamp(1.3rem,3.4vw,1.8rem);line-height:1.35;min-height:1.4em;margin:0 0 .45em;opacity:0;transition:opacity .4s ease;letter-spacing:0}
  .hub h1.beat{font-size:clamp(1.3rem,3.4vw,1.8rem)}
  .hub .beat.on{opacity:1}
  .hub .beat.q{margin-top:.8em;font-style:italic}
  .hub .caret::after{content:"▌";animation:hubblink 1s steps(1) infinite;color:var(--mut)}
  @keyframes hubblink{50%{opacity:0}}
  .hub .ifchoices{margin-top:30px;display:flex;flex-direction:column;gap:11px;opacity:0;transform:translateY(6px);transition:opacity .5s ease,transform .5s ease;pointer-events:none}
  .hub .ifchoices.on{opacity:1;transform:none;pointer-events:auto}
  .hub .ifchoice{display:block;text-align:left;font-family:var(--body);font-size:1.05rem;line-height:1.45;color:var(--ink);background:rgba(21,26,32,.45);border:1px solid var(--line);border-radius:4px;padding:14px 17px;cursor:pointer;text-decoration:none;transition:border-color .25s,background .25s,transform .15s}
  .hub .ifchoice:hover,.hub .ifchoice:focus-visible{border-color:rgba(233,226,212,.55);background:rgba(21,26,32,.65);outline:none;transform:translateX(3px)}
  .hub .ifchoice .pre{font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;color:var(--mut);display:block;margin-bottom:3px;text-transform:uppercase}
  .hub .response{font-family:var(--serif);font-style:italic;font-size:1.15rem;color:var(--mut);margin-top:18px;min-height:1.4em;opacity:0;transition:opacity .35s}
  .hub .response.on{opacity:1}
  .hub .skipline{margin-top:34px}
  .hub .skipline a{font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mut);text-decoration:underline;text-underline-offset:4px;cursor:pointer}
  .hub .skipline a:hover{color:var(--ink)}
  .hub .plainh{font-family:var(--serif);font-weight:500;line-height:1.02;letter-spacing:-.01em;font-size:clamp(2rem,6vw,3.2rem);margin-bottom:.35em}
  @media (prefers-reduced-motion: reduce){
    .hub .beat,.hub .ifchoices,.hub .response{transition:none}
    .hub .caret::after{animation:none;content:""}
  }

  /* branching intro additions */
  .hub .ifnode[hidden]{display:none}
  .hub .beat.resp{font-style:italic;color:var(--mut);margin-top:22px}
  .hub .beat.resp[hidden]{display:none}
  .hub .controw{margin-top:22px}
  .hub .controw[hidden]{display:none}
  .hub .ifcont{display:inline-block;font-family:var(--mono);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);text-decoration:none;border:1px solid rgba(233,226,212,.4);border-radius:3px;padding:12px 20px;transition:border-color .25s,background .25s}
  .hub .ifcont:hover,.hub .ifcont:focus-visible{border-color:var(--ink);background:rgba(255,255,255,.05);outline:none}

  .crosslink{display:inline-block;text-decoration:none}

  /* three-button row on the meet page — mirrors the top-bar order */
  .ctarow3{flex-wrap:nowrap;align-items:stretch;gap:10px}
  .ctarow3 a{flex:1 1 0;min-width:0;text-align:center;display:flex;align-items:center;justify-content:center;
             font-size:.66rem;letter-spacing:.05em;line-height:1.35;padding:13px 10px}
  @media(max-width:620px){
    .ctarow3{flex-direction:column;flex-wrap:wrap}
    .ctarow3 a{flex:none;width:100%;font-size:.74rem;letter-spacing:.07em;padding:15px 18px}
  }
