/* ============================================================
 * 车船联运智能调度系统 —— 深色科技风
 * 适配 1920×1080 (16:9) 大屏全屏展示，数字大、对比强
 * ============================================================ */
:root{
  --bg:#040a17; --bg2:#071226; --panel:rgba(10,25,50,.72); --line:#12345e; --line2:#1c4a7c;
  --cyan:#22d3ee; --cyan2:#67e8f9; --blue:#3b82f6; --green:#34d399; --orange:#fbbf24;
  --red:#f87171; --purple:#a78bfa; --gold:#fde047;
  --txt:#e6f4ff; --dim:#7ea8cc; --dim2:#4a7599;
  --glow-cyan:0 0 18px rgba(34,211,238,.55); --glow-gold:0 0 16px rgba(253,224,71,.45);
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{
  font-family:"Microsoft YaHei","PingFang SC","Segoe UI",Arial,sans-serif;
  background:radial-gradient(1600px 900px at 20% -10%,#0b2547 0%,var(--bg) 55%) fixed,var(--bg);
  color:var(--txt);overflow:hidden;
}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:#1c4a7c;border-radius:4px}
::-webkit-scrollbar-track{background:transparent}
.hidden{display:none!important}
.red{color:var(--red)}

/* ---------------- 通用按钮/表单 ---------------- */
.btn{cursor:pointer;border:1px solid var(--line2);background:linear-gradient(180deg,#123a63,#0b2240);color:var(--txt);
  padding:8px 16px;border-radius:6px;font-size:14px;letter-spacing:1px;transition:.18s}
.btn:hover{border-color:var(--cyan);box-shadow:var(--glow-cyan)}
.btn.primary{background:linear-gradient(180deg,#0ea5c9,#075985);border-color:#22d3ee;color:#fff}
.btn.ok{background:linear-gradient(180deg,#0f766e,#064e3b);border-color:#34d399}
.btn.warn{background:linear-gradient(180deg,#b45309,#7c2d12);border-color:#fbbf24}
.btn.ghost{background:transparent}
.btn.danger{border-color:#ef4444;color:#fca5a5}
.btn.mini{padding:4px 10px;font-size:12px;border-radius:4px}
.btn.big{width:100%;padding:12px;font-size:16px;margin-top:8px}
input,select,textarea{background:#081c36;border:1px solid var(--line2);color:var(--txt);padding:7px 10px;border-radius:5px;font-size:14px;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--cyan);box-shadow:0 0 8px rgba(34,211,238,.35)}
input:disabled{color:var(--dim2)}
input[type=range]{padding:0}
.sel{padding:6px}
.f-row{display:flex;align-items:center;gap:10px;margin:9px 0}
.f-row label{width:130px;color:var(--dim);font-size:13px;flex:none}
.f-row input,.f-row select{flex:1;min-width:0}
.f-row .hint,.hint{color:var(--dim);font-size:12px}
.f-row .best{color:var(--gold);font-size:13px;font-style:normal}
.empty{color:var(--dim2);text-align:center;padding:20px;font-size:13px}
.tag-sub,.tag-man,.tag-plan{font-style:normal;font-size:11px;padding:1px 5px;border-radius:3px;margin-left:5px;vertical-align:1px}
.tag-sub{background:#7c2d12;color:#fdba74}.tag-man{background:#3b0764;color:#d8b4fe}.tag-plan{background:#1e3a5f;color:#93c5fd}

/* ---------------- 页面切换 ---------------- */
.page{display:none;height:100vh}
.page.on{display:block}
.view{display:none;height:100%}
.view.on{display:block}
#main{height:calc(100vh - 56px);overflow:hidden}

/* ---------------- 登录页 ---------------- */
.login-bg{height:100vh;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(1000px 600px at 50% 0%,#0d2a52 0%,#04101f 60%),#040a17}
.login-card{width:460px;padding:44px 46px;border-radius:16px;text-align:center;
  background:linear-gradient(180deg,rgba(10,30,60,.9),rgba(6,18,38,.94));
  border:1px solid var(--line2);box-shadow:0 0 60px rgba(34,211,238,.12),inset 0 0 40px rgba(34,211,238,.04)}
.login-logo{font-size:44px;color:var(--cyan);text-shadow:0 0 24px rgba(34,211,238,.8)}
.login-card h1{font-size:26px;margin:10px 0 4px;letter-spacing:4px}
.login-card h2{font-size:16px;color:var(--cyan2);font-weight:normal;letter-spacing:2px}
.login-sub{color:var(--dim);font-size:12px;margin:10px 0 22px}
.login-form{text-align:left}
.login-form label{display:block;font-size:13px;color:var(--dim);margin:12px 0 6px}
.login-form input{width:100%;font-size:15px;padding:11px}
.login-err{color:var(--red);font-size:12px;min-height:18px;margin-top:8px}
.login-remember{display:flex;align-items:center;gap:6px;color:var(--dim2);font-size:12px;margin:6px 0 10px;cursor:pointer;user-select:none}
.login-remember input{accent-color:#22d3ee}
#sync-badge{font-size:12px;color:var(--dim2);margin-right:2px}
.login-tip{margin-top:18px;color:var(--dim2);font-size:12px;letter-spacing:2px}

/* ---------------- 顶栏 ---------------- */
#topbar{height:56px;display:flex;align-items:center;gap:24px;padding:0 20px;
  background:linear-gradient(180deg,rgba(9,26,52,.95),rgba(6,17,34,.9));border-bottom:1px solid var(--line2)}
.tb-brand{font-size:17px;color:var(--cyan2);letter-spacing:2px;font-weight:bold}
.tb-nav{display:flex;gap:6px}
.tb-nav button{background:transparent;border:1px solid transparent;color:var(--dim);padding:8px 18px;font-size:15px;cursor:pointer;border-radius:6px;transition:.15s}
.tb-nav button:hover{color:var(--txt);border-color:var(--line)}
.tb-nav button.on{color:var(--cyan);border-color:var(--cyan);background:rgba(34,211,238,.08);box-shadow:var(--glow-cyan)}
.tb-right{margin-left:auto;display:flex;align-items:center;gap:12px}
.tb-user{color:var(--cyan2);font-size:14px}

/* ---------------- 大屏舞台（1920×1080 等比缩放） ---------------- */
#page-screen{position:relative}
#stage-wrap{height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}
#stage{width:1920px;height:1080px;flex:none;display:flex;flex-direction:column;
  background:radial-gradient(1400px 700px at 18% -8%,#0c274d 0%,#04101f 58%);padding:14px 20px 0}

/* 顶部标题栏 */
.sc-top{height:76px;display:flex;align-items:center;justify-content:space-between;
  background:linear-gradient(90deg,rgba(15,40,80,.9),rgba(8,22,46,.6) 60%,rgba(15,40,80,.9));
  border:1px solid var(--line2);border-radius:10px;padding:0 26px;margin-bottom:10px}
.sc-title{font-size:34px;font-weight:bold;letter-spacing:3px;color:#fff;text-shadow:0 0 18px rgba(34,211,238,.65)}
.sc-meta{display:flex;align-items:center;gap:20px;font-size:20px}
.badge{padding:4px 14px;border-radius:20px;font-size:18px;border:1px solid}
.badge.b-wd{color:#67e8f9;border-color:#22d3ee;background:rgba(34,211,238,.1)}
.badge.b-hd{color:#fde047;border-color:#facc15;background:rgba(250,204,21,.12)}
.sc-weather{color:var(--dim)}
.sc-date{color:var(--txt)}
.sc-clock{font-family:Consolas,monospace;font-size:34px;color:var(--gold);text-shadow:var(--glow-gold);letter-spacing:2px}

/* 预警横幅 */
.sc-alert{height:0;overflow:hidden;transition:.3s;border-radius:8px;background:rgba(239,68,68,.16);
  border:1px solid #ef4444;color:#fca5a5;display:flex;align-items:center;padding:0 20px;font-size:20px}
.sc-alert:not(.hidden){height:52px;margin-bottom:10px;animation:blink 1.1s infinite}
@keyframes blink{50%{background:rgba(239,68,68,.32)}}

/* 紧急停航警报（海事部门临时通知） */
.sc-alert.emg{font-weight:bold;letter-spacing:1px}
.sc-alert.emg:not(.hidden){animation:emgblink .9s infinite;border-color:#ff5252;color:#ffd7d7;box-shadow:0 0 22px rgba(239,68,68,.5) inset,0 0 14px rgba(239,68,68,.35)}
@keyframes emgblink{0%,100%{background:rgba(239,68,68,.38)}50%{background:rgba(160,20,20,.55)}}
.row-halt td{background:rgba(239,68,68,.2)!important;color:#ffb4b4;font-size:17px;font-weight:bold;letter-spacing:1px;
  border-bottom:1px solid rgba(239,68,68,.6);padding:14px 10px}
.row-halt-ret{opacity:.85}
.ship-card.st-halt{border-color:#ef4444;box-shadow:0 0 14px rgba(239,68,68,.25)}
.ship-card.st-halt .ship-st{color:#fca5a5}
.halt-banner{background:rgba(239,68,68,.16);border:1px solid #ef4444;color:#fca5a5;border-radius:8px;
  padding:9px 12px;font-size:13px;margin:10px 0;line-height:1.7}
.halt-banner b{color:#ffd7d7}
.halt-refund{border-color:rgba(239,68,68,.55)}
.halt-row .red{font-weight:bold}


/* KPI 指标条 */
.sc-kpis{display:flex;gap:12px;margin-bottom:12px}
.kpi{flex:1;height:104px;border:1px solid var(--line2);border-radius:10px;padding:14px 22px;position:relative;overflow:hidden;
  background:linear-gradient(180deg,rgba(16,42,84,.85),rgba(8,22,46,.85))}
.kpi::after{content:"";position:absolute;right:-30px;top:-30px;width:100px;height:100px;border-radius:50%;
  background:radial-gradient(circle,rgba(34,211,238,.25),transparent 70%)}
.kpi span{font-size:17px;color:var(--dim)}
.kpi b{display:block;font-size:46px;font-family:Consolas,"Microsoft YaHei",monospace;color:var(--cyan2);
  line-height:1.15;text-shadow:0 0 14px rgba(34,211,238,.55)}
.kpi i{position:absolute;right:18px;bottom:12px;font-size:15px;color:var(--dim2);font-style:normal}
.kpi .live-tag{position:static;margin-left:6px;font-size:11px;color:var(--cyan2);background:rgba(34,211,238,.15);padding:1px 6px;border-radius:8px;border:1px solid rgba(34,211,238,.4)}
.kpi.warn b{color:#f87171;text-shadow:0 0 16px rgba(248,113,113,.6)}
.kpi.warn{border-color:#ef4444;animation:blink 1.2s infinite}

/* 主体三栏 */
.sc-main{flex:1;display:flex;gap:12px;min-height:0}
.panel{border:1px solid var(--line2);border-radius:10px;padding:14px 16px;
  background:linear-gradient(180deg,rgba(11,32,64,.82),rgba(6,17,36,.86));display:flex;flex-direction:column;min-height:0}
.panel.grow{flex:1}
.p-h{font-size:19px;color:var(--cyan2);letter-spacing:1px;margin-bottom:12px;
  border-left:4px solid var(--cyan);padding-left:10px}

/* 左列 */
.sc-left{width:430px;flex:none;display:flex;flex-direction:column;gap:12px}
.ticket-total{display:flex;align-items:baseline;gap:10px}
.ticket-total b{font-size:62px;color:var(--gold);font-family:Consolas,monospace;text-shadow:var(--glow-gold)}
.ticket-total span{font-size:13px;color:var(--dim);line-height:1.5}
.q-line{margin:10px 0 6px;font-size:17px;color:var(--txt)}
.q-line b{color:var(--cyan2);font-size:26px}
.spark{width:100%;height:56px;margin-top:4px}
.sb-cards{display:flex;flex-wrap:wrap;gap:10px}
.sb-card{width:calc(25% - 8px);min-width:96px;border:1px solid var(--line2);border-radius:8px;padding:8px 10px;background:rgba(8,24,48,.7)}
.sb-name{font-size:16px;color:#fff}.sb-name i{display:block;font-size:12px;color:var(--dim);font-style:normal}
.sb-st{font-size:14px;margin:4px 0;font-weight:bold}
.sb-ex{font-size:12px;color:var(--dim)}
.sb-trips{font-size:12px;color:var(--dim2);margin-top:4px}
.sb-stats{display:flex;margin-top:12px;border-top:1px dashed var(--line);padding-top:10px}
.sb-k{flex:1;text-align:center}
.sb-k b{display:block;font-size:26px;color:var(--cyan2)}
.sb-k span{font-size:13px;color:var(--dim)}

/* 中列 */
.sc-center{flex:1;display:flex;flex-direction:column;gap:12px;min-width:0}
.trips-wrap{flex:1;overflow:auto}
.trips-tbl{width:100%;border-collapse:collapse;font-size:18px}
.trips-tbl th{position:sticky;top:0;background:#0b2447;color:var(--cyan2);font-size:17px;
  padding:10px 8px;border-bottom:1px solid var(--line2);white-space:nowrap;font-weight:bold}
.trips-tbl td{padding:11px 8px;border-bottom:1px solid rgba(18,52,94,.6);white-space:nowrap;text-align:center}
.trips-tbl .c-name{color:#fff;font-weight:bold;font-size:19px;text-align:left}
.trips-tbl .c-dep{color:var(--gold);font-weight:bold;font-size:20px}
.trips-tbl .c-back{color:var(--cyan2);font-weight:bold}
.trips-tbl .c-load{color:#fff;font-weight:bold}
.trips-tbl tr.row-plan td{color:var(--dim)}
.trips-tbl tr.row-stop td{background:rgba(250,204,21,.05)}
.st{padding:3px 12px;border-radius:14px;font-size:16px;border:1px solid;display:inline-block}
.st-idle,.st-done{color:#34d399;border-color:#34d399;background:rgba(52,211,153,.08)}
.st-out{color:#67e8f9;border-color:#22d3ee;background:rgba(34,211,238,.1)}
.st-terminal{color:#fde047;border-color:#facc15;background:rgba(250,204,21,.1)}
.st-ret1,.st-ret2{color:#c4b5fd;border-color:#a78bfa;background:rgba(167,139,250,.1)}
.st-longmen{color:#fdba74;border-color:#fb923c;background:rgba(251,146,60,.12)}
.st-buffer{color:#94a3b8;border-color:#64748b;background:rgba(100,116,139,.12)}
.st-plan{color:var(--dim2);border-color:var(--line2)}
.st-ready{color:#34d399;border-color:#34d399;animation:blink 1s infinite}
.st-wait{color:#f87171;border-color:#ef4444}
tr.glow-now{animation:rowGlow 1.6s infinite}
tr.glow-soon{animation:rowGlow 2.2s infinite}
@keyframes rowGlow{0%,100%{background:rgba(34,211,238,.04)}50%{background:rgba(34,211,238,.2)}}

/* 船舶总览卡片行 */
.ships-row{display:flex;gap:10px}
.ship-card{flex:1;min-width:0;border:1px solid var(--line2);border-radius:9px;padding:10px 12px;cursor:pointer;transition:.15s;
  background:rgba(8,24,48,.75)}
.ship-card:hover{transform:translateY(-3px);box-shadow:var(--glow-cyan)}
.ship-card.st-idle{border-color:#34d399;box-shadow:0 0 12px rgba(52,211,153,.25)}
.ship-card.st-out{border-color:#22d3ee;box-shadow:0 0 12px rgba(34,211,238,.3)}
.ship-card.st-terminal,.ship-card.st-term{border-color:#facc15;box-shadow:0 0 12px rgba(250,204,21,.3)}
.ship-card.st-ret{border-color:#a78bfa;box-shadow:0 0 12px rgba(167,139,250,.3)}
.ship-card.st-stop{border-color:#fb923c}
.ship-card.st-buf{border-color:#64748b}
.ship-top{display:flex;justify-content:space-between;align-items:baseline}
.ship-name{font-size:22px;font-weight:bold;color:#fff}
.ship-type{font-size:14px;color:var(--dim)}
.ship-st{font-size:17px;font-weight:bold;margin:5px 0}
.st-idle .ship-st{color:#34d399}.st-out .ship-st{color:#67e8f9}.st-terminal .ship-st,.st-term .ship-st{color:#fde047}
.st-ret .ship-st{color:#c4b5fd}.st-stop .ship-st{color:#fdba74}.st-buf .ship-st{color:#94a3b8}
.ship-extra{font-size:13px;color:var(--dim)}
.ship-foot{display:flex;gap:10px;margin-top:6px;font-size:13px;color:var(--dim2)}

/* 底部滚动条 */
.sc-ticker{height:46px;margin:12px -20px 0;border-top:1px solid var(--line2);display:flex;align-items:center;
  background:linear-gradient(90deg,rgba(13,36,70,.95),rgba(6,17,36,.95));overflow:hidden;padding:0 18px}
.tk-label{font-size:20px;margin-right:14px}
.ticker-in{white-space:nowrap;font-size:19px;color:#93e6ff;overflow:hidden}
.ticker-in.run{animation:marq 60s linear infinite}
@keyframes marq{0%{transform:translateX(100vw)}100%{transform:translateX(-100%)}}

/* ---------------- 大屏侧滑模拟器 ---------------- */
#drawer{position:absolute;top:56px;right:0;bottom:0;width:340px;transform:translateX(100%);transition:.25s;z-index:50;
  background:linear-gradient(180deg,rgba(8,24,50,.97),rgba(4,12,28,.98));border-left:1px solid var(--line2);padding:18px}
#drawer.on{transform:translateX(0)}
.dr-h{display:flex;justify-content:space-between;font-size:17px;color:var(--cyan2);margin-bottom:16px}
.dr-h span{cursor:pointer;color:var(--dim)}
.dr-body{display:flex;flex-direction:column;gap:12px}
.dr-row{display:flex;gap:8px;align-items:center}
.dr-now{color:var(--gold);font-family:Consolas,monospace}
.dr-tip{color:var(--dim2);font-size:12px;border-top:1px dashed var(--line);padding-top:10px}

/* ---------------- 控制台/后台通用 ---------------- */
#page-console,#page-admin{padding:16px 20px;overflow:auto;height:100%}
.cgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:16px;align-items:start}
.cpanel{border:1px solid var(--line2);border-radius:10px;padding:16px;background:linear-gradient(180deg,rgba(11,32,64,.85),rgba(6,17,36,.9))}
.cpanel-h{font-size:16px;color:var(--cyan2);border-left:4px solid var(--cyan);padding-left:10px;margin-bottom:12px}
.c-row{display:flex;align-items:center;gap:10px;margin:10px 0;flex-wrap:wrap}
.c-row label{color:var(--dim);font-size:13px}
.sim-now b{color:var(--gold);font-family:Consolas,monospace;font-size:18px}
.idle-wrap{display:flex;flex-wrap:wrap;gap:10px;min-height:80px}
.idle-wrap .ship-card{flex:1 1 30%}
.dropzone{margin-top:12px;border:2px dashed #22d3ee;border-radius:10px;padding:22px;text-align:center;color:var(--cyan2);
  background:rgba(34,211,238,.05);font-size:15px}
.dropzone:hover{background:rgba(34,211,238,.15)}
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{color:var(--cyan2);border-bottom:1px solid var(--line2);padding:8px;text-align:left;white-space:nowrap}
.tbl td{border-bottom:1px solid rgba(18,52,94,.5);padding:8px;vertical-align:middle}
.tbl td input,.tbl td select{padding:5px 8px;font-size:13px;width:100%}
.tbl tr.sum td{color:var(--gold);font-weight:bold;background:rgba(250,204,21,.06)}
.tbl .c-load{color:#fff;font-weight:bold}
.logbox{max-height:300px;overflow:auto;font-size:13px;color:var(--dim);line-height:1.9}
.logbox span{color:var(--cyan2);font-family:Consolas,monospace;margin-right:6px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:16px;align-items:start}
.sb-wrap{display:flex;gap:10px;flex-wrap:wrap}
.sb-wrap .sb-card{width:calc(20% - 8px);min-width:130px}
.sb-line{margin-top:12px;color:var(--dim);font-size:13px}
.stat-cards{display:flex;gap:12px;margin:14px 0;flex-wrap:wrap}
.s-card{flex:1;min-width:130px;border:1px solid var(--line2);border-radius:8px;padding:12px;text-align:center;background:rgba(8,24,48,.7)}
.s-card b{display:block;font-size:26px;color:var(--cyan2)}
.s-card span{font-size:13px;color:var(--dim)}
.s-card.hot b{color:var(--gold)}
.tt-mini{display:flex;flex-wrap:wrap;gap:8px;color:var(--dim);font-size:13px;line-height:2}
.tt-mini span{background:rgba(34,211,238,.07);border:1px solid var(--line);padding:2px 8px;border-radius:4px}
.note-cell{max-width:260px;white-space:normal;font-size:12px;color:var(--dim)}

/* 后台页签 */
.atabs{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.atabs button{background:transparent;border:1px solid var(--line2);color:var(--dim);padding:8px 18px;font-size:14px;cursor:pointer;border-radius:6px}
.atabs button.on{color:var(--cyan);border-color:var(--cyan);background:rgba(34,211,238,.08)}
.rpt-box{margin-top:14px}
.rpt-box h3{color:var(--cyan2);margin:10px 0 6px}
.rpt-note{margin-top:16px;border-top:1px dashed var(--line);padding-top:12px}
.rpt-note label{display:block;color:var(--dim);font-size:13px;margin-bottom:8px}
.rpt-note textarea{width:100%;background:#081c36;border:1px solid var(--line2);color:var(--txt);padding:10px;border-radius:6px;font-size:14px}
.rpt-note .btn{margin-top:8px}

/* ---------------- 弹窗 ---------------- */
#modal-root{position:fixed;inset:0;z-index:200;display:none}
#modal-root.on{display:block}
.modal-mask{position:absolute;inset:0;background:rgba(2,8,20,.72);backdrop-filter:blur(3px)}
.modal{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);min-width:520px;max-width:90vw;max-height:86vh;overflow:auto;
  background:linear-gradient(180deg,#0c2748,#071629);border:1px solid var(--line2);border-radius:12px;box-shadow:0 0 50px rgba(34,211,238,.25)}
.modal.wide{min-width:760px}
.modal-h{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;font-size:17px;color:var(--cyan2);
  border-bottom:1px solid var(--line);position:sticky;top:0;background:#0c2748}
.modal-x{cursor:pointer;color:var(--dim)}
.modal-b{padding:16px 20px}
.modal-f{padding:12px 20px;display:flex;justify-content:flex-end;gap:10px;border-top:1px solid var(--line)}

/* ---------------- Toast ---------------- */
#toast{position:fixed;top:70px;left:50%;transform:translate(-50%,-16px);opacity:0;pointer-events:none;z-index:300;
  background:rgba(8,32,60,.96);border:1px solid var(--cyan);color:var(--cyan2);padding:10px 24px;border-radius:8px;
  font-size:14px;box-shadow:var(--glow-cyan);transition:.25s}
#toast.on{opacity:1;transform:translate(-50%,0)}

/* ---------------- 船员员工池管理 ---------------- */
.btn.tiny{padding:2px 7px;font-size:11px;border-radius:4px}
.btn.tiny.on{color:var(--cyan);border-color:var(--cyan);background:rgba(34,211,238,.15)}
.crew-ships{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.crew-ships.sbrow{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));margin-top:10px}
.crew-ship{border:1px solid var(--line2);border-radius:9px;padding:10px 12px;background:rgba(8,24,48,.75);transition:.15s}
.crew-ship.dragover{border-color:var(--cyan);box-shadow:var(--glow-cyan);background:rgba(34,211,238,.12)}
.crew-ship.locked{opacity:.72;border-style:dashed;cursor:not-allowed}
.crew-ship.sb{min-height:86px}
.cs-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cs-head b{color:#fff;font-size:16px}
.cs-head span{color:var(--dim);font-size:12px}
.cs-lock{font-style:normal;color:var(--gold);font-size:12px}
.cs-crew{margin-top:8px;display:flex;flex-wrap:wrap;gap:6px;min-height:26px}
.crew-tag{display:inline-flex;align-items:center;gap:4px;background:rgba(34,211,238,.1);border:1px solid var(--line2);
  border-radius:12px;padding:2px 9px;font-size:12px;color:var(--txt);cursor:pointer;transition:.15s}
.crew-tag:hover{border-color:var(--red);color:#fca5a5}
.crew-tag em{font-style:normal;color:var(--dim2);font-size:11px}
.crew-ship.locked .crew-tag{cursor:not-allowed;opacity:.8}
.crew-pool{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:10px}
.crew-card{border:1px solid var(--line2);border-radius:9px;padding:10px 12px;background:rgba(8,24,48,.75);cursor:grab;transition:.15s}
.crew-card:hover{border-color:var(--cyan);transform:translateY(-2px)}
.crew-card:active{cursor:grabbing}
.crew-card.locked{opacity:.72;cursor:not-allowed;border-style:dashed}
.cc-top{display:flex;justify-content:space-between;align-items:center}
.cc-top b{color:#fff;font-size:16px}
.cc-chip{font-size:11px;padding:1px 8px;border-radius:10px;border:1px solid}
.chip-work{color:#34d399;border-color:#34d399;background:rgba(52,211,153,.1)}
.chip-rest{color:#94a3b8;border-color:#64748b;background:rgba(100,116,139,.12)}
.chip-ot{color:#fbbf24;border-color:#fbbf24;background:rgba(251,191,36,.1)}
.chip-leave{color:#f87171;border-color:#f87171;background:rgba(248,113,113,.1)}
.chip-sub{color:#a78bfa;border-color:#a78bfa;background:rgba(167,139,250,.1)}
.cc-role{color:var(--dim);font-size:12px;margin:5px 0 7px}
.cc-btns{display:flex;gap:4px;flex-wrap:wrap}

/* ---------------- 登船检票高亮（大屏班次表） ---------------- */
.st-board{color:#f0abfc;border-color:#e879f9;background:rgba(232,121,249,.14)}
tr.row-board td{background:rgba(232,121,249,.14);border-top:2px solid #e879f9;border-bottom:2px solid #e879f9}
tr.row-board .c-name::before{content:"⚓ ";color:#e879f9}
tr.row-board{animation:boardGlow 1.4s infinite}
@keyframes boardGlow{0%,100%{box-shadow:inset 0 0 0 rgba(232,121,249,0)}50%{box-shadow:inset 0 0 40px rgba(232,121,249,.22)}}
.ship-card.st-board{border-color:#e879f9;box-shadow:0 0 16px rgba(232,121,249,.4)}
.ship-card.st-board .ship-st{color:#f0abfc}

@media (max-width:900px){
  .cgrid,.grid2{grid-template-columns:1fr}
  .tb-nav button{padding:6px 10px;font-size:13px}
  .tb-brand{font-size:14px}
}

/* ================= 电子票（一票一码）================= */
.tk-cards{display:flex;flex-wrap:wrap;gap:12px;max-width:640px;max-height:52vh;overflow:auto}
.tk-card{display:flex;gap:10px;align-items:center;border:1px solid #cbd7e6;border-radius:10px;padding:10px;background:#fff;color:#0b2545}
.tk-qr svg{width:116px;height:116px;display:block}
.tk-meta{display:flex;flex-direction:column;gap:3px;font-size:13px;color:#41586f}
.tk-meta b{font-size:15px;color:#0b2545}
.tk-meta .mono{font-family:Consolas,monospace;font-size:12px;letter-spacing:.5px;color:#5a3110;font-weight:600}
.mono{font-family:Consolas,monospace}
#tk-res{border:1px solid transparent}