/* Phase 2 app layer — shared editorial treatment for the hand-written exchange pages. */
body.app-page { min-height:100vh; background:radial-gradient(900px 460px at 78% -8%,rgba(201,162,39,.055),transparent 64%),var(--bg); color:var(--txt); font-family:var(--sans); }
.app-page header { position:sticky; inset:0 0 auto; z-index:50; height:auto; padding:0; border-bottom:var(--hairline); background:rgba(10,12,15,.88); backdrop-filter:blur(18px) saturate(130%); }
.app-page header > .wrap,.app-page header > .nav,.app-page header.site-header > div { width:min(100% - 3rem,1380px); max-width:1380px; min-height:76px; height:auto; margin-inline:auto; padding:0; display:flex; align-items:center; gap:clamp(1.4rem,3vw,3.4rem); }
.app-page .wrap { width:min(100% - 3rem,1380px); max-width:1380px; margin-inline:auto; padding-inline:0; }
.app-page .brand { display:flex; align-items:center; gap:.8rem; min-width:max-content; color:var(--txt); font:600 .95rem/1.1 var(--sans); letter-spacing:-.02em; }
.app-page .brand img,.app-page img.blogo,.app-page .logo { width:31px; height:31px; border-radius:0; object-fit:contain; background:none; }
.app-page .brand small { display:block; margin:.25rem 0 0; color:var(--txt-3); font:400 .61rem/1.2 var(--mono); letter-spacing:.12em; text-transform:uppercase; }
.app-page nav.links { display:flex; align-items:center; gap:clamp(1rem,2.2vw,2.1rem); margin-left:auto; }
.app-page nav.links a { position:relative; color:var(--txt-2); font-size:.79rem; font-weight:400; }
.app-page nav.links a::after { content:""; position:absolute; left:0; right:100%; bottom:-.65rem; height:1px; background:var(--gold); transition:right var(--fast) var(--ease); }
.app-page nav.links a:hover,.app-page nav.links a.active { color:var(--txt); }
.app-page nav.links a:hover::after,.app-page nav.links a.active::after { right:0; }
.app-page .hydra-connect { min-height:40px; margin-left:0; border:1px solid var(--line-gold); padding:.55rem .8rem; color:var(--gold-bright); font:500 .7rem/1 var(--sans); white-space:nowrap; transition:transform var(--fast) var(--ease),background var(--fast); }
.app-page .hydra-connect:hover { transform:translateY(-2px); background:var(--gold-tint); }
.app-page .hydra-connect img { width:16px; height:16px; margin-right:.45rem; vertical-align:middle; }
.app-page main.wrap { padding-top:clamp(3.5rem,7vw,7rem); padding-bottom:var(--space-7); }
.app-page h1 { margin:0 0 .9rem; color:var(--txt); font:300 clamp(2.5rem,5vw,5.2rem)/.98 var(--serif); letter-spacing:-.045em; }
.app-page h2,.app-page h3 { font-family:var(--serif); font-weight:400; letter-spacing:-.02em; }
.app-page .lead { max-width:68ch; margin:0 0 var(--space-5); color:var(--txt-2); font-size:var(--step-1); }
.app-page main.wrap::before { content:attr(data-kicker); display:block; margin-bottom:1rem; color:var(--gold); font:500 .69rem/1 var(--mono); letter-spacing:.14em; text-transform:uppercase; }
.app-page .card,.app-page .panel,.app-page .tbl-wrap,.app-page .cell,.app-page .c,.app-page .summary,.app-page .board { border:var(--hairline); border-radius:0; background:rgba(14,17,21,.76); box-shadow:none; }
.app-page .card,.app-page .panel { padding:clamp(1.25rem,2.5vw,2.1rem); margin-bottom:1px; }
.app-page .card::before,.app-page .panel::before { border-radius:0; }
.app-page .cards,.app-page .summary { gap:1px; background:var(--line); }
.app-page .c { padding:1.5rem; }
.app-page .c .k,.app-page .k,.app-page .panel-h,.app-page label { color:var(--txt-3); font:500 .65rem/1.3 var(--mono); letter-spacing:.11em; text-transform:uppercase; }
.app-page .c .v,.app-page .v,.app-page td,.app-page .px,.app-page .sym,.app-page .addr,.app-page .stat,.app-page .who { font-family:var(--mono); font-variant-numeric:tabular-nums lining-nums; }
.app-page input,.app-page select,.app-page textarea { border:var(--hairline); border-radius:0; background:var(--bg-raised); color:var(--txt); font-family:var(--mono); }
.app-page button,.app-page .btn,.app-page .mini,.app-page .act,.app-page .cta,.app-page .chip,.app-page .tag,.app-page .pill,.app-page .tog { border-radius:0; }
.app-page .btn,.app-page .mini,.app-page .act,.app-page .cta { border:1px solid var(--line-gold); background:transparent; color:var(--gold-bright); cursor:pointer; transition:transform var(--fast) var(--ease),background var(--fast),border-color var(--fast); }
.app-page .btn:hover,.app-page .mini:hover,.app-page .act:hover,.app-page .cta:hover { transform:translateY(-2px); background:var(--gold-tint); border-color:var(--gold-bright); }
.app-page .chip { border:var(--hairline); background:transparent; font:400 .68rem/1 var(--mono); letter-spacing:.04em; }
.app-page .chip.active { border-color:var(--gold); background:var(--gold-tint); color:var(--gold-bright); }
.app-page .note,.app-page .disc,.app-page .sep,.app-page .commodity { border-radius:0; border-left:1px solid var(--gold); background:linear-gradient(90deg,var(--gold-tint),transparent); }
.app-page table { font-family:var(--mono); font-variant-numeric:tabular-nums; }
.app-page th { font-family:var(--mono); }
.app-page footer { width:min(100% - 3rem,1380px); max-width:1380px; margin:0 auto; border-top:var(--hairline); padding:2rem 0; color:var(--txt-3); font:400 .69rem/1.7 var(--mono); }
.app-page .mktbar { padding:1rem max(1.5rem,calc((100vw - 1380px)/2)); border-bottom:var(--hairline); background:var(--bg-raised); }
.app-page .mktbar .v,.app-page .book,.app-page .trades,.app-page .bals,.app-page .oo { font-family:var(--mono); font-variant-numeric:tabular-nums; }
.app-page .grid { gap:1px; background:var(--line); }
.app-page .cell { border:0; }
.app-page .panel-h { padding:.85rem 1rem; border-bottom:var(--hairline); color:var(--gold); }
.app-page .seg { border:var(--hairline); border-radius:0; background:var(--bg-raised); padding:2px; }
.app-page .seg button { border-radius:0; }
.app-page .msg { border-radius:0; }
.app-page .row { font-variant-numeric:tabular-nums; }
.app-page.is-ready main > * { animation:app-in .65s var(--ease) both; }
.app-page.is-ready main > *:nth-child(2){animation-delay:.06s}.app-page.is-ready main > *:nth-child(3){animation-delay:.12s}.app-page.is-ready main > *:nth-child(4){animation-delay:.18s}
@keyframes app-in { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:none} }
@media(max-width:980px){.app-page nav.links{display:none}.app-page header > .wrap,.app-page header > .nav{min-height:68px}.app-page .hydra-connect{margin-left:auto}.app-page .grid2{grid-template-columns:1fr}}
@media(max-width:620px){.app-page .wrap,.app-page header > .wrap,.app-page header > .nav,.app-page footer{width:min(100% - 1.5rem,1380px)}.app-page .hydra-connect span{display:none}.app-page .hydra-connect img{margin:0}.app-page main.wrap{padding-top:3rem}}
@media(prefers-reduced-motion:reduce){.app-page.is-ready main > *{animation:none}.app-page *{scroll-behavior:auto}}