.tabs{ display:inline-flex; gap:4px; background:rgba(14,117,104,.08); border:1px solid var(--line);
       border-radius:100px; padding:5px; margin:26px 0 34px }
.tabs button{ font-family:'Archivo',sans-serif; border:none; background:transparent; color:var(--muted);
              font-size:13.5px; font-weight:600; border-radius:100px; padding:10px 22px; cursor:pointer;
              transition:background .25s ease, color .25s ease }
.tabs button.on{ background:var(--teal); color:#fff }
.panel{ display:none }
.panel.on{ display:block; animation:panelIn .35s ease }
@keyframes panelIn{ from{opacity:0; transform:translateY(10px)} to{opacity:1; transform:none} }
.dgrid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px }
.dcard{ padding:28px }
.dcard .dh{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px }
.dcard .dh .t{ font-weight:700; font-size:16px }
.badge{ display:inline-block; background:rgba(14,117,104,.12); color:var(--teal); font-size:11px; font-weight:700;
        letter-spacing:.08em; text-transform:uppercase; border-radius:100px; padding:5px 12px }
.badge.warn{ background:rgba(242,196,106,.3); color:#8a6d1f }
.ship .big{ font-family:'Instrument Serif',serif; font-size:32px; margin-bottom:6px; transition:opacity .25s ease }
.ship .ds{ font-size:14px; color:var(--muted); line-height:1.6 }
.actrow{ display:flex; gap:10px; margin-top:18px; flex-wrap:wrap }
.actrow .pill{ padding:11px 20px; font-size:13px }
.pre-auth{ visibility:hidden }
.refcopy{ font-size:14px; color:var(--muted); line-height:1.65 }
.refcopy b{ color:var(--teal) }
.pwset{ display:flex; gap:10px; margin:14px 0 4px; flex-wrap:wrap }
.pwset input{ flex:1; min-width:180px; border:1px solid rgba(14,117,104,.3); background:rgba(255,255,255,.85);
              padding:11px 14px; font-family:'Archivo',sans-serif; font-size:14px; border-radius:12px; color:var(--ink) }
.pwset input:focus{ outline:2px solid rgba(14,117,104,.35) }
.pwmsg{ display:none; font-size:12.5px; margin:6px 0 2px }
.pwmsg.on{ display:block }
.pwmsg.ok{ color:#0e5c52 }
.pwmsg.err{ color:#a63d28 }
.paused-badge{ display:none }
.dcard.paused .paused-badge{ display:inline-block }
.dcard.paused .big, .dcard.paused .ds, .dcard.paused .ring-wrap{ opacity:.4 }
.ring-wrap{ display:flex; align-items:center; gap:12px; margin-top:18px; transition:opacity .3s }
.ring{ width:64px; height:64px; transform:rotate(-90deg) }
.ring .bg{ fill:none; stroke:rgba(14,117,104,.15); stroke-width:6 }
.ring .fg{ fill:none; stroke:var(--teal); stroke-width:6; stroke-linecap:round;
           stroke-dasharray:163.4; stroke-dashoffset:98 }
.ring-lab{ font-size:12px; color:var(--muted); line-height:1.5 }
.ring-lab b{ color:var(--ink) }
.kv{ display:flex; justify-content:space-between; font-size:14px; padding:10px 0; border-bottom:1px solid rgba(14,117,104,.12) }
.kv:last-child{ border-bottom:none }
.kv .k{ color:var(--muted) }
.kv .v{ font-weight:600 }
.tog{ display:flex; justify-content:space-between; align-items:center; gap:14px; padding:12px 0; border-bottom:1px solid rgba(14,117,104,.12) }
.tog:last-child{ border-bottom:none }
.tog .t{ font-size:14px }
.tog .t small{ display:block; color:var(--faint); font-size:12px; margin-top:2px }
.sw{ flex:none; width:42px; height:24px; border-radius:100px; background:rgba(14,117,104,.2); position:relative; cursor:pointer; transition:background .2s }
.sw::after{ content:''; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; transition:left .2s }
.sw.on{ background:var(--teal) }
.sw.on::after{ left:21px }
.orow{ border:1px solid var(--line); border-radius:18px; background:rgba(255,255,255,.6); margin-bottom:12px; overflow:hidden }
.ohead{ display:flex; align-items:center; gap:16px; width:100%; text-align:left; background:none; border:none;
        font-family:'Archivo',sans-serif; padding:18px 22px; cursor:pointer; color:var(--ink) }
.ohead .od{ font-family:ui-monospace,monospace; font-size:12px; color:var(--muted); width:92px; flex:none }
.ohead .onm{ font-weight:700; font-size:14.5px; flex:1 }
.ohead .ot{ font-weight:600; font-size:14px }
.st{ display:inline-block; font-size:11px; font-weight:700; letter-spacing:.06em; border-radius:100px; padding:4px 11px;
     background:rgba(14,117,104,.12); color:var(--teal) }
.ochev{ color:var(--teal); transition:transform .3s ease }
.orow.open .ochev{ transform:rotate(180deg) }
.obody{ max-height:0; overflow:hidden; transition:max-height .45s cubic-bezier(.22,.8,.3,1) }
.orow.open .obody{ max-height:340px }
.oitems{ padding:4px 22px 0 }
.oi{ display:flex; gap:14px; align-items:center; padding:10px 0 }
.oth{ flex:none; width:52px; height:52px; border-radius:10px; background:linear-gradient(165deg,#ffffff,#e2f1ee);
      display:flex; align-items:center; justify-content:center }
.oth img{ max-height:80% }
.oin{ font-weight:700; font-size:13.5px }
.ois{ font-size:12px; color:var(--muted) }
.trk{ display:flex; align-items:center; gap:10px; padding:14px 22px; flex-wrap:wrap }
.tstep{ display:flex; align-items:center; gap:8px; font-size:12px; font-weight:600; color:var(--faint) }
.tstep i{ width:12px; height:12px; border-radius:50%; border:2px solid rgba(14,117,104,.3); background:transparent }
.tstep.done{ color:var(--ink) }
.tstep.done i{ background:var(--teal); border-color:var(--teal) }
.tbar{ flex:1; min-width:24px; height:2px; background:rgba(14,117,104,.15) }
.tbar.done{ background:var(--teal) }
.oact{ display:flex; align-items:center; gap:18px; padding:6px 22px 20px }
.oact .pill{ padding:10px 20px; font-size:12.5px }
.sheet-ov{ position:fixed; inset:0; z-index:150; background:rgba(7,13,12,.55); display:flex; align-items:center;
           justify-content:center; padding:22px; opacity:0; pointer-events:none; transition:opacity .25s ease }
.sheet-ov.on{ opacity:1; pointer-events:auto }
.sheet{ width:min(430px,100%); background:var(--paper-hi); border:1px solid var(--line); border-radius:22px;
        padding:32px 34px; transform:translateY(16px); transition:transform .3s cubic-bezier(.22,.8,.3,1) }
.sheet-ov.on .sheet{ transform:none }
.sheet .sh{ font-family:'Instrument Serif',serif; font-size:26px; margin-bottom:10px }
.sheet p{ font-size:14px; line-height:1.65; color:var(--muted); margin:0 0 24px }
.sheet .row{ display:flex; gap:12px }
.sheet .row .pill{ flex:1; padding:13px 10px; font-size:13.5px }
.dem{ font-family:ui-monospace,monospace; font-size:11px; color:var(--faint); margin-top:22px }
@media (max-width:980px){ .dgrid{ grid-template-columns:1fr } .ohead .od{ width:auto } }
.calrow{ display:grid; grid-template-columns:1fr 1fr; gap:24px }
.cal{ text-align:center }
.cal .cm{ font-weight:700; font-size:13.5px; margin-bottom:10px }
.cal table{ width:100%; border-collapse:collapse; font-size:11.5px }
.cal th{ color:var(--faint); font-weight:600; padding:4px 0; font-size:10px; letter-spacing:.06em }
.cal td{ padding:5px 0; color:var(--muted); position:relative }
.cal td.mark{ color:#fff; font-weight:700 }
.cal td.mark::before{ content:''; position:absolute; inset:1px 50% 1px 50%; width:24px; height:24px;
  margin-left:-12px; top:50%; margin-top:-12px; border-radius:50%; background:var(--teal); z-index:-1 }
.cal td{ z-index:0 }
.cal-leg{ display:flex; justify-content:center; gap:8px; align-items:center; font-size:11.5px; color:var(--faint); margin-top:12px }
.cal-leg i{ width:9px; height:9px; border-radius:50%; background:var(--teal) }
.reflink{ display:flex; gap:10px; margin-top:16px }
.reflink input{ flex:1; border:1px solid rgba(14,117,104,.3); border-radius:100px; padding:11px 16px;
  font-family:ui-monospace,monospace; font-size:12.5px; background:rgba(255,255,255,.85); color:var(--ink) }
.reflink button{ border:none; background:var(--teal); color:#fff; font-weight:700; font-size:13px;
  border-radius:100px; padding:0 20px; cursor:pointer; font-family:'Archivo',sans-serif; transition:background .2s }
.reflink button.did{ background:var(--ink) }
.refnote{ font-size:12px; color:var(--faint); margin-top:12px }
.invites{ display:flex; gap:8px; margin-top:6px }
.invites .badge{ font-size:12px; text-transform:none; letter-spacing:0 }
@media (max-width:640px){ .calrow{ grid-template-columns:1fr } }