/* Blakey Trades — Duo / adaptive layouts.
 * Driven by duo.js: html[data-form="compact|regular"], [data-short="1"], [data-narrow="1"].
 * Layout decisions use the app's own width/height, never the device or orientation.
 */

/* ────────────────────────────────────────────────────────────
   COMPACT · SHORT  (closed Duo 466×678, landscape phones)
   Keep the whole Home hero and both actions above the dock.
   ──────────────────────────────────────────────────────────── */
html[data-short="1"] .hv2-hero-toolbar{min-height:calc(40px + env(safe-area-inset-top,0px) + 4px);padding-top:calc(env(safe-area-inset-top,0px) + 4px)}
html[data-short="1"] .hv2-theme-btn,html[data-short="1"] .hv2-menu-btn{width:40px;height:40px}
html[data-short="1"]:not([data-form="regular"]) .hv2-brand-composite{width:min(48vw,clamp(104px,calc(var(--app-vh,100dvh) * .215),188px))}
html[data-short="1"]:not([data-form="regular"]) .hv2-brand-lockup::before{width:min(80vw,260px);height:min(80vw,260px)}
html[data-short="1"]:not([data-form="regular"]) .hv2-welcome{margin-top:10px;font-size:15px}
html[data-short="1"]:not([data-form="regular"]) .hv2-welcome-rule{margin-top:9px}
html[data-short="1"]:not([data-form="regular"]) .hv2-start-card{padding-top:14px}
html[data-short="1"]:not([data-form="regular"]) .hv2-start-title{font-size:clamp(34px,9vw,44px)!important}
html[data-short="1"]:not([data-form="regular"]) .hv2-start-card p{margin-top:8px;font-size:14px}
html[data-short="1"]:not([data-form="regular"]) .hv2-start-card .hv2-balance-actions{gap:12px;margin-top:16px}
html[data-short="1"]:not([data-form="regular"]) .hv2-start-card .hv2-balance-action{height:50px;min-height:50px;font-size:14px}
html[data-short="1"] .hv2-home-stack{padding-bottom:0}

/* Office header: a long member name must never stack a 4-line headline. */
.office-head{flex-wrap:wrap}
.of-name{font-size:clamp(20px,5.6vw,var(--fs-h1));line-height:1.12;overflow-wrap:anywhere}
html[data-short="1"] .office-head .av-ring{transform:scale(.88);transform-origin:left center;margin-right:-6px}

/* ────────────────────────────────────────────────────────────
   REGULAR · shared  (open Duo 626×890, iPad, wide windows)
   ──────────────────────────────────────────────────────────── */
html[data-form="regular"]{--duo-gap:16px;--duo-max:900px}
html[data-form="regular"] .screen{padding-inline:max(22px,calc((100% - var(--duo-max)) / 2))}

/* shared card vocabulary */
.hvd-card{
  position:relative;display:flex;flex-direction:column;gap:6px;min-width:0;
  padding:16px;border-radius:20px;text-align:left;color:var(--text);
  background:radial-gradient(120% 130% at 0% 0%,rgba(var(--gold-rgb),.10),transparent 60%),var(--surface-2);
  border:1px solid var(--line-2);box-shadow:var(--sh-1);
}
.hvd-eyebrow{display:flex;align-items:center;gap:7px;color:var(--gold);font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.hvd-eyebrow .ic{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8}

/* ────────────────────────────────────────────────────────────
   HOME · open display — hero + command deck
   ──────────────────────────────────────────────────────────── */
html[data-form="regular"] .app.home-v2-active .screen-scroll:has(.hv2-duo){overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain}
html[data-form="regular"] .app.home-v2-active .screen:has(.hv2-duo){height:auto;min-height:100%;overflow:visible;padding-bottom:calc(var(--tabbar-h) + 34px)}
.app.home-v2-active .home-v2-stage.hv2-duo{height:auto;min-height:0;max-width:var(--duo-max,900px);width:100%}

.hvd-hero{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:clamp(18px,4vw,34px);padding:4px 2px 22px}
.hvd-brand{margin:0}
.hvd-brand .hv2-brand-composite{width:clamp(130px,24vw,190px)}
.hvd-brand::before{width:300px;height:300px;left:50%;top:-10px}
.hvd-hero-copy{display:flex;flex-direction:column;align-items:flex-start;min-width:0;text-align:left}
.hvd-hero-copy .hv2-welcome{margin:0}
.hvd-hero-copy .hv2-start-title{font-size:clamp(42px,8vw,60px)!important;margin-top:8px!important}
.hvd-hero-copy .hv2-welcome-rule{margin:14px 0 0}
.hvd-actions{display:flex;gap:12px;width:100%;margin-top:20px}
.hvd-actions .hv2-balance-action{flex:1 1 0;min-height:52px;height:52px;font-size:15px;transition:transform .16s var(--ease-spring),filter .2s}
.hvd-actions .hv2-balance-action:not(.is-primary){background:rgba(4,4,4,.34);border-color:rgba(var(--gold-rgb),.34);color:var(--gold-hi)}

.hvd-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--duo-gap);align-items:stretch}
.hvd-grid>.hvd-span2{grid-column:1/-1;min-width:0}
.hvd-grid .book-card{margin-top:0}
.hvd-grid .book-net b{font-size:52px}
.hvd-grid .book-in{padding:20px 22px 16px}
.hvd-grid .book-eq{height:92px}
.hvd-grid .desk{margin:0}
.hvd-grid>.hv2-trader-card{min-width:0}
.hvd-grid:not(:has(.hvd-totw))>.hv2-trader-card{grid-column:1/-1}
.hvd-totw{min-width:0;display:flex}
.hvd-totw>.card{width:100%;margin:0}

.hvd-session{min-height:164px;cursor:pointer;transition:transform .15s var(--ease-spring),box-shadow .2s}
.hvd-session:active{transform:scale(.985)}
.hvd-session .hvd-title{margin-top:8px;font-family:var(--display);font-size:21px;font-weight:750;letter-spacing:-.025em;line-height:1.15}
.hvd-session .hvd-meta{color:var(--muted);font-size:var(--fs-small)}
.hvd-session.is-live{border-color:rgba(var(--gold-rgb),.55);box-shadow:var(--sh-1),0 0 32px -14px rgba(var(--gold-rgb),.7)}
.hvd-cta{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:7px;padding:9px 15px;border-radius:999px;background:var(--gold-foil);background-size:160% auto;color:var(--on-accent);font-size:13px;font-weight:800;box-shadow:0 8px 18px -10px rgba(var(--gold-rgb),.55)}
.hvd-cta .ic{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2}

.hvd-goals{gap:10px}
.hvd-goals-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.hvd-ring{--p:0deg;flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--gold) var(--p),var(--surface-3) 0)}
.hvd-ring b{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--surface-2);font-size:11px;color:var(--text)}
.hvd-goal-list{display:flex;flex-direction:column;gap:2px}
.hvd-goal{display:flex;align-items:center;gap:10px;min-height:42px;padding:6px 2px;text-align:left;font-size:13px;line-height:1.25;color:var(--text);cursor:pointer}
.hvd-goal span{min-width:0}
.hvd-goal-dot{flex:none;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;border:1.5px solid rgba(var(--gold-rgb),.6)}
.hvd-goal-dot .ic{width:12px;height:12px;fill:none;stroke:var(--on-accent);stroke-width:2.6}
.hvd-goal.is-done .hvd-goal-dot{background:var(--gold);border-color:var(--gold)}
.hvd-goal.is-done span{color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(var(--gold-rgb),.4)}

/* ────────────────────────────────────────────────────────────
   YOUR OFFICE · open display — two balanced columns
   Cards flow top-to-bottom through both columns; the header spans.
   ──────────────────────────────────────────────────────────── */
.of-duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--duo-gap);align-items:start;max-width:var(--duo-max);margin-inline:auto;width:100%}
.of-col{display:flex;flex-direction:column;gap:var(--duo-gap);min-width:0}
.of-col>.card,.of-col>.stat-row,.of-col>.badges,.of-col>.section-head{margin-top:0;margin-bottom:0}
.of-col>.badges{margin-inline:0;padding-inline:0;flex-wrap:wrap;overflow:visible}
.of-col>.section-head{margin-bottom:calc(var(--duo-gap) * -.5)}
html[data-form="regular"] .screen>.office-head,html[data-form="regular"] .screen>.office-account-card{max-width:var(--duo-max);margin-inline:auto;width:100%}
html[data-form="regular"] .screen>.office-head{margin-bottom:var(--duo-gap)}
html[data-form="regular"] .screen>.office-account-card{margin-bottom:var(--duo-gap)}
html[data-form="regular"] .office-head .of-name{font-size:clamp(26px,4.6vw,34px)}
html[data-form="regular"] .office-head .av-ring{transform:none;margin-right:0}
html[data-form="regular"] .of-duo .jny-row{min-height:46px}

/* ────────────────────────────────────────────────────────────
   JOURNAL · open display — summary rail + trade ledger
   duo layout is assembled in app.js (journalDuoLayout).
   ──────────────────────────────────────────────────────────── */
html[data-form="regular"] #circle-body #jseg{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:0}
html[data-form="regular"] .app-head-journal{align-items:flex-end}

.jr-duo{display:grid;grid-template-columns:minmax(250px,.92fr) minmax(0,1.25fr);gap:var(--duo-gap);align-items:start}
.jr-side{position:sticky;top:8px;display:flex;flex-direction:column;gap:var(--s3);min-width:0}
.jr-main{min-width:0}
.jr-side>.card{margin:0}
.jr-side>.card>p.sub{display:none}
.jr-side .journal-actions{margin:0}
.jr-side .chips{margin-inline:0;padding-inline:0;-webkit-mask-image:none;mask-image:none;flex-wrap:wrap;overflow:visible;margin-block:0}
.jr-main .jcard{margin-bottom:var(--s3)}
.jr-main>p.sub{margin-top:6px!important}

.jr-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.jr-stat{display:flex;flex-direction:column;gap:3px;min-width:0;padding:12px 14px;border-radius:16px;background:var(--surface-2);border:1px solid var(--line-2)}
.jr-stat small{color:var(--muted);font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.jr-stat b{font-family:var(--display);font-size:22px;letter-spacing:-.02em}
.jr-stat b.up{color:#3FBF7F}.jr-stat b.down{color:#F0565B}
.jr-stat.is-wide{grid-column:1/-1;background:radial-gradient(120% 140% at 0% 0%,rgba(var(--gold-rgb),.12),transparent 62%),var(--surface-2);border-color:rgba(var(--gold-rgb),.3)}
.jr-stat.is-wide b{font-size:34px}
.jr-eq{grid-column:1/-1;display:block;width:100%;height:92px;border-radius:14px}

/* Sheets and forms read as centred panels on a large canvas */
html[data-form="regular"] #modal .sheet{max-width:560px;margin-inline:auto}

/* ────────────────────────────────────────────────────────────
   SPLIT VIEW HALF / very narrow  (≈313px)
   ──────────────────────────────────────────────────────────── */
html[data-narrow="1"] .hv2-start-card .hv2-balance-actions{grid-template-columns:1fr}
html[data-narrow="1"] .hv2-start-title{font-size:clamp(32px,11vw,40px)!important}
html[data-narrow="1"] .hv2-brand-composite{width:min(44vw,150px)}
html[data-narrow="1"] .office-head .streak-chip{order:3}
html[data-narrow="1"] .tabbar .tab-label{font-size:9px}

@media (prefers-reduced-motion:reduce){
  .hvd-session,.hvd-actions .hv2-balance-action{transition:none}
}