:root{--cream:#ece0c4;--cream-dim:#ddcda6;--charcoal:#1c1815;--charcoal-2:#241f1b;
--oxblood:#5c0f1c;--oxblood-2:#430a14;--coke-red:#d81f26;
--gold:#c9a24b;--gold-light:#e8cf8a;--gold-deep:#8f6a2e;--ink:#241f1b}
*{margin:0;padding:0;box-sizing:border-box;scrollbar-width:thin;scrollbar-color:var(--gold-deep) transparent}
::-webkit-scrollbar{width:7px;height:7px}::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--gold-deep);border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:var(--gold)}
html,body{height:100%;overflow:hidden;background:var(--charcoal);font-family:'EB Garamond',Georgia,serif;color:var(--cream);cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Cpath d='M4 2 L11 21 L13.4 13.4 L21 11 Z' fill='%23c9a24b' stroke='%23241f1b' stroke-width='1.4'/%3E%3C/svg%3E") 4 2, auto}
html,body,*{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Cpath d='M4 2 L11 21 L13.4 13.4 L21 11 Z' fill='%23c9a24b' stroke='%23241f1b' stroke-width='1.4'/%3E%3C/svg%3E") 4 2, auto}
button{font-family:inherit}
button:focus-visible,input:focus-visible{outline:2px solid var(--gold-light);outline-offset:2px}

#topbar{position:fixed;top:0;left:0;right:0;height:56px;z-index:40;
background:linear-gradient(180deg,var(--charcoal-2),var(--charcoal));border-bottom:1px solid var(--gold-deep);
display:flex;align-items:center;gap:8px;padding:0 12px}
#topbar .brand{font-family:'Cinzel',serif;font-weight:700;font-size:19px;letter-spacing:.14em;color:var(--gold-light)}
#topbar .brand span{color:var(--coke-red)}
.chip{display:flex;align-items:baseline;gap:6px;padding:4px 12px;border:1px solid var(--gold-deep);
border-radius:3px;background:rgba(201,162,75,.06);white-space:nowrap}
.chip .lab{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-deep)}
.chip .val{font-size:15px;color:var(--gold-light);font-variant-numeric:tabular-nums}
.tbtn{padding:7px 12px;border:1px solid var(--gold-deep);border-radius:3px;background:none;
color:var(--gold-light);font-size:13.5px;letter-spacing:.04em;white-space:nowrap}
.tbtn:hover{background:rgba(201,162,75,.1)}
.tbtn.on{background:var(--gold-deep);color:var(--charcoal);font-weight:600}
#regions{display:flex;gap:5px;align-items:center}
#regions .lab{font-size:10px;letter-spacing:.16em;color:var(--gold-deep);text-transform:uppercase}
#lb{display:flex;border:1px solid var(--gold-deep);border-radius:3px;overflow:hidden;margin-left:auto;}
#lb:hover{background:rgba(201,162,75,.06)}
.lbcol{padding:4px 10px;width:172px}
.lbcol+.lbcol{border-left:1px solid rgba(201,162,75,.35)}
.lbcol .t{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-deep)}
.lbcol .e{font-size:13px;color:var(--gold-light);white-space:nowrap;overflow:hidden;width:152px;font-variant-numeric:tabular-nums}
.lbcol .e b{color:var(--coke-red);margin-right:4px}
.lbcol .e .scrollname{display:inline-block}
.lbcol .e .scrollname.long{animation:slide 7s linear infinite alternate}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(calc(152px - 100%))}}

#chartwrap{position:absolute;inset:56px 0 0 0}
#chart{position:absolute;inset:0;width:100%;height:100%}
#vignette{position:absolute;inset:0;pointer-events:none;
box-shadow:inset 0 0 140px rgba(36,31,27,.55),inset 0 0 40px rgba(92,15,28,.12)}

#fleet{position:fixed;top:70px;left:14px;bottom:18px;z-index:30;width:240px;
background:var(--charcoal-2);border:1px solid var(--gold-deep);border-radius:4px;display:flex;flex-direction:column}
#fleet h3,.rbox h3{font-family:'Cinzel',serif;font-size:11px;letter-spacing:.18em;color:var(--gold);
padding:10px 12px 8px;text-transform:uppercase;border-bottom:1px solid rgba(201,162,75,.25);flex:none}
#fleetlist{overflow-y:auto;flex:1}
.fship{border-bottom:1px solid rgba(201,162,75,.12);padding:8px 10px 8px 12px}
.fship .top{display:flex;align-items:center;gap:8px}
.fship .glyph{width:18px;height:14px;flex:none}
.fship .nm{font-size:15px;font-weight:600;flex:1;background:none;border:none;text-align:left;padding:0;color:var(--gold-light)}
.fship .nm:hover{text-decoration:underline}
.fship .ren,.fship .chev{background:none;border:none;color:var(--gold-deep);font-size:12px;padding:2px 4px}
.fship .ren:hover{color:var(--gold-light)}
.fship .chev{transition:transform .18s}
.fship.open .chev{transform:rotate(90deg)}
.fship .mini{font-size:12.5px;color:var(--cream-dim);margin:3px 0 0 26px;display:flex;justify-content:space-between;gap:6px}
.fship .mini .sailing{color:var(--gold)}
.etabar{height:3px;background:rgba(201,162,75,.18);border-radius:2px;margin:6px 0 0 26px;overflow:hidden}
.etabar i{display:block;height:100%;background:var(--gold);width:0%}
.fship .details{display:none;margin:8px 0 2px 26px;font-size:13px}
.fship.open .details{display:block}
.drow{display:flex;justify-content:space-between;padding:2px 0;border-bottom:1px dotted rgba(201,162,75,.15)}
.drow b{color:var(--gold-light);font-weight:600;font-variant-numeric:tabular-nums}

#rail{position:fixed;top:70px;right:14px;bottom:18px;z-index:30;width:238px;display:flex;flex-direction:column;gap:12px}
.rbox{background:var(--charcoal-2);border:1px solid var(--gold-deep);border-radius:4px;display:flex;flex-direction:column;min-height:0}
.layer-btn{display:flex;width:100%;align-items:center;gap:9px;background:none;border:none;
color:var(--cream-dim);font-size:14px;padding:6px 12px;text-align:left}
.layer-btn:hover{background:rgba(201,162,75,.08)}
.layer-btn .box{width:13px;height:13px;border:1px solid var(--gold-deep);border-radius:2px;flex:none;
display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--charcoal)}
.layer-btn.on{color:var(--gold-light)}
.layer-btn.on .box{background:var(--gold)}
.layer-btn.on.red .box{background:var(--coke-red);border-color:var(--coke-red);color:#fff}
.layer-btn.locked{opacity:.55}
.layer-btn .lock{margin-left:auto;font-size:11px;color:var(--gold-deep);font-style:italic}
#csearch{margin:8px 10px;padding:6px 9px;background:rgba(236,224,196,.06);border:1px solid var(--gold-deep);
border-radius:3px;color:var(--cream);font-family:inherit;font-size:13px;width:calc(100% - 20px)}
#csearch::placeholder{color:var(--gold-deep);font-style:italic}
#clist{overflow-y:auto;flex:1}
.con{width:100%;background:none;border:none;text-align:left;color:var(--cream);
padding:7px 12px;border-bottom:1px solid rgba(201,162,75,.1);font-size:13px}
.con:hover{background:rgba(201,162,75,.08)}
.con .r1{display:flex;justify-content:space-between;color:var(--gold-light)}
.con .r2{display:flex;justify-content:space-between;color:var(--cream-dim);font-size:12px;margin-top:1px}
.tierchip{font-size:10px;border:1px solid var(--gold-deep);border-radius:2px;padding:0 4px;color:var(--gold)}
.warn{display:flex;gap:8px;padding:7px 12px;border-bottom:1px solid rgba(201,162,75,.1);font-size:13px;align-items:flex-start}
.warn .sig{width:8px;height:8px;border-radius:50%;margin-top:5px;flex:none}
.warn.red .sig{background:var(--coke-red)}.warn.gold .sig{background:var(--gold)}
.warn.red{color:#f0c9c9}.warn.gold{color:var(--cream-dim)}

.panel{position:fixed;z-index:45;background:var(--charcoal-2);border:1px solid var(--gold-deep);
border-radius:5px;box-shadow:0 10px 34px rgba(0,0,0,.5);display:none}
.panel.open{display:block}
.panel h2{font-family:'Cinzel',serif;font-size:15px;letter-spacing:.08em;color:var(--gold-light);
padding:12px 16px;border-bottom:1px solid rgba(201,162,75,.3);display:flex;justify-content:space-between;align-items:center;gap:10px}
.panel h2 .x{background:none;border:none;color:var(--cream-dim);font-size:17px;padding:2px 6px}
.panel h2 .x:hover{color:var(--coke-red)}
#shipcard{bottom:18px;left:266px;width:252px}
#shipcard .body,#shipinfo .body,#portcard .body{padding:10px 16px 14px}
.clsline{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:8px}
.stat{display:flex;justify-content:space-between;font-size:14px;padding:3px 0;border-bottom:1px dotted rgba(201,162,75,.2)}
.stat b{color:var(--gold-light);font-weight:600;font-variant-numeric:tabular-nums}
.stat b.lock{color:var(--gold-deep);font-style:italic;font-weight:400}
.btn{border-radius:3px;padding:8px 14px;font-size:14px;border:1px solid var(--gold-deep);background:none;color:var(--gold-light)}
.btn:hover{background:rgba(201,162,75,.1)}
.btn.primary{background:var(--coke-red);border-color:var(--coke-red);color:#fff;font-weight:600}
.btn.primary:hover{background:#b8151c}
.btn:disabled{opacity:.4;}
#shipinfo{top:76px;left:50%;transform:translateX(-50%);width:280px}
#portcard{top:76px;left:50%;transform:translateX(-50%);width:300px}
#portcard .plist{max-height:180px;overflow-y:auto;margin-top:8px;border-top:1px solid rgba(201,162,75,.25)}
#picker{top:50%;left:50%;transform:translate(-50%,-50%);width:330px}
#picker .body{padding:6px 0 10px}
.pick{width:100%;background:none;border:none;text-align:left;color:var(--cream);
padding:9px 16px;border-bottom:1px solid rgba(201,162,75,.12);font-size:14px}
.pick:hover{background:rgba(201,162,75,.08)}
.pick .r1{display:flex;justify-content:space-between;color:var(--gold-light);font-weight:600}
.pick .r2{display:flex;justify-content:space-between;color:var(--cream-dim);font-size:12.5px}
#planner{bottom:18px;right:262px;width:300px}
#planner .body{padding:12px 16px 16px}
#planner .hint{font-size:13px;font-style:italic;color:var(--cream-dim);margin-bottom:8px}
.presets{display:flex;gap:6px;margin-bottom:10px}
.preset{flex:1;padding:6px 0;font-size:13px;border:1px solid var(--gold-deep);background:none;color:var(--cream-dim);border-radius:3px}
.preset.on{background:var(--gold-deep);color:var(--charcoal);font-weight:600}
.receipt{font-size:14px}
.receipt .row{display:flex;justify-content:space-between;padding:3px 0;border-bottom:1px dotted rgba(201,162,75,.18)}
.receipt .row span:last-child{font-variant-numeric:tabular-nums;color:var(--gold-light)}
.receipt .row.warnr span:last-child{color:var(--coke-red)}
.receipt .row.net{border-top:1px solid var(--gold-deep);border-bottom:none;margin-top:6px;padding-top:8px;font-size:16px}
.receipt .row.net span:last-child{font-weight:700}
.escrow{display:flex;align-items:center;gap:8px;margin:8px 0;padding:7px 9px;border:1px dashed var(--gold-deep);border-radius:3px;font-size:13px}
.escrow input{accent-color:var(--coke-red)}
#planner .drag-note{font-size:12px;color:var(--gold-deep);margin:8px 0 10px;font-style:italic}
#landwarn{color:var(--coke-red);font-size:13px;margin:6px 0;display:none;font-style:italic}
#dispatch{top:50%;left:50%;transform:translate(-50%,-50%);width:360px}
#dispatch .body{padding:14px 18px 18px;text-align:center}
#dispatch .eta{font-family:'Cinzel',serif;font-size:26px;color:var(--gold-light);margin:6px 0 2px}
#dispatch .sub{font-size:14px;color:var(--cream-dim);margin-bottom:12px}
.adbox{border:1px dashed var(--gold-deep);border-radius:3px;background:rgba(236,224,196,.05);padding:22px 10px;margin:10px 0 6px}
.adbox .adlab{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:6px}
.adbox .adfake{font-size:15px;font-style:italic;color:var(--cream-dim)}
#dispatch .honest{font-size:12px;color:var(--gold-deep);font-style:italic;margin-bottom:12px}
#lbfull{top:70px;right:14px;width:400px}
#lbfull .body{padding:8px 0 10px;display:flex}
#lbfull .col{flex:1;padding:4px 14px}
#lbfull .col+.col{border-left:1px solid rgba(201,162,75,.25)}
#lbfull .col h4{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:6px}
#lbfull .lrow{display:flex;justify-content:space-between;font-size:13.5px;padding:3px 0;border-bottom:1px dotted rgba(201,162,75,.15)}
#lbfull .lrow b{color:var(--coke-red);width:22px}
#lbfull .lrow span:last-child{color:var(--gold-light);font-variant-numeric:tabular-nums}
#techtree{top:50%;left:50%;transform:translate(-50%,-50%);width:min(720px,92vw);max-height:82vh;display:none}
#techtree.open{display:flex;flex-direction:column}
#techtree .body{padding:12px 18px 16px;font-size:14px;display:flex;gap:16px;overflow:hidden;flex:1}
#ttspine{flex:1.3;overflow-y:auto;padding-right:6px}
.ttier{margin-bottom:10px}
.ttier .tl{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:4px}
.ttier .tn{display:flex;flex-wrap:wrap;gap:6px}
.tnode{padding:5px 10px;border-radius:3px;border:1px solid var(--gold-deep);font-size:12.5px;color:var(--cream-dim);background:none}
.tnode:hover{background:rgba(201,162,75,.1)}
.tnode.owned{background:var(--gold-deep);color:var(--charcoal);font-weight:600}
.tnode.gate{border-color:var(--coke-red);color:var(--coke-red)}
.tnode.sel{outline:2px solid var(--gold-light)}
#ttdetail{flex:1;border-left:1px solid rgba(201,162,75,.25);padding-left:16px;overflow-y:auto}
#ttdetail .dn{font-family:'Cinzel',serif;font-size:17px;color:var(--gold-light)}
#ttdetail .dt{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);margin:2px 0 10px}
#ttdetail .de{font-size:14.5px;line-height:1.45;margin-bottom:10px}
#ttdetail .dc{font-size:14px}
#ttdetail .dc b{color:var(--gold-light)}
#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:95;
background:var(--oxblood);color:var(--cream);padding:9px 18px;border-radius:3px;font-size:14px;
border:1px solid var(--oxblood-2);opacity:0;transition:opacity .3s;pointer-events:none;max-width:70vw;text-align:center}
#toast.show{opacity:1}

/* ===== A/B: landing · auth · onboarding ===== */
.ov{position:fixed;inset:0;z-index:80;display:none;align-items:center;justify-content:center;
 background:rgba(28,24,21,.42);backdrop-filter:blur(1px)}
.ov.open{display:flex}
.ovcard{background:var(--charcoal-2);border:1px solid var(--gold-deep);border-radius:6px;
 box-shadow:0 18px 60px rgba(0,0,0,.6);padding:30px 34px;width:min(460px,92vw);text-align:center}
.ovcard .big{font-family:'Cinzel',serif;font-weight:700;font-size:34px;letter-spacing:.12em;color:var(--gold-light)}
.ovcard .big span{color:var(--coke-red)}
.ovcard .tag{font-size:17px;font-style:italic;color:var(--cream-dim);margin:8px 0 18px}
.ovcard .trio{display:flex;gap:10px;margin:0 0 22px;font-size:13.5px;color:var(--cream-dim)}
.ovcard .trio div{flex:1;border:1px solid rgba(201,162,75,.3);border-radius:4px;padding:10px 8px}
.ovcard .trio b{display:block;color:var(--gold);font-size:15px;margin-bottom:3px;font-family:'Cinzel',serif;font-weight:500}
.cta{width:100%;padding:13px;font-size:17px;letter-spacing:.06em;background:var(--coke-red);
 border:1px solid var(--coke-red);color:#fff;border-radius:4px;font-weight:600;font-family:'Cinzel',serif}
.cta:hover{background:#b8151c}
.ovcard .small{margin-top:14px;font-size:12.5px;color:var(--gold-deep)}
.ovcard .small a{color:var(--gold);text-decoration:underline}
.ovcard input,.ovcard select{width:100%;margin:6px 0;padding:11px 12px;background:var(--charcoal-2);color-scheme:dark;
 border:1px solid var(--gold-deep);border-radius:3px;color:var(--cream);font-family:inherit;font-size:15px;outline:none}
.ovcard input:focus,.ovcard select:focus{border-color:var(--gold);box-shadow:0 0 0 2px rgba(201,162,75,.18)}
.ovcard select option,select option{background:var(--charcoal-2);color:var(--cream)}
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 1000px var(--charcoal-2) inset;-webkit-text-fill-color:var(--cream);caret-color:var(--cream);transition:background-color 9999s}
input,select,textarea{color-scheme:dark;accent-color:var(--coke-red)}
.ovcard input::placeholder{color:var(--gold-deep);font-style:italic}
.authtabs{display:flex;gap:6px;margin-bottom:14px}
.authtabs button{flex:1;padding:8px 0;font-size:14px;border:1px solid var(--gold-deep);background:none;
 color:var(--cream-dim);border-radius:3px}
.authtabs button.on{background:var(--gold-deep);color:var(--charcoal);font-weight:600}
.classgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0 4px}
.ccard{border:1px solid var(--gold-deep);border-radius:4px;padding:12px 8px;background:none;
 color:var(--cream-dim);font-size:12.5px;position:relative;text-align:center}
.ccard:hover{background:rgba(201,162,75,.1);color:var(--cream)}
.ccard b{display:block;font-family:'Cinzel',serif;font-weight:600;font-size:14px;color:var(--gold-light);margin-bottom:4px}
.ccard .rec{position:absolute;top:-9px;left:50%;transform:translateX(-50%);background:var(--coke-red);
 color:#fff;font-size:9.5px;letter-spacing:.08em;padding:2px 7px;border-radius:2px;white-space:nowrap}
.ovcard h2x{display:block;font-family:'Cinzel',serif;font-size:20px;color:var(--gold-light);letter-spacing:.08em;margin-bottom:4px}
.ovcard .sub2{font-size:14px;color:var(--cream-dim);font-style:italic;margin-bottom:10px}

/* ===== D2 port screen ===== */
#portcard{top:74px;left:50%;transform:translateX(-50%);width:min(600px,94vw);max-height:78vh;display:none}
#portcard.open{display:flex;flex-direction:column}
.ptabs{display:flex;gap:4px;padding:10px 16px 0;flex:none}
.ptab{padding:7px 14px;font-size:13.5px;border:1px solid var(--gold-deep);border-bottom:none;
 background:none;color:var(--cream-dim);border-radius:3px 3px 0 0}
.ptab.on{background:var(--gold-deep);color:var(--charcoal);font-weight:600}
#pbody{padding:12px 16px 16px;overflow-y:auto;border-top:1px solid rgba(201,162,75,.3);flex:1}
.gtable{width:100%;font-size:13.5px;border-collapse:collapse}
.gtable th{text-align:left;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
 color:var(--gold-deep);font-weight:400;padding:4px 6px;border-bottom:1px solid rgba(201,162,75,.25)}
.gtable td{padding:6px;border-bottom:1px dotted rgba(201,162,75,.15);font-variant-numeric:tabular-nums}
.gtable td.n{color:var(--gold-light)}
.gtable tr:hover{background:rgba(201,162,75,.06)}
.trend.up{color:var(--coke-red)} .trend.dn{color:var(--gold)}
.hullrow{display:flex;gap:12px;align-items:center;padding:9px 6px;border-bottom:1px dotted rgba(201,162,75,.15)}
.hullrow .hn{flex:1}
.hullrow .hn b{color:var(--gold-light);font-size:15px;display:block}
.hullrow .hn span{font-size:12.5px;color:var(--cream-dim)}
.bar{height:4px;background:rgba(201,162,75,.18);border-radius:2px;overflow:hidden;margin-top:8px}
.bar i{display:block;height:100%;background:var(--gold)}

#condetail{top:50%;left:50%;transform:translate(-50%,-50%);width:min(430px,94vw)}
#condetail .body{padding:12px 18px 16px}
.badge{display:inline-block;font-size:10.5px;letter-spacing:.1em;padding:2px 8px;border-radius:2px;
 border:1px solid var(--gold-deep);color:var(--gold);margin-right:5px}
.badge.up{border-color:var(--coke-red);color:var(--coke-red)}
.badge.dn{border-color:var(--gold-deep);color:var(--gold-deep)}
#eventlog{top:74px;right:14px;width:min(360px,92vw);max-height:70vh;display:none}
#eventlog.open{display:flex;flex-direction:column}
#evlist{overflow-y:auto;padding:6px 0}
.ev{display:flex;gap:9px;padding:8px 14px;border-bottom:1px solid rgba(201,162,75,.1);font-size:13.5px}
.ev .d{width:7px;height:7px;border-radius:50%;margin-top:6px;flex:none;background:var(--gold)}
.ev.red .d{background:var(--coke-red)} .ev.dim .d{background:var(--gold-deep)}
.ev .tm{color:var(--gold-deep);font-size:11.5px;white-space:nowrap}
#bell{position:relative}
#bell .cnt{position:absolute;top:-5px;right:-5px;background:var(--coke-red);color:#fff;font-size:10px;
 border-radius:9px;padding:1px 5px;font-variant-numeric:tabular-nums}
#classdd{position:relative}
#classmenu{display:none;position:absolute;top:38px;left:0;z-index:60;width:210px;background:var(--charcoal-2);
 border:1px solid var(--gold-deep);border-radius:4px;padding:4px 0}
.cmi{padding:7px 12px;font-size:14px;color:var(--cream-dim);display:flex;gap:8px;align-items:center}
.cmi:hover{background:rgba(201,162,75,.08)}
.cmi.on{color:var(--gold-light)}
.cmi small{margin-left:auto;color:var(--gold-deep);font-size:11px;font-style:italic}
#office{top:74px;left:50%;transform:translateX(-50%);width:min(620px,94vw);max-height:78vh;display:none}
#office.open{display:flex;flex-direction:column}
#obody{padding:12px 16px 16px;overflow-y:auto}
.tender{border:1px solid rgba(201,162,75,.3);border-radius:4px;padding:10px 12px;margin-bottom:8px}
.tender .r1{display:flex;justify-content:space-between;align-items:baseline}
.tender .r1 b{color:var(--gold-light);font-size:15px}
.tender .r1 .fee{color:var(--coke-red);font-size:16px;font-weight:700;font-variant-numeric:tabular-nums}
.tender .r2{display:flex;justify-content:space-between;font-size:12.5px;color:var(--cream-dim);margin-top:3px}

#crisis{top:74px;left:50%;transform:translateX(-50%);width:min(600px,94vw);max-height:78vh;display:none}
#crisis.open{display:flex;flex-direction:column}
.crcard{border:1px solid var(--oxblood);border-radius:4px;padding:11px 13px;margin-bottom:9px;
 background:linear-gradient(180deg,rgba(92,15,28,.14),transparent)}
.crcard.calm{border-color:rgba(201,162,75,.3);background:none}
.crcard .h{display:flex;justify-content:space-between;align-items:baseline}
.crcard .h b{font-family:'Cinzel',serif;font-size:16px;color:var(--gold-light)}
.crcard .h .sev{font-size:11px;letter-spacing:.12em;padding:2px 8px;border-radius:2px;
 border:1px solid var(--coke-red);color:var(--coke-red)}
.crcard .verbs{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}

#techtree{top:4vh;left:50%;transform:translateX(-50%);width:min(1180px,96vw);height:88vh;display:none}
#techtree.open{display:flex;flex-direction:column}
#ttwrap{flex:1;display:flex;min-height:0}
#ttcanvas{flex:1;overflow:auto;min-width:0;padding:16px 20px 30px;background:
  repeating-linear-gradient(0deg,transparent,transparent 79px,rgba(201,162,75,.05) 79px,rgba(201,162,75,.05) 80px)}
#ttdetail{width:290px;flex:none;border-left:1px solid rgba(201,162,75,.28);padding:16px;overflow-y:auto}
.trow{display:flex;align-items:flex-start;margin-bottom:26px;position:relative}
.tlabel{width:96px;flex:none;font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-deep);padding-top:16px;text-align:right;padding-right:12px;line-height:1.3}
.tlabel b{display:block;color:var(--gold);font-size:11px;letter-spacing:.14em}
.tcols{flex:1;display:flex;gap:14px}
.tcol{flex:1;display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start;position:relative}
.tcol.dead{opacity:.28}
.tcol.dead::after{content:'LOCKED FOREVER';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-8deg);
  font-family:'Cinzel',serif;font-size:11px;letter-spacing:.2em;color:var(--coke-red);
  border:1px solid var(--coke-red);padding:3px 10px;background:var(--charcoal-2);white-space:nowrap;z-index:2}
.tnd{position:relative;min-width:104px;flex:1 1 104px;background:var(--charcoal);border:1px solid var(--gold-deep);
  border-radius:3px;padding:8px 9px;text-align:left;color:var(--cream-dim);font-size:12px;line-height:1.25}
.tnd:hover{background:rgba(201,162,75,.12);border-color:var(--gold)}
.tnd .nn{display:block;color:var(--gold-light);font-size:12.5px;font-weight:600;margin-bottom:2px}
.tnd .cc{font-size:11px;color:var(--gold-deep);font-variant-numeric:tabular-nums}
.tnd.owned{background:linear-gradient(180deg,var(--gold-deep),#7a5926);border-color:var(--gold);color:var(--charcoal)}
.tnd.owned .nn{color:#1c1815}.tnd.owned .cc{color:#3a2c12}
.tnd.owned::after{content:'✔';position:absolute;top:5px;right:7px;font-size:11px;color:#1c1815}
.tnd.gate{border-color:var(--coke-red);border-width:2px}
.tnd.gate .nn{color:#ffb3b6}
.tnd.avail{box-shadow:0 0 0 1px rgba(232,207,138,.35) inset}
.tnd.sel{outline:2px solid var(--gold-light);outline-offset:1px}
.tnd.forbid{opacity:.35;filter:grayscale(.6)}
.trow::before{content:'';position:absolute;left:132px;right:0;top:-16px;height:16px;
  background:linear-gradient(180deg,transparent,rgba(201,162,75,.28));pointer-events:none}
.trow:first-child::before{display:none}
.branchhead{display:flex;gap:14px;margin:0 0 8px 108px}
.branchhead.six div{font-size:10px;letter-spacing:.1em}
.branchhead .dim{opacity:.3}
.branchhead div{flex:1;text-align:center;font-family:'Cinzel',serif;font-size:11.5px;letter-spacing:.16em;
  color:var(--gold);border-bottom:1px solid rgba(201,162,75,.3);padding-bottom:4px}
#ttdetail .dh{font-family:'Cinzel',serif;font-size:19px;color:var(--gold-light);line-height:1.2}
#ttdetail .dsub{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);margin:4px 0 12px}
#ttdetail .dbody{font-size:14px;line-height:1.5;color:var(--cream);margin-bottom:12px}
#ttdetail .drow2{display:flex;justify-content:space-between;font-size:13.5px;padding:4px 0;
  border-bottom:1px dotted rgba(201,162,75,.2)}
#ttdetail .drow2 b{color:var(--gold-light)}
#ttdetail .warn2{border:1px solid var(--coke-red);border-radius:3px;padding:9px 11px;margin-top:12px;
  font-size:12.5px;color:#f0c9c9;line-height:1.45}
.apexbar{height:6px;background:rgba(201,162,75,.2);border-radius:3px;overflow:hidden;margin-top:6px}
.apexbar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold-deep),var(--gold-light))}

#planner{max-height:calc(100% - 96px);overflow-y:auto}
.stoplist{display:flex;flex-wrap:wrap;gap:5px;margin:0 0 8px}
.stopchip{font-size:12px;border:1px solid var(--gold-deep);border-radius:12px;padding:2px 9px;background:none;color:var(--gold-light)}
.stopchip:hover{background:rgba(201,162,75,.12)}
.stopchip.via{border-style:dashed}
.stopchip.reset{color:var(--gold-deep)}
.tech{font-size:11.5px;color:var(--gold-deep);margin-top:6px;font-variant-numeric:tabular-nums}
#pnconfirm .ovcard{width:min(420px,92vw)}

#orders{top:70px;left:50%;transform:translateX(-50%);width:min(760px,95vw);max-height:84vh;display:none}
#orders.open{display:flex;flex-direction:column}
#or-body{padding:10px 16px 16px;overflow-y:auto}
.or-grammar{font-size:13.5px;color:var(--cream-dim);padding:8px 10px;border:1px dashed var(--gold-deep);border-radius:3px;margin-bottom:10px;display:flex;flex-wrap:wrap;gap:6px 14px}
.or-grammar b{color:var(--gold-light)}
.or-next{color:var(--gold-deep);font-style:italic}
.or-trig{border-bottom:1px solid rgba(201,162,75,.18);padding:9px 0 10px}
.or-t{font-family:'Cinzel',serif;font-size:13px;letter-spacing:.06em;color:var(--gold);margin-bottom:6px}
.or-seg{display:flex;gap:5px;flex-wrap:wrap}.or-seg .preset{flex:1;min-width:120px;font-size:12.5px;padding:6px 4px}
.or-thr{font-size:13.5px;color:var(--cream-dim)}.or-thr b{color:var(--gold-light)}
.or-thr input,.or-rule input{width:84px;background:rgba(236,224,196,.06);border:1px solid var(--gold-deep);color:var(--cream);border-radius:3px;padding:3px 5px;font-family:inherit;font-size:13px}
.or-rule{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin:4px 0;font-size:13px}
.or-rule select{background:var(--charcoal);border:1px solid var(--gold-deep);color:var(--cream);border-radius:3px;padding:3px 4px;font-family:inherit;font-size:13px}
.or-kw{font-family:'Cinzel',serif;font-size:11px;letter-spacing:.12em;color:var(--coke-red);min-width:34px}
.or-add,.or-test,.or-x{background:none;border:1px solid var(--gold-deep);color:var(--gold-light);border-radius:3px;padding:3px 9px;font-size:12px;margin-top:5px}
.or-x{margin-top:0;padding:2px 7px}
.or-out{font-size:12.5px;color:var(--cream-dim);margin-top:5px;display:flex;flex-direction:column;gap:2px}
.or-res{color:var(--gold-light)}
.stopchip.scarce{border-color:var(--coke-red);color:#f0c9c9}
.pick.unreach{opacity:.55}
#wread{position:absolute;left:50%;top:12px;transform:translateX(-50%);white-space:nowrap;padding:5px 11px;background:rgba(244,236,216,.92);
 border:1px solid rgba(143,106,46,.45);font:italic 14px "EB Garamond",serif;color:#5c0f1c;pointer-events:none;
 opacity:0;transition:opacity .15s;z-index:3;max-width:70%}
.tech.zones{font-style:italic;color:#c9a24b;line-height:1.35;opacity:.9}

/* ===== v16 screens ===== */
#outfit{top:74px;left:50%;transform:translateX(-50%);width:min(560px,94vw);max-height:82vh;overflow-y:auto}
#rookie{top:74px;left:50%;transform:translateX(-50%);width:min(420px,94vw)}
#seize{top:50%;left:50%;transform:translate(-50%,-50%);width:min(470px,94vw);border-color:var(--coke-red);box-shadow:0 0 0 1px var(--oxblood),0 14px 44px rgba(0,0,0,.6)}
#seize h2{background:linear-gradient(180deg,var(--oxblood),var(--oxblood-2));color:#f3dede}
#profile{top:74px;left:50%;transform:translateX(-50%);width:min(600px,94vw);max-height:82vh;overflow-y:auto}
#settings{top:74px;left:50%;transform:translateX(-50%);width:min(460px,94vw);max-height:82vh;overflow-y:auto}
#outfit .body,#rookie .body,#seize .body,#profile .body,#settings .body{padding:12px 16px 16px}
.sec{font-family:'Cinzel',serif;font-size:11px;letter-spacing:.18em;color:var(--gold);text-transform:uppercase;margin:12px 0 6px}
.sec:first-child{margin-top:0}
.note{font-size:12.5px;color:var(--gold-deep);font-style:italic;line-height:1.45}
.mgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media (max-width:520px){.mgrid{grid-template-columns:1fr}}
.mcard{border:1px solid rgba(201,162,75,.3);border-radius:4px;padding:8px 10px;font-size:13px;display:flex;flex-direction:column;gap:3px}
.mcard b{color:var(--gold-light);font-size:14px}
.mcard .fx{color:var(--cream-dim)}
.mcard .tr{color:#e8a7a7;font-size:12px}
.mcard .ft{display:flex;justify-content:space-between;align-items:center;margin-top:4px}
.mcard .pr{color:var(--gold-light);font-variant-numeric:tabular-nums}
.mcard.inst{border-color:var(--gold);background:rgba(201,162,75,.07)}
.mcard button{padding:3px 10px;font-size:12.5px}
.slots{display:flex;gap:6px;margin:4px 0 2px}
.slot{flex:1;min-height:44px;border:1px dashed var(--gold-deep);border-radius:4px;padding:5px 8px;font-size:12.5px;color:var(--gold-deep);display:flex;justify-content:space-between;align-items:center;gap:6px}
.slot.full{border-style:solid;color:var(--gold-light);background:rgba(201,162,75,.08)}
.slot button{padding:2px 7px;font-size:11.5px}
.statcmp{display:grid;grid-template-columns:repeat(3,1fr);gap:4px 12px;font-size:13px}
.statcmp div{display:flex;justify-content:space-between;border-bottom:1px dotted rgba(201,162,75,.2);padding:2px 0}
.statcmp b{color:var(--gold-light);font-variant-numeric:tabular-nums;font-weight:600}
.statcmp b.up{color:#9fd49a}.statcmp b.dn{color:#e8a7a7}
.pbar{height:6px;background:rgba(201,162,75,.18);border-radius:3px;overflow:hidden;margin:4px 0 2px}
.pbar i{display:block;height:100%;background:var(--gold)}
.covers{font-size:13.5px;line-height:1.6}
.covers .y{color:var(--cream)}.covers .n{color:var(--cream-dim);opacity:.8}
.goal{display:flex;gap:8px;font-size:13px;padding:2px 0;color:var(--cream-dim)}
.goal.done{color:var(--gold-light)}
.shield-big{font-size:46px;text-align:center;margin-bottom:4px}
.gradlist{text-align:left;font-size:13.5px;line-height:1.5;color:var(--cream-dim);display:flex;flex-direction:column;gap:8px;margin:12px 0 16px}
.gradlist b{color:var(--gold-light)}
.szline{font-size:13px;color:var(--cream-dim);margin-bottom:8px;line-height:1.45}
.szvs{display:flex;align-items:center;gap:10px;margin:6px 0 10px;font-size:13px}
.szvs .side{flex:1;border:1px solid rgba(201,162,75,.3);border-radius:4px;padding:6px 8px}
.szvs .side b{display:block;color:var(--gold-light);font-size:14px}
.szvs .side.pir{border-color:rgba(216,31,38,.5)}
.szopt{display:flex;flex-direction:column;gap:7px;margin-top:10px}
.szopt button{text-align:left;padding:9px 12px;font-size:14px;display:flex;flex-direction:column;gap:2px}
.szopt button span{font-size:12.5px;color:var(--cream-dim);font-weight:400}
.szopt button.primary span{color:#fbe3e3}
.szlaw{margin-top:12px;padding-top:8px;border-top:1px solid rgba(201,162,75,.25);font-size:12.5px;color:var(--gold-light);font-style:italic;text-align:center}
.offer{display:flex;justify-content:space-between;align-items:center;gap:8px;border:1px solid rgba(201,162,75,.3);border-radius:4px;padding:7px 10px;font-size:13px;margin-top:6px}
.offer b{color:var(--gold-light)}
.mdcard{border:1px solid rgba(216,31,38,.45);border-radius:4px;padding:8px 10px;margin-bottom:8px;font-size:13px}
.mdcard .h{display:flex;justify-content:space-between;gap:8px;color:var(--gold-light)}
.mdcard .w{font-size:12px;letter-spacing:.08em;color:var(--gold-deep);margin:2px 0 4px;text-transform:uppercase}
.mdcard .ft{display:flex;justify-content:space-between;align-items:center;margin-top:6px;gap:8px}
.mdcard .ft button{padding:4px 10px;font-size:12.5px}
#cr-open{position:relative}
#cr-open .cnt{position:absolute;top:-5px;right:-5px;background:var(--coke-red);color:#fff;font-size:10px;border-radius:8px;padding:0 5px;line-height:15px}
.elogrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
@media (max-width:560px){.elogrid{grid-template-columns:1fr 1fr}}
.elocard{border:1px solid rgba(201,162,75,.3);border-radius:4px;padding:7px 9px;font-size:12.5px}
.elocard .c{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep)}
.elocard .r{font-size:19px;color:var(--gold-light);font-variant-numeric:tabular-nums}
.elocard .t{color:var(--cream-dim);font-style:italic;line-height:1.25;min-height:30px}
.elocard.pir .r{color:#e8a7a7}
.tchips{display:flex;flex-wrap:wrap;gap:6px}
.tchip{border:1px solid var(--gold-deep);border-radius:12px;padding:2px 10px;font-size:12.5px;color:var(--gold-light)}
.gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:6px}
.galship{border:1px solid rgba(201,162,75,.22);border-radius:4px;padding:5px 8px;font-size:12.5px;color:var(--cream-dim)}
.galship b{display:block;color:var(--gold-light);font-size:13.5px}
.srow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px dotted rgba(201,162,75,.2);font-size:14px}
.srow .l{display:flex;flex-direction:column}
.srow .l span{font-size:12px;color:var(--gold-deep);font-style:italic}
.srow input[type=text],.srow select{background:rgba(236,224,196,.06);border:1px solid var(--gold-deep);border-radius:3px;color:var(--cream);font-family:inherit;font-size:13.5px;padding:5px 8px;max-width:170px}
.tog{width:38px;height:21px;border-radius:11px;border:1px solid var(--gold-deep);background:none;position:relative;flex:none}
.tog::after{content:'';position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;background:var(--gold-deep);transition:left .15s}
.tog.on{background:var(--gold-deep)}.tog.on::after{left:19px;background:var(--gold-light)}
#coach{position:fixed;z-index:90;width:280px;background:var(--cream);color:var(--ink);border:1px solid var(--gold-deep);border-radius:5px;
 padding:10px 12px;box-shadow:0 10px 30px rgba(0,0,0,.45);display:none;font-size:14px;line-height:1.45}
#coach .cstep{font-family:'Cinzel',serif;font-size:10.5px;letter-spacing:.18em;color:var(--oxblood);margin-bottom:3px}
#coach .cbtns{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
#coach .cbtns a{font-size:12.5px;color:var(--gold-deep);text-decoration:underline}
#coach .cbtns .btn{color:var(--oxblood);border-color:var(--oxblood);padding:4px 12px;font-size:13px}
#coachring{position:fixed;z-index:89;pointer-events:none;border:2px solid var(--gold-light);border-radius:5px;display:none;
 box-shadow:0 0 0 3px rgba(216,31,38,.55);animation:ring 1.4s ease-in-out infinite}
@keyframes ring{50%{box-shadow:0 0 0 7px rgba(216,31,38,.15)}}
#capbtn{flex:none;max-width:160px;overflow:hidden;text-overflow:ellipsis}
#topbar .tbtn{padding:7px 10px}
#lb{min-width:0;flex-shrink:1}
#capmenu{position:fixed;z-index:70;display:none;min-width:200px;background:var(--charcoal-2);border:1px solid var(--gold-deep);border-radius:4px;padding:4px 0}
#capmenu button{display:flex;justify-content:space-between;width:100%;background:none;border:none;color:var(--cream);text-align:left;padding:8px 14px;font-size:14px;gap:10px}
#capmenu button span{color:var(--gold-deep);font-size:12.5px}
#capmenu button:hover{background:rgba(201,162,75,.1)}
@media (prefers-reduced-motion:reduce){#coachring{animation:none}}
body.cbsafe{--coke-red:#e66100}
#lb .lbcol .e{width:clamp(96px,10.5vw,152px)}


/* ===== v17: fold-away panels ===== */
#fleet,#rail{transition:transform .22s ease,opacity .22s ease}
body.fold-left #fleet{transform:translateX(calc(-100% - 24px));opacity:0;pointer-events:none}
body.fold-right #rail{transform:translateX(calc(100% + 24px));opacity:0;pointer-events:none}
.edgetab{position:fixed;top:50%;z-index:31;transform:translateY(-50%);display:none;flex-direction:column;align-items:center;gap:6px;
 padding:10px 5px;background:var(--charcoal-2);border:1px solid var(--gold-deep);color:var(--gold-light);font-size:12px;}
.edgetab:hover{background:#2e2722}
.edgetab .a{font-size:18px;line-height:1}
.edgetab .v{writing-mode:vertical-rl;letter-spacing:.14em;text-transform:uppercase;font-size:10.5px;color:var(--gold)}
.edgetab .n{font-size:11px;color:var(--gold-deep)}
#tab-left{left:0;border-left:none;border-radius:0 5px 5px 0}
#tab-right{right:0;border-right:none;border-radius:5px 0 0 5px}
#tab-right .v{transform:rotate(180deg)}
body.fold-left #tab-left,body.fold-right #tab-right{display:flex}
.foldbtn{margin-left:auto;background:none;border:1px solid transparent;color:var(--gold);font-size:15px;line-height:1;padding:1px 7px;border-radius:3px}
.foldbtn:hover{border-color:var(--gold-deep);color:var(--gold-light)}
#fleet h3{display:flex;align-items:center}
.railfold{align-self:flex-end;margin:-4px 0 -8px;padding:0 8px;font-size:14px}
.rbox h3{display:flex;align-items:center;gap:6px}
.rbox h3 .caret{margin-left:auto;font-size:10px;color:var(--gold-deep);transition:transform .15s}
.rbox.min{flex:none!important;min-height:0!important}
.rbox.min>*:not(h3){display:none!important}
.rbox.min h3{border-bottom:none}
.rbox.min h3 .caret{transform:rotate(-90deg)}
.rbox .wcount{background:var(--coke-red);color:#fff;border-radius:8px;font-size:10px;padding:0 6px;line-height:15px;letter-spacing:0;font-family:inherit}
body.fold-left #shipcard{left:18px}
body.fold-right #planner{right:18px}
body.fold-right #lbfull,body.fold-right #eventlog{right:18px}
/* the top bar tucks into a slim strip: brand · balance · captain · unfold */
#fold-top{padding:4px 9px!important;font-size:12px;flex:none}
#topbar{transition:height .2s}
body.fold-top #topbar{height:30px}
body.fold-top #topbar>*:not(.brand):not(#fold-top):not(#balchip):not(#capbtn){display:none!important}
body.fold-top #topbar .brand{font-size:14px}
body.fold-top #balchip{padding:1px 10px}
body.fold-top #capbtn{padding:2px 9px!important;font-size:12.5px}
body.fold-top #fold-top{margin-left:auto}
body.fold-top #chartwrap{inset:30px 0 0 0}
body.fold-top #fleet,body.fold-top #rail{top:42px}
@media (max-width:760px){#fleet,#rail{width:min(84vw,280px)}}
/* the fleet panel is only as tall as the fleet */
#fleet{bottom:auto!important;max-height:calc(100vh - 90px)}
#fleetlist{overflow-y:auto;min-height:0}


/* ===== v18 screens ===== */
#legal,#codex{top:74px;left:50%;transform:translateX(-50%);width:min(620px,94vw);max-height:82vh;display:none;flex-direction:column}
#legal.open,#codex.open{display:flex}
#legal .body,#codex .body{overflow-y:auto;padding:12px 18px 18px}
.draftbar{background:var(--oxblood);color:#f6dcdc;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;padding:6px 16px;text-align:center}
.legalbody{font-size:14px;line-height:1.6;color:var(--cream-dim)}
.legalbody h4{font-family:'Cinzel',serif;color:var(--gold-light);font-size:15px;margin-bottom:8px;letter-spacing:.06em}
.legalbody p{margin-bottom:9px}.legalbody b{color:var(--gold-light)}
.lgl{padding:2px 9px!important;font-size:12px!important}.lgl.on{background:var(--gold-deep);color:var(--charcoal)}
#report,#pubprof,#records,#fleetmgr,#storm{top:74px;left:50%;transform:translateX(-50%);max-height:82vh;overflow-y:auto}
#report{width:min(400px,94vw)}#pubprof{width:min(400px,94vw)}#records{width:min(520px,94vw)}#fleetmgr{width:min(860px,96vw)}#storm{width:min(430px,94vw)}
#report .body,#pubprof .body,#records .body,#fleetmgr .body,#storm .body{padding:12px 16px 16px}
.cxsearch{width:100%;padding:7px 10px;margin-bottom:10px;background:rgba(236,224,196,.06);border:1px solid var(--gold-deep);border-radius:3px;color:var(--cream);font-family:inherit;font-size:14px}
.gl{padding:7px 0;border-bottom:1px dotted rgba(201,162,75,.2);font-size:13.5px;line-height:1.45;color:var(--cream-dim)}
.gl b{color:var(--gold-light);display:block;font-size:14px}
.cl{font-size:13.5px;color:var(--cream-dim);line-height:1.5;margin-bottom:8px}.cl b{color:var(--gold-light)}
.radios label{display:flex;gap:8px;align-items:flex-start;font-size:14px;padding:4px 0;color:var(--cream-dim);}
.radios input{accent-color:var(--coke-red);margin-top:4px}
#rp-note{width:100%;height:70px;margin:8px 0;background:rgba(236,224,196,.05);border:1px solid var(--gold-deep);color:var(--cream);font-family:inherit;font-size:13.5px;padding:6px 8px;border-radius:3px}
.livery{display:inline-block;width:34px;height:14px;border-radius:2px;vertical-align:middle;margin-right:6px;border:1px solid rgba(0,0,0,.4)}
.wrrow{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px dotted rgba(201,162,75,.2);font-size:13.5px}
.wrrow b{color:var(--gold-light)}.wrrow span{color:var(--cream-dim)}.wrrow .who{color:var(--gold);text-decoration:underline dotted}
.fmt{width:100%;border-collapse:collapse;font-size:13px}
.fmt th{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);text-align:left;padding:4px 6px;border-bottom:1px solid var(--gold-deep);font-weight:400}
.fmt td{padding:6px;border-bottom:1px dotted rgba(201,162,75,.18);color:var(--cream-dim);white-space:nowrap}
.fmt td b{color:var(--gold-light);font-weight:600}.fmt td.n{text-align:right;font-variant-numeric:tabular-nums}
.fmt button{padding:2px 8px;font-size:12px}
.fmt .due{color:var(--coke-red)}
.fmwrap{overflow-x:auto}
.lrow.clk{}.lrow.clk:hover span:nth-child(2){text-decoration:underline dotted}
#consent{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:96;width:min(760px,94vw);display:none;gap:14px;align-items:center;
 background:var(--charcoal-2);border:1px solid var(--gold-deep);border-radius:5px;padding:12px 14px;box-shadow:0 10px 30px rgba(0,0,0,.5)}
#consent.show{display:flex}
#consent .ctext{font-size:13px;color:var(--cream-dim);line-height:1.45;flex:1}
#consent .ctext b{color:var(--gold-light)}#consent a{color:var(--gold);text-decoration:underline}
#consent .cbtns{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
#consent .cbtns .btn{padding:6px 10px;font-size:13px}
@media (max-width:640px){#consent{flex-direction:column;align-items:stretch}}
#netbanner{position:fixed;top:62px;left:50%;transform:translateX(-50%);z-index:92;display:none;background:var(--oxblood);color:#f6dcdc;
 border:1px solid var(--coke-red);border-radius:4px;padding:7px 14px;font-size:13.5px;box-shadow:0 6px 20px rgba(0,0,0,.4)}
#netbanner.show{display:block}
.sysbig{font-family:'Cinzel',serif;font-size:44px;color:var(--gold-light);text-align:center;letter-spacing:.1em}
.book{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:8px 0}
.book h5{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);font-weight:400;margin-bottom:3px}
.book .lv{display:flex;justify-content:space-between;font-size:13px;padding:2px 0;font-variant-numeric:tabular-nums}
.book .bid{color:#9fd49a}.book .ask{color:#e8a7a7}
.orderform{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:13px}
.orderform input,.orderform select{width:84px;background:rgba(236,224,196,.06);border:1px solid var(--gold-deep);border-radius:3px;color:var(--cream);font-family:inherit;padding:4px 6px}
.shrow{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:7px 0;border-bottom:1px dotted rgba(201,162,75,.2);font-size:13px}
.shrow b{color:var(--gold-light)}.shrow span{color:var(--cream-dim)}
.warn.clk{}.warn.clk:hover{background:rgba(201,162,75,.07)}


.tnd .fx{display:block;font-size:10.5px;color:var(--cream-dim);opacity:.85;margin-bottom:3px;line-height:1.25}
.tnd.owned .fx{color:#2b200d}
.tnd.lock{opacity:.62}.tnd.lock .cc{color:#a08a6a}
.tnd.avail{border-color:var(--gold-light);box-shadow:0 0 8px rgba(232,207,138,.35)}
.tnd.avail .cc{color:var(--gold-light);font-weight:600}
#ttdetail .capnote{font-size:11.5px;color:var(--cream-dim);opacity:.8;line-height:1.45;margin-top:6px}
#ttdetail .sysnote{font-size:12.5px;border-left:2px solid var(--gold-deep);padding:4px 8px;margin:6px 0 4px;color:var(--cream-dim)}
#ttdetail .drow2 small{color:var(--gold);font-size:11px;margin-left:4px}
#ttdetail .capt{font-style:normal;font-size:9.5px;border:1px solid var(--coke-red);color:#f0c9c9;border-radius:2px;padding:0 3px;margin-left:4px}
.stat b small{color:var(--gold-deep);font-weight:400;font-size:11px}

#wx-open{position:relative}#wx-open .cnt{position:absolute;top:-5px;right:-5px;background:#8f6a2e;color:#fff;font-size:10px;border-radius:8px;padding:0 5px;line-height:15px}
#wx-open.hot .cnt{background:#c1121f}
.wxo{align-items:center}.wxo small{color:var(--cream-dim);font-size:12px}.wxthreat{color:#f0c9c9!important}
.wxdot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;border:1px solid #241f1b;vertical-align:-1px}
#receipt .wxrow span:first-child{font-size:12.5px;line-height:1.35}

#jobs{top:70px;left:50%;transform:translateX(-50%);width:min(600px,96vw);max-height:84vh;overflow-y:auto}
#jobs .body{padding:10px 14px 14px}
.jb-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.jb-chip{border:1px solid var(--gold-deep);background:none;color:var(--cream-dim);border-radius:14px;padding:4px 12px;font-size:13.5px}
.jb-chip.on{background:var(--gold-deep);color:var(--charcoal);font-weight:600}
.jb-ship{margin-bottom:12px}
.jb-sh{display:flex;align-items:baseline;gap:8px;border-bottom:1px solid rgba(201,162,75,.3);padding:4px 0 6px;margin-bottom:6px}
.jb-sh b{font-family:'Cinzel',serif;color:var(--gold-light);font-size:16px}.jb-sh span{color:var(--cream-dim);font-size:13px;flex:1}
.jb-auto{font-size:13px;color:var(--gold);white-space:nowrap}.jb-auto.off{color:var(--cream-dim);}.jb-auto input{vertical-align:-2px;margin-right:3px}
.jb-card{display:flex;align-items:center;gap:10px;border:1px solid rgba(201,162,75,.28);border-radius:6px;padding:9px 10px;margin-bottom:6px;background:rgba(236,224,196,.03)}
.jb-card:hover{border-color:var(--gold)}
.jb-card.relief{border-color:#c1121f;background:rgba(193,18,31,.08)}
.jb-ic{font-family:'Cinzel',serif;font-size:9.5px;letter-spacing:.08em;width:44px;text-align:center;color:var(--gold-deep);border:1px solid rgba(201,162,75,.35);border-radius:3px;padding:6px 0;line-height:1.1;word-break:break-all}
.jb-mid{flex:1;min-width:0}.jb-rt{font-size:15.5px;color:var(--cream)}.jb-rt b{color:var(--gold-light)}
.jb-sub{font-size:13px;color:var(--cream-dim);margin-top:2px}.jb-sub{color:var(--gold)}.jb-dim{opacity:.25}
.jb-tag{font-size:11px;color:#f0c9c9;border:1px solid #c1121f;border-radius:3px;padding:0 4px;margin-left:4px}
.jb-num{text-align:right;min-width:92px}.jb-pay{font-size:18px;font-weight:700;color:#9fd18a;font-variant-numeric:tabular-nums}.jb-pay.neg{color:#f08a8a}.jb-pay.est{opacity:.55}
.jb-time{font-size:13px;color:var(--cream-dim)}
.jb-go{padding:8px 14px!important;font-size:15px!important}
.jb-empty{font-style:italic;color:var(--cream-dim);font-size:14px;padding:6px 2px}
.jb-foot{font-size:12px;color:var(--gold-deep);font-style:italic;margin-top:6px}
#of-open.jobsbtn{background:var(--gold);color:var(--charcoal);font-weight:700;font-size:15px;padding:7px 16px;border-color:var(--gold-light)}
.fship .fjob{background:var(--gold-deep);color:var(--charcoal);border:none;border-radius:3px;font-size:12px;font-weight:600;padding:2px 8px;margin-right:4px}
.fship .fauto{font-size:12px;margin-right:4px}
#pl-sum{border:1px solid rgba(201,162,75,.35);border-radius:6px;padding:10px 12px;margin-bottom:10px;background:rgba(236,224,196,.04)}
#pl-sum .ps-rt{font-size:16px;color:var(--cream)}#pl-sum .ps-rt b{color:var(--gold-light)}
#pl-sum .ps-row{display:flex;align-items:baseline;justify-content:space-between;margin:4px 0}
#pl-sum .ps-big{font-size:24px;font-weight:700;color:#9fd18a;font-variant-numeric:tabular-nums}#pl-sum .ps-big.neg{color:#f08a8a}
#pl-sum .ps-t{font-size:17px;color:var(--cream)}
#pl-sum .ps-notes{font-size:13px;color:var(--cream-dim)}
#pl-sum .ps-more{background:none;border:none;color:var(--gold);font-size:13px;padding:6px 0 0;text-decoration:underline}
#planner:not(.full) .presets,#planner:not(.full) #pl-stops,#planner:not(.full) #receipt,#planner:not(.full) #escrow,
#planner:not(.full) #escrow+div,#planner:not(.full) .drag-note{display:none!important}
#pl-dispatch{font-size:17px;padding:10px 0}

#rail .wcount.hot{background:var(--coke-red);color:#fff}
#rail .warn{}

.jb-tag.short{border-color:var(--gold-deep);color:var(--gold)}
#jb-fuelmap{color:var(--gold);margin-left:6px}

.jb-foot a{color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(201,162,75,.4);font-size:13.5px}.jb-foot a:hover{color:var(--gold-light)}

input,textarea,select{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Cpath d='M4 2 L11 21 L13.4 13.4 L21 11 Z' fill='%23c9a24b' stroke='%23241f1b' stroke-width='1.4'/%3E%3C/svg%3E") 4 2, text}

/* the first ten minutes */
body.simple #rail,body.simple #compchip,body.simple #lb,body.simple #cr-open,body.simple #spd{display:none!important}
.fogwrap{position:relative}.fogged{filter:blur(4px) brightness(.35) grayscale(.6);pointer-events:none;user-select:none}.foglabel{position:absolute;z-index:3;left:50%;top:60px;transform:translateX(-50%);width:min(520px,90%);text-align:center;font-style:italic;font-size:14px;color:var(--gold-light);background:rgba(20,16,14,.85);border:1px solid var(--gold-deep);border-radius:4px;padding:12px 16px}
.jb-why,.ps-why{font-size:12.5px;font-style:italic;color:var(--gold-deep);margin-top:2px}

/* welcome letter */
#welcome .ovcard{text-align:left}
#welcome .wl-sec h3{font-family:"Cinzel",serif;font-weight:600;font-size:14px;letter-spacing:.06em;color:var(--gold);margin:14px 0 4px}
#welcome .wl-sec p{margin:0 0 8px;line-height:1.5;color:var(--cream)}
#welcome h2{font-family:"Cinzel",serif;color:var(--gold-light);font-weight:600}

#classmenu .cmi.locked{opacity:.38;cursor:not-allowed}
#classmenu .cmi.locked small{font-style:italic}