:root{
  --bg:#04070d; --card:#080e19; --card2:#0b1421; --line:#101d2e;
  --teal:#2fe3cf; --teal-dim:rgba(47,227,207,.16);
  --gold:#ffb454; --red:#ff6b6b; --blue:#5ba8ff; --violet:#a98bff; --green:#7ee787;
  --text:#e9f2f9; --muted:#5f7488; --muted2:#93a9bd; --r:14px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;background:#000;color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  font-variant-numeric:tabular-nums}
/* 关掉 WebView / 浏览器的原生下拉刷新与滚动链，交给页面里的手势自己处理 */
html{overscroll-behavior:none}
body{display:flex;justify-content:center;min-height:100vh;overscroll-behavior-y:none}
/* 弹出面板时锁住底层页面：否则在面板里上下滑动会把下面的页面一起拖动 */
html.sheet-lock,html.sheet-lock body{overflow:hidden;height:100%}
.app{width:100%;max-width:430px;min-height:100vh;
  background:radial-gradient(120% 60% at 50% -10%,#0a1a2a 0%,var(--bg) 55%);
  padding:0 12px calc(78px + env(safe-area-inset-bottom));
  position:relative;overflow-x:clip}

/* header：用 sticky 钉在视口顶部（.app 用 overflow-x:clip 而不是 hidden，否则会被当成滚动容器、sticky 失效） */
.top{display:grid;grid-template-columns:34px 1fr 34px;align-items:center;gap:6px;
  position:sticky;top:0;z-index:16;margin:0 -12px;
  padding:calc(10px + env(safe-area-inset-top)) 12px 8px;
  background:rgba(5,9,16,.94);backdrop-filter:blur(12px);border-bottom:1px solid rgba(16,29,46,.85)}
.icon-btn{width:34px;height:34px;border:0;border-radius:50%;background:transparent;color:var(--muted2);
  font-size:20px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer}
.icon-btn:active{background:#0e1a29}
.titles{text-align:center;min-width:0}
.titles h1{margin:0;font-size:17px;font-weight:600;letter-spacing:.5px}
.station{margin-top:3px;font-size:12px;color:var(--muted);display:inline-flex;align-items:center;gap:4px;max-width:100%;
  background:none;border:0;cursor:pointer;font-family:inherit}
.station b{color:var(--muted2);font-weight:500;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.station .cv{font-size:9px;opacity:.8}
/* 当前钓点：单选站点之外的第二行信息，别把站名撑成一长串 */
.spot-line{margin-top:2px;font-size:11px;color:var(--teal);opacity:.9;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.spot-line[hidden]{display:none}

/* hero */
.hero{background:linear-gradient(160deg,#0a1524,#070d17 60%);border:1px solid var(--line);
  border-radius:var(--r);padding:14px 14px 12px;position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;inset:-40% -30% auto auto;width:210px;height:210px;
  background:radial-gradient(circle,rgba(47,227,207,.16),transparent 62%)}
.hero-top{display:flex;align-items:flex-start;gap:12px;position:relative}
.ring{position:relative;width:96px;height:96px;flex:0 0 96px}
.ring svg{transform:rotate(-90deg)}
.ring .val{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.ring .val b{font-size:26px;line-height:1;letter-spacing:-.5px}
.ring .val b i{font-size:13px;font-style:normal;color:var(--muted2);margin-left:1px}
.ring .val span{font-size:9px;color:var(--muted);margin-top:3px;letter-spacing:1px}
.hero-info{min-width:0;flex:1}
.hero-info .k{font-size:11px;color:var(--muted);letter-spacing:1px}
.hero-info .best{font-size:20px;font-weight:600;margin:2px 0 4px}
.hero-info .best em{font-style:normal;color:var(--teal)}
.badge{display:inline-block;font-size:10px;padding:2px 7px;border-radius:99px;border:1px solid var(--teal);
  color:var(--teal);background:var(--teal-dim)}
.hero-note{margin-top:8px;font-size:11px;color:var(--muted);line-height:1.55;position:relative}
.hero-note b{color:var(--muted2);font-weight:600}
/* 转流时刻：固定位置（与站点无关）；整条可点，进去是完整潮汐表 */
.turn-line{display:flex;flex-direction:column;gap:5px;width:100%;margin:10px 0 0;padding:8px 10px;
  background:#07131d;border:1px solid #1b3d47;border-radius:10px;cursor:pointer;font-family:inherit;
  text-align:left;position:relative;z-index:1}
.turn-line:active{background:#0a1c26;border-color:var(--teal)}
.turn-line .tl-row{display:flex;align-items:center;gap:6px;min-width:0}
.turn-line .tl-k{font-size:10px;color:var(--teal);letter-spacing:.5px;flex:0 0 auto}
.turn-line .tl-list{display:flex;gap:4px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap}
.turn-line .tl-list::-webkit-scrollbar{display:none}
.turn-line .tl-t{flex:0 0 auto;font-size:12px;font-weight:600;color:var(--text);background:#0c1c28;
  border:1px solid #17384a;border-radius:7px;padding:0 4px;white-space:nowrap}
.turn-line .tl-t i{font-style:normal;font-size:9.5px;margin-left:1px;color:var(--teal)}
.turn-line .tl-t.down i{color:var(--gold)}
.turn-line .tl-t.next{border-color:var(--teal);box-shadow:0 0 0 1px rgba(47,227,207,.25) inset}
/* 第二行提示：说明这一条是什么、点开是什么（用户提议） */
.turn-line .tl-hint{font-size:10.5px;color:var(--muted);line-height:1.3}
.turn-line .tl-none{font-size:11.5px;color:var(--muted)}
.reasons{margin-top:10px;border-top:1px dashed var(--line);padding-top:9px;display:grid;gap:6px;position:relative}
.reason{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted2)}
.reason .dot{width:6px;height:6px;border-radius:50%;flex:0 0 6px}
.reason .txt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.reason .num{font-size:12px;font-weight:600}
.reason.pos .dot{background:var(--teal)} .reason.pos .num{color:var(--teal)}
.reason.neg .dot{background:var(--red);opacity:.85} .reason.neg .num{color:var(--red)}
.reason.mid .dot{background:var(--gold)} .reason.mid .num{color:var(--gold)}
.reason .bar{flex:0 0 42px;width:42px;height:3px;border-radius:2px;background:#132133;overflow:hidden}
.reason .bar i{display:block;height:100%}
.reason.pos .bar i{background:var(--teal)} .reason.mid .bar i{background:var(--gold)} .reason.neg .bar i{background:var(--red)}
.more{display:none}
.hero.open .more{display:grid}
.toggle{margin-top:9px;font-size:11px;color:var(--muted);text-align:center;cursor:pointer;user-select:none;position:relative}

/* week */
/* 日期条 + 左端「历史」：历史是时间轴的前半段，所以钉在「今天」左边 */
.week-row{display:flex;gap:4px;margin-top:10px;align-items:stretch}
.week{display:flex;gap:4px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none;flex:1;min-width:0}
.week::-webkit-scrollbar{display:none}
.hist-entry{flex:0 0 42px;background:transparent;border:1px dashed #22384f;border-radius:10px;
  color:var(--muted2);cursor:pointer;font-family:inherit;padding:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}
.hist-entry b{font-size:17px;line-height:1;font-weight:400}
.hist-entry small{font-size:9px;color:var(--muted);letter-spacing:.5px}
.hist-entry:active{background:#0e1a29;border-color:var(--teal)}
.dchip{flex:0 0 48px;background:var(--card);border:1px solid var(--line);border-radius:10px;
  padding:7px 6px 8px;text-align:center;cursor:pointer;transition:.15s}
.dchip.sel{border-color:var(--teal);background:#0a1a22;box-shadow:0 0 0 1px rgba(47,227,207,.25) inset}
.dchip .dw{font-size:10px;color:var(--muted)}
.dchip .dd{font-size:13px;font-weight:600;margin:1px 0 2px}
/* 天气图标：和手机天气一样，一眼看出晴雨 */
.dchip .wx{font-size:13px;line-height:1;margin:0 0 3px;font-family:"Apple Color Emoji","Noto Color Emoji","Segoe UI Emoji",sans-serif}
.dchip .pct{font-size:15px;font-weight:700}
.dchip .pct i{font-size:9px;font-style:normal;color:var(--muted2)}
.dchip .bar{height:3px;border-radius:2px;background:#132133;margin-top:5px;overflow:hidden}
.dchip .bar span{display:block;height:100%;background:linear-gradient(90deg,var(--teal),#4ef0d8)}
.dchip.nogo{border-color:#3a1f22;background:#140d10}
.dchip.nogo .pct{color:var(--red);font-size:12px}
/* 过去的日期（ERA5 归档重算）：和预报日区分开，一眼看出这是"回看" */
.dchip.past{background:#080f18;border-style:dashed}
.dchip.past .dw{color:#4a6178}
.dchip.past.sel{border-color:var(--gold);background:#171208;box-shadow:0 0 0 1px rgba(255,180,84,.25) inset;border-style:solid}
.dchip.past.sel .pct{color:var(--gold)}

/* stats */
.stats{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:9px;
  padding:5px 8px;font-size:10.5px;color:var(--muted);display:flex;gap:4px;align-items:baseline;white-space:nowrap}
.stat b{color:var(--text);font-weight:600;font-size:11.5px}
.stat.warn b{color:var(--gold)} .stat.bad b{color:var(--red)}

/* readout */
.readout{display:flex;gap:10px;margin-top:10px;background:#0a1421;border:1px solid var(--line);
  border-radius:11px;font-size:11px;overflow-x:auto;scrollbar-width:none;opacity:0;height:0;border-width:0;transition:.18s}
.readout.on{opacity:1;height:auto;padding:8px 10px;border-width:1px}
.readout::-webkit-scrollbar{display:none}
.readout .t{color:var(--teal);font-weight:700;flex:0 0 auto}
.readout .kv{flex:0 0 auto;color:var(--muted);white-space:nowrap}
.readout .kv b{color:var(--text)}

/* cards */
.cards{margin-top:11px;display:grid;gap:9px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:10px 11px 7px}
.card-head{display:flex;align-items:baseline;gap:8px;margin-bottom:2px}
.card-head .lb{font-size:12.5px;color:#cfe0ee;font-weight:600;letter-spacing:.4px}
.card-head .lb:before{content:"";display:inline-block;width:12px;height:2px;border-radius:2px;
  background:var(--teal);vertical-align:middle;margin-right:6px;transform:translateY(-2px)}
.card-head .sub{font-size:10px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card-head .val{margin-left:auto;font-size:14px;font-weight:700;white-space:nowrap}
.card-head .val i{font-size:10px;font-style:normal;color:var(--muted2);font-weight:500;margin-left:2px}
canvas{display:block;width:100%;touch-action:pan-y}
.c-main{height:92px} .c-strip{height:54px}
.axis{display:flex;justify-content:space-between;font-size:9px;color:#42566b;margin-top:-2px}
.legend{display:flex;gap:12px;font-size:10px;color:var(--muted);margin-top:4px}
.legend .li{display:flex;align-items:center;gap:4px}
.legend .sw{width:10px;height:2px;border-radius:2px}

.hint{text-align:center;font-size:10.5px;color:var(--muted);margin:11px 0 4px}
.note{font-size:10px;color:#42566b;text-align:center;margin-top:6px;line-height:1.6}
#diag,#diagErr{display:none}

/* acts */
.acts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:11px}
.act{background:var(--card2);border:1px solid var(--line);border-radius:12px;padding:11px 12px;
  display:flex;align-items:center;gap:9px;cursor:pointer}
.act .ic{width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  font-size:14px;background:#0f1e2e}
.act .tx{font-size:12.5px;font-weight:600}
.act .tx small{display:block;font-weight:400;color:var(--muted);font-size:10px;margin-top:2px}
.act.primary .ic{background:rgba(47,227,207,.14)}

/* tabbar：脱离文档流，固定在视口底部（不随内容滚动） */
.tabbar{position:fixed;left:50%;transform:translateX(-50%);
  width:min(406px,calc(100% - 24px));bottom:calc(10px + env(safe-area-inset-bottom));
  background:rgba(9,16,26,.92);backdrop-filter:blur(14px);border:1px solid var(--line);
  border-radius:16px;display:grid;grid-template-columns:repeat(4,1fr);padding:7px 2px;z-index:15}
.tab{display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--muted);font-size:10px;cursor:pointer;min-width:0}
.tab.on{color:var(--teal)}
.tab svg{width:19px;height:19px}

/* 下拉刷新指示器（Capacitor WebView 没有原生下拉刷新，自行绘制） */
.ptr{position:fixed;top:calc(6px + env(safe-area-inset-top));left:50%;z-index:12;
  display:flex;align-items:center;gap:6px;padding:6px 11px;border-radius:99px;
  background:rgba(9,16,26,.94);border:1px solid var(--line);color:var(--muted2);
  font-size:11px;line-height:1;white-space:nowrap;opacity:0;pointer-events:none;
  transform:translate(-50%,var(--ptr-y,-46px));transition:opacity .16s}
.ptr.on{opacity:1}
.ptr .a{font-style:normal;color:var(--teal);font-size:12px;display:inline-flex;
  align-items:center;justify-content:center;transition:transform .16s}
.ptr.spin .a{width:11px;height:11px;border:2px solid rgba(47,227,207,.28);
  border-top-color:var(--teal);border-radius:50%;color:transparent;font-size:0;
  animation:ptrspin .7s linear infinite}
@keyframes ptrspin{to{transform:rotate(360deg)}}

/* 站点选择 */
.sheet{position:fixed;inset:0;background:rgba(2,5,10,.72);backdrop-filter:blur(4px);
  display:none;align-items:flex-end;justify-content:center;z-index:20}
.sheet.on{display:flex}
.sheet-in{max-height:86vh;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y;
  width:100%;max-width:430px;background:#0a1220;border:1px solid var(--line);
  border-radius:18px 18px 0 0;padding:16px 14px calc(18px + env(safe-area-inset-bottom))}
.sheet-title{font-size:14px;font-weight:600;margin-bottom:10px}
.sheet-item{display:block;width:100%;text-align:left;background:#0c1626;border:1px solid var(--line);
  border-radius:12px;padding:11px 12px;margin-bottom:8px;color:var(--text);font-family:inherit;cursor:pointer}
.sheet-item.on{border-color:var(--teal);background:#0a1a22}
.sheet-item b{display:block;font-size:13.5px;font-weight:600}
.sheet-item small{display:block;color:var(--muted);font-size:10.5px;margin-top:3px}
.sheet-close{width:100%;background:#111c2c;border:1px solid var(--line);color:var(--muted2);
  border-radius:12px;padding:11px;font-size:13px;font-family:inherit;cursor:pointer}
/* Persistent catch records and private backup */
.records{margin-top:12px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px}
.record-head{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13px}
.record-head button,.sync-btn{color:var(--teal);background:#10212a;border:1px solid #1a504c;border-radius:9px;padding:7px 10px;font:inherit;cursor:pointer}
.record-status{font-size:11px;color:var(--muted2);margin:10px 0}
.record-list{display:grid;gap:6px;max-height:230px;overflow:auto}
.record-row{background:#0c1725;border:1px solid var(--line);border-radius:9px;padding:8px;font-size:12px}
.record-row small{display:block;color:var(--muted2);margin-top:2px}
.sync-btn{margin-top:10px;width:100%}
.form-label{display:block;font-size:12px;color:var(--muted2);margin:11px 0 4px}
.form-input{width:100%;border:1px solid #254056;background:#0a1421;border-radius:9px;padding:10px;color:var(--text);font:13px inherit}
.form-actions{display:flex;gap:8px;margin-top:12px}
.form-actions button{flex:1;background:#123832;border:1px solid #286558;color:var(--text);border-radius:9px;padding:10px;font:inherit}
.form-help{font-size:11px;line-height:1.6;color:var(--muted2);margin-top:12px}
.record-thumb{display:block;width:100%;max-width:220px;border-radius:8px;margin-top:6px;border:1px solid var(--line)}
/* 说明：可点击的标签与问号 */
.stat.has-help{cursor:pointer}
.stat.has-help:active{background:#101c2b}
.help-btn{width:15px;height:15px;margin-left:4px;border-radius:50%;border:1px solid #2b3d52;background:#0d1725;
  color:var(--muted2);font-size:10px;line-height:1;padding:0;cursor:pointer;flex:0 0 15px}
.help-btn:active{background:#16314a}
.help-sheet{padding-bottom:calc(16px + env(safe-area-inset-bottom))}
.help-body{max-height:56vh;overflow:auto;margin-bottom:10px}
.help-row{padding:9px 0;border-bottom:1px dashed #16243a}
.help-row:last-child{border-bottom:0}
.help-k{font-size:12px;color:var(--teal);font-weight:600;margin-bottom:4px}
.help-v{font-size:12.5px;color:var(--muted2);line-height:1.65}
.help-v b{color:var(--text)}
.help-tip{background:#0d1b2a;border:1px solid #1d3852;border-radius:10px;padding:10px;font-size:12px;
  color:var(--muted2);line-height:1.6;margin-bottom:10px}
.coord-row{display:flex;gap:8px;margin-bottom:8px}
.coord-row .form-input{flex:1}
/* 岸边/夜间模式：整体放大，隐藏次要提示 */
html.bank .app{zoom:1.12}
html.bank .hint{display:none}
html.bank .card-head .lb{font-size:13.5px}
html.bank .stat{padding:7px 10px}
html.bank .dchip{padding:9px 7px 10px}
html.bank .tab{padding:2px 0 4px}
/* 导航栏已移出 .app，不跟随 zoom，这里单独放大保持观感一致 */
html.bank .tabbar{padding:9px 4px}
html.bank .tab{font-size:11px}
html.bank .tab svg{width:21px;height:21px}
.lm-list{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px}
.lm-item{text-align:left;background:#0c1626;border:1px solid var(--line);border-radius:10px;padding:8px 9px;
  color:var(--text);font-family:inherit;cursor:pointer}
.lm-item:active{border-color:var(--teal);background:#0a1a22}
.lm-item b{display:block;font-size:12.5px;font-weight:600}
.lm-item small{display:block;color:var(--muted);font-size:10px;margin-top:2px}

/* 离线与预取 */
.offline-bar{display:none;background:#3a2a12;border:1px solid #6b4a1c;color:#ffcf8b;
  border-radius:10px;padding:8px 10px;font-size:11.5px;text-align:center;margin-top:10px}
.prefetch-btn{width:100%;margin-top:10px;background:#0e1f2c;border:1px solid #1d3c52;color:var(--muted2);
  border-radius:10px;padding:10px;font:inherit;font-size:12px;cursor:pointer}
.prefetch-btn:active{background:#12303f}
.prefetch-btn:disabled{opacity:.6}


/* 设置页：分组卡片 + 紧凑行 */
.set-group{background:#0b1622;border:1px solid var(--line);border-radius:12px;padding:2px 12px;margin-top:10px}
.set-sec{font-size:11px;color:var(--teal);letter-spacing:.6px;margin:14px 0 6px}
.set-group .set-sec{margin:10px 0 2px}
.set-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;min-height:38px}
.set-row + .set-row{border-top:1px solid #0f1c2b}
.set-label{font-size:12.5px;color:var(--muted2);flex:1;min-width:0}
.set-row select,.set-row input[type=number]{background:#0a1421;border:1px solid #254056;border-radius:8px;
  color:var(--text);padding:6px 8px;font:12.5px inherit;width:112px;text-align:center;flex:0 0 112px}
.order-item{display:flex;align-items:center;gap:6px;padding:7px 0}
.order-item + .order-item{border-top:1px solid #0f1c2b}
.order-item span{flex:1;font-size:12.5px;color:var(--muted2)}
.order-item button{background:#111c2c;border:1px solid var(--line);color:var(--muted2);border-radius:7px;
  width:34px;height:30px;font:14px inherit;cursor:pointer}
.order-item button:disabled{opacity:.35}
.sheet-actions{position:sticky;bottom:0;background:#0a1220;border-top:1px solid var(--line);
  padding:10px 0 calc(8px + env(safe-area-inset-bottom));display:flex;gap:8px;margin-top:6px}
/* 面板自己还有底部内边距；不加这块"裙边"，滚到底时后面的行会从按钮下面露出来 */
.sheet-actions::after{content:"";position:absolute;left:0;right:0;top:100%;
  height:calc(18px + env(safe-area-inset-bottom));background:#0a1220}
.sheet-actions button{flex:1;padding:11px;border-radius:11px;font:13px inherit;cursor:pointer}
.sheet-actions .cancel{background:#111c2c;border:1px solid var(--line);color:var(--muted2)}
.sheet-actions .save{background:#123832;border:1px solid #286558;color:var(--text)}
.sheet-actions .save:disabled{opacity:.45}
/* 破坏性操作：删除等 */
.sheet-actions .danger{background:#2a1416;border:1px solid #5a2a2e;color:#ffb9b9}

/* 轻提示：保存/删除/同步/预取的结果反馈（统一在屏幕中央，避免和底部按钮/顶栏抢位置） */
.toast{position:fixed;left:50%;top:50%;z-index:45;
  transform:translate(-50%,-50%) scale(.96);max-width:min(320px,calc(100% - 48px));
  padding:11px 16px;border-radius:12px;background:rgba(12,26,38,.97);border:1px solid #1f4a45;
  color:#d7f7f1;font-size:12.5px;line-height:1.45;text-align:center;
  box-shadow:0 10px 30px rgba(0,0,0,.5);opacity:0;pointer-events:none;
  transition:opacity .18s,transform .18s}
.toast.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.toast.bad{border-color:#6b2b2b;color:#ffd7d7;background:rgba(38,16,18,.97)}
.toast.warn{border-color:#6b4a1c;color:#ffe1b4;background:rgba(38,30,14,.97)}
/* 面板滚动条：细一点，别抢视线 */
.sheet-in::-webkit-scrollbar{width:6px}
.sheet-in::-webkit-scrollbar-thumb{background:#1d3145;border-radius:3px}
.sheet-in::-webkit-scrollbar-track{background:transparent}

/* 分享海报 */
.rec-share{margin-top:7px;background:#10222f;border:1px solid #1d3c52;color:var(--teal);
  border-radius:8px;padding:6px 10px;font:11.5px inherit;cursor:pointer}
.rec-share:active{background:#16303f}
.poster-preview{display:block;width:100%;border-radius:12px;border:1px solid var(--line);margin:6px 0 10px}

/* 复盘 */
.stat-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:8px 0 4px}
.stat-summary div{background:#0b1622;border:1px solid var(--line);border-radius:11px;padding:10px 6px;text-align:center}
.stat-summary b{display:block;font-size:19px;color:var(--text)}
.stat-summary span{display:block;font-size:10px;color:var(--muted);margin-top:3px}
.stat-row{display:flex;align-items:center;gap:8px;padding:8px 0}
.stat-row + .stat-row{border-top:1px solid #0f1c2b}
.stat-k{flex:0 0 96px;font-size:11.5px;color:var(--muted2)}
.stat-bar{flex:1;height:6px;border-radius:3px;background:#12202f;overflow:hidden}
.stat-bar i{display:block;height:100%;border-radius:3px}
.stat-bar.good i{background:var(--teal)}
.stat-bar.mid i{background:var(--gold)}
.stat-bar.bad i{background:#5b2a2a}
.stat-n{flex:0 0 62px;text-align:right;font-size:12px;color:var(--text)}
.stat-n small{display:block;font-size:9.5px;color:var(--faint,#4a5f74)}

.tab{cursor:pointer;-webkit-tap-highlight-color:transparent}
.tab:active{opacity:.7}
.set-note{font-size:11px;color:var(--faint,#4a5f74);flex:0 0 auto}

/* 钓点与地图 */
.spot-row{display:flex;gap:8px;align-items:stretch;margin-bottom:7px}
.spot-pick{flex:1;text-align:left;background:#0b1622;border:1px solid var(--line);border-radius:11px;
  padding:9px 11px;color:var(--text);font:inherit;cursor:pointer}
.spot-pick:active{border-color:var(--teal)}
.spot-pick b{display:block;font-size:13px}
.spot-pick small{display:block;color:var(--muted);font-size:10.5px;margin-top:3px}
.spot-del{flex:0 0 52px;background:#1a1013;border:1px solid #3a2130;color:#c98a9a;border-radius:11px;
  font:11px inherit;cursor:pointer}
.map-box{height:320px;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#0b1622;position:relative}
.map-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:var(--muted);font-size:12px;text-align:center;padding:20px;line-height:1.6}
.leaflet-container{background:#0b1622;font:inherit}

.map-tools{display:flex;align-items:center;gap:8px;margin:8px 0 4px}
.map-chip{background:#10222f;border:1px solid #1d3c52;color:var(--teal);border-radius:9px;
  padding:6px 10px;font:11.5px inherit;cursor:pointer}
.map-hint{font-size:10.5px;color:var(--faint,#4a5f74)}

.diag-out{margin:8px 0 0;padding:10px;background:#0a1421;border:1px solid #1d3145;border-radius:10px;
  color:var(--muted2);font-size:10.5px;line-height:1.7;white-space:pre-wrap;word-break:break-all}
'

/* 历史页 */
.hist-list{display:grid;gap:6px;margin:10px 0 4px}
.hist-row{width:100%;display:grid;grid-template-columns:56px 26px 56px 1fr auto;align-items:center;gap:8px;
  background:#0c1725;border:1px solid var(--line);border-radius:10px;padding:9px 10px;
  color:var(--text);font:inherit;text-align:left;cursor:pointer}
.hist-row:active{border-color:var(--teal);background:#0a1a22}
.hist-row.flat{opacity:.72}
.hist-date{font-size:13px;font-weight:600;display:flex;flex-direction:column;line-height:1.2}
.hist-date small{font-size:10px;color:var(--muted);font-weight:400}
.hist-wx{font-size:16px;text-align:center;font-family:"Apple Color Emoji","Noto Color Emoji","Segoe UI Emoji",sans-serif}
.hist-pct{font-size:15px;font-weight:700;color:var(--teal);text-align:right}
.hist-pct i{font-size:9px;font-style:normal;color:var(--muted2)}
.hist-pct.bad{color:var(--red);font-size:13px}
.hist-win{font-size:11px;color:var(--muted2);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hist-catch{font-size:11px;color:var(--teal)}
.hist-big{display:flex;align-items:baseline;gap:10px;margin:6px 0 10px}
.hist-big b{font-size:26px;color:var(--teal)}
.hist-big span{font-size:12px;color:var(--muted2)}

/* ================= 页面（四页常驻 DOM，切页只切显示） =================
   非活动 view 一律 display:none —— 不要改成 opacity/visibility/transform：
   那些会保留布局盒，吃掉触摸命中与 getBoundingClientRect，
   还会顶坏 sticky 顶栏与下拉刷新（pullrefresh 读的是 window.scrollY）。 */
.view{display:none}
.view.on{display:block}

/* ================= 页面视觉梯队（只作用在 .view 里，弹层保持紧凑不变） =================
   原则（2026-11-06 第三轮，真机反馈"还是偏大"后再收一档）：
   层级靠**字重 / 颜色明度 / 留白**拉开，不靠放大字号，整体对齐潮汐页的字号尺度。
   四档：页标题 17(600) → 区块标题 11.5(600) → 行标签 12 → 元信息 10。
   按钮不用渐变、不用发光阴影：主操作＝深青底 + 亮青字 + 1px 边，次要＝纯描边。 */

/* 页头 */
.view .page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;
  padding:calc(12px + env(safe-area-inset-top)) 2px 9px;
  border-bottom:1px solid #0b1622;margin-bottom:12px}
.view .ph-txt{min-width:0}
.view .ph-txt b{display:block;font-size:17px;font-weight:600;letter-spacing:.2px;line-height:1.3}
.view .ph-txt small{display:block;color:#7d92a6;font-size:11px;line-height:1.6;margin-top:4px;max-width:30em}
.view .ph-acts{display:flex;flex-direction:column;gap:5px;flex:0 0 auto;padding-top:2px}
.view .ph-acts .rec-share{margin-top:0;white-space:nowrap;padding:5px 8px;font-size:11px;border-radius:7px}

/* 区块标题 */
.view .set-sec{display:flex;align-items:center;gap:7px;margin:18px 2px 6px;
  font-size:11.5px;font-weight:600;color:#c8d6e2;letter-spacing:.2px}
.view .set-sec::before{content:"";flex:0 0 2px;width:2px;height:9px;border-radius:1px;
  background:rgba(47,227,207,.55)}
.view .set-sec:first-child{margin-top:2px}
.view .sec-hint{margin-left:auto;font-size:10px;font-weight:400;color:#5f7488;letter-spacing:0}

/* 分组卡片 */
.view .set-group{background:#0a1420;border:1px solid #101d2e;border-radius:11px;padding:1px 12px;margin-top:0}
.view .set-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;min-height:38px}
.view .set-row + .set-row{border-top:1px solid #0d1926}
.view .set-label{font-size:12px;color:#b3c4d3;flex:1;min-width:0;line-height:1.45}
.view .set-row select,.view .set-row input[type=number]{background:#08111c;border:1px solid #1d3346;border-radius:8px;
  color:#dce8f2;padding:6px 7px;font:12px/1.2 inherit;width:106px;text-align:center;flex:0 0 106px;
  font-variant-numeric:tabular-nums}
.view .order-item{padding:8px 0}
.view .order-item span{font-size:12px;color:#b3c4d3}
.view .order-item button{width:28px;height:24px;font-size:11px}
.view .set-note{font-size:10px;color:#4f6377}

/* 说明与状态 */
.view .form-help{font-size:11px;line-height:1.6;color:#74899d;margin-top:7px}
.view .record-status{font-size:11px;line-height:1.5;color:#8199ad;margin:7px 0}
.view .record-status:empty{display:none}

/* 主操作 */
.view .btn-primary{display:block;width:100%;margin-top:10px;padding:10px;cursor:pointer;
  background:#12302c;border:1px solid #1e5a51;border-radius:9px;
  color:#7ff0e0;font:600 12.5px inherit}
.view .btn-primary:active{background:#16403a}
.view .btn-primary:disabled{cursor:default;background:#0e1a1a;border-color:#172b2b;color:#4e6a66}

/* 并排实心按钮（记录页：记渔获 / 空军 同权；潮汐页的快捷入口复用同一套） */
.view .rec-acts{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:2px 0 10px}
/* 潮汐页那两个按钮在 hero 与日期条之间，需要自己的上下留白（权重压过 .rec-acts） */
.view .rec-acts.tide-quick{margin:12px 0 10px}
.view .btn-solid{display:block;width:100%;padding:10px 6px;cursor:pointer;
  background:#12302c;border:1px solid #1e5a51;border-radius:9px;color:#7ff0e0;font:600 12.5px inherit;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.view .btn-solid.quiet{background:#0c1a22;border-color:#1a3244;color:#9fb6c8}
.view .btn-solid:active{background:#16403a}

/* 「我的」页：出钓记录宫格（2026-11-10）
   固定每格 25% 宽、左对齐 —— 现在只有一格，看着会有点空，但这是唯一能避免
   "今天一格占满、明天加一格整排跳变"的做法。图标 28×28 多色 SVG（img/record.svg）、文案 ≤4 字；
   **无卡片、无底块**（底块＝小卡片，用户明确否掉），所以图标必须自己够"重"。 */
.view .entry-grid{display:flex;align-items:flex-start;gap:2px;margin:14px 0 12px}
.view .grid-ent{flex:0 0 25%;display:flex;flex-direction:column;align-items:center;gap:7px;
  background:none;border:0;border-radius:8px;padding:2px 0;margin:0;cursor:pointer;font:inherit;color:#c8d6e2}
.view .grid-ent .ge-ico{width:32px;height:32px;display:block;transition:transform .12s}
.view .grid-ent b{font-size:12px;font-weight:500;color:#c2d2df;letter-spacing:.2px}
.view .grid-ent:active .ge-ico{transform:scale(.93)}
.view .grid-ent:active b{color:#7ff0e0}

/* 空态（社区占位页）：图标 + 一句方向 + 一句现状，**不放按钮**
   （"敬请期待/通知我"这种点了没用的东西比空页更糟） */
.view .empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;
  padding:52px 18px 0}
.view .empty-state .es-ico{width:52px;height:52px;color:#25455c}
.view .empty-state .es-title{font-size:13px;font-weight:600;color:#c8d6e2;line-height:1.7}
.view .empty-state .es-note{font-size:11.5px;color:#5f7488;line-height:1.7}

/* 次要 / 第三档 */
.view .sync-btn{margin-top:7px;padding:9px;font-size:12px}
.view .map-chip{padding:6px 11px;font-size:11.5px}
.view .btn-text{display:block;width:100%;margin-top:7px;padding:7px 0;cursor:pointer;
  background:none;border:1px dashed #182c3d;border-radius:8px;color:#7a8fa2;font:11px inherit}

/* 记录页 */
.view .records{margin-top:3px;padding:11px;border-radius:11px}
.view #backupStatus.record-status{margin:0 0 9px;padding:7px 9px;font-size:11px;line-height:1.5;
  color:#8199ad;background:#08111c;border:1px solid #132436;border-radius:9px}
.view .record-list{gap:6px;max-height:none}
.view .record-row{padding:9px 10px;font-size:12px;border-radius:9px;line-height:1.5}
.view .record-row small{font-size:10px;margin-top:3px}
.view .record-row .rec-share{padding:4px 8px;font-size:10.5px;margin-top:6px;border-radius:6px}

/* 钓点行：整行一张卡。名称/地址在左，**「地图 / 编辑」常驻在卡片右侧**
   （2026-11-09 反馈：要像记录页的分享按钮那样固定显示，别藏在左滑里）；删除仍走左滑 */
.view .spot-row{display:block;margin-bottom:6px;background:#0b1622;
  border:1px solid var(--line);border-radius:10px;overflow:hidden}
.view .spot-body{display:flex;align-items:center;gap:0}
.view .spot-pick{flex:1;min-width:0;background:transparent;border:0;border-radius:0;
  padding:10px 4px 10px 11px;text-align:left;color:var(--text);font:inherit;cursor:pointer}
.view .spot-pick:active{background:#0e1c2a}
.view .spot-pick b{display:block;font-size:13px;font-weight:600;letter-spacing:.1px}
.view .spot-pick small{display:block;font-size:10px;margin-top:3px;line-height:1.5;color:var(--muted)}
/* 常驻动作：做成和记录页「分享」一样的小胶囊（2026-11-09 反馈），不再是贴在卡边的文字 */
.view .spot-acts{display:flex;align-items:center;gap:6px;flex:0 0 auto;padding:0 9px 0 0}
.view .spot-act{background:#10222f;border:1px solid #1d3c52;color:var(--teal);
  font:11.5px inherit;padding:6px 9px;border-radius:8px;cursor:pointer;white-space:nowrap}
.view .spot-act:active{background:#16303f}

/* 「新增钓点」= 一个卡片装完：名称 / 已选 / 两个选点按钮 / 保存 */
.view .spot-add{padding:0 12px 11px}
.view .spot-draft{padding:7px 0 0;font-size:10px;line-height:1.55;color:#8199ad}
.view .spot-draft b{color:#c8d6e2;font-weight:600}
.view .spot-draft:empty{display:none}
.view .spot-tools{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:9px 0 0}
.view .spot-tools .sync-btn{margin-top:0}
.view .spot-add .btn-primary{margin:10px 0 0}

/* 设置页底部 */
.view .set-ver{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px;padding:10px 0 1px}
.view .set-v-k{font-size:10.5px;color:var(--muted);letter-spacing:.4px;white-space:nowrap}
.view .set-ver .v{font-size:12px;color:#dce8f2;font-variant-numeric:tabular-nums;text-align:right;
  overflow-wrap:anywhere}
#updateBtn{display:block;width:100%;margin-top:7px;padding:10px;cursor:pointer;
  background:#0c1a26;border:1px solid #1a3244;color:#7ff0e0;border-radius:9px;font:12px inherit}
#updateBtn:active{background:#10222f}
.view .ver-hint{font-size:10px;color:var(--muted);margin-top:6px;line-height:1.55}

/* 站点弹层标题右侧的计数（'23 个 · 按区域'）：弹层里没有 .view 的 flex 上下文，单独给间距 */
.sheet-title .sec-hint{margin-left:8px;font-size:10px;font-weight:400;color:#5f7488;letter-spacing:0}

/* ============ 2026-11-08：左滑操作 / 记录单行列表 / 地图搜索·导航·最大化 ============ */

/* 左滑：外层 .swipe 裁切 + 动作条贴在右侧，内容 .swipe-body 平移露出动作 */
.swipe{position:relative;overflow:hidden;touch-action:pan-y}
.swipe-acts{position:absolute;top:0;right:0;bottom:0;display:flex;z-index:1}
.swipe-acts .swipe-act{width:54px;flex:0 0 54px;margin:0;padding:0;cursor:pointer;
  background:#16232f;border:0;border-left:1px solid #0d1926;color:#cfe4f2;font:11.5px inherit;
  display:flex;align-items:center;justify-content:center;line-height:1.25;text-align:center}
.swipe-acts .swipe-act:active{background:#0e1c2a}
.swipe-acts .swipe-act.danger{background:#3a1a1e;color:#ffb9b9}
.swipe-acts .swipe-act.danger:active{background:#4a2126}
.swipe-body{position:relative;z-index:2;display:flex;align-items:stretch;background:#0b1622;
  will-change:transform}
.view .spot-row.swipe .swipe-body{background:#0b1622;align-items:stretch}
.view .spot-list .set-sec{margin-top:12px}

/* 记录列表：**一条一行**（图片只占 42×42 的缩略图，点了看详情）
   注意：必须写成 .view .record-row 才压得住上面那条 .view .record-row{padding:9px 10px} */
.record-row{padding:0;overflow:hidden}
.view .record-row{padding:0}
.view .record-row.swipe{margin-bottom:0}
.record-row.swipe{gap:0;margin:0}
.record-row .swipe-body{background:#0c1725;align-items:center}
.rr-main{flex:1;min-width:0;display:flex;align-items:center;gap:9px;padding:8px 9px;
  background:none;border:0;color:var(--text);font:inherit;text-align:left;cursor:pointer}
.rr-main:active{background:#0e1c2a}
.rr-thumb{flex:0 0 42px;width:42px;height:42px;border-radius:8px;overflow:hidden;background:#0a1420;
  border:1px solid #16273c;display:flex;align-items:center;justify-content:center;font-size:18px;line-height:1}
.rr-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.rr-txt{flex:1;min-width:0;overflow:hidden}
.rr-txt b{display:block;font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rr-txt small{display:block;font-size:10px;color:var(--muted2);margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rr-txt .rr-sub{color:#5f7488}
.record-row .rec-share{flex:0 0 auto;margin:0 9px 0 0;padding:5px 8px;font-size:10.5px;border-radius:7px;
  background:#0e1a26;border:1px solid #17293c;color:#8299ad;cursor:pointer}
.record-row .rec-share:active{background:#16232f;color:var(--teal)}
/* 记录详情：照片看大图，条件快照看全 */
.rec-photo{margin-top:2px;border-radius:11px;overflow:hidden;border:1px solid var(--line);background:#08111c}
.rec-photo img{display:block;width:100%;max-height:46vh;object-fit:contain;background:#060b12}
.rec-photo .form-help{padding:10px;margin:0}

/* 地图：搜地名 */
.map-search{position:relative;margin:0 0 8px}
.map-hits{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:1200;overflow:auto;max-height:200px;
  background:#0a1420;border:1px solid var(--line);border-radius:11px;box-shadow:0 12px 26px rgba(0,0,0,.5)}
.map-hit{display:block;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid #0d1926;
  color:var(--text);padding:8px 10px;font:12px inherit;cursor:pointer}
.map-hit:last-child{border-bottom:0}
.map-hit:active{background:#0e1c2a}
.map-hit b{font-size:12.5px;font-weight:600}
.map-hit small{display:block;color:var(--muted);font-size:10px;margin-top:2px}
.map-hit-c{float:right;color:#4a5f74;font-size:10px;font-variant-numeric:tabular-nums}
.map-hit-none{padding:9px 10px;font-size:11px;color:var(--muted2)}

/* 地图：选点标识（以前的小半透明圆点在影像底图上几乎看不见） */
.leaflet-marker-icon.pick-pin,.leaflet-marker-icon.hit-pin{background:none;border:0}
.pick-pin i,.hit-pin i{position:absolute;display:block;border-radius:50%;font-style:normal}
.pick-pin .pp-halo{left:50%;top:50%;width:44px;height:44px;margin:-22px 0 0 -22px;
  background:rgba(255,180,84,.30);animation:pickpulse 1.7s ease-out infinite}
.pick-pin .pp-cross{left:50%;top:50%;width:34px;height:34px;margin:-17px 0 0 -17px;
  border:1px dashed rgba(255,255,255,.62)}
.pick-pin .pp-ring{left:50%;top:50%;width:22px;height:22px;margin:-11px 0 0 -11px;
  border:2px solid rgba(255,180,84,.95)}
.pick-pin .pp-dot{left:50%;top:50%;width:13px;height:13px;margin:-6.5px 0 0 -6.5px;background:#ffb454;
  border:2px solid #2a1608;box-shadow:0 0 12px rgba(255,180,84,.95)}
@keyframes pickpulse{0%{transform:scale(.55);opacity:.9}100%{transform:scale(1.45);opacity:0}}
.hit-pin .hp-dot{left:50%;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;background:#2fe3cf;
  border:2px solid #062a26;box-shadow:0 0 10px rgba(47,227,207,.85)}

/* 地图：最大化（.sheet.map-full 让弹层铺满，地图吃掉多出来的高度） */
.sheet.map-full .sheet-in{max-width:100%;max-height:100vh;height:100vh;border-radius:0;
  padding-top:calc(12px + env(safe-area-inset-top));display:flex;flex-direction:column}
.sheet.map-full .map-search,.sheet.map-full .map-tools,
.sheet.map-full .record-status,.sheet.map-full .map-navbox,.sheet.map-full .sheet-actions{flex:0 0 auto}
.sheet.map-full .map-box{flex:1 1 auto;height:auto;min-height:220px}
.map-navbox{margin-top:8px}
.nav-note{display:block;font-size:10px;color:var(--muted);margin-top:2px}
.nav-list .set-row{gap:6px}
.nav-list .map-chip{white-space:nowrap;padding:6px 9px;font-size:11px}
.nav-list .map-chip.quiet{background:#0c1a22;border-color:#1a3244;color:#9fb6c8}

/* 下拉刷新：真失败要说出来（红边 + 文案由 js/pullrefresh.js 给） */
.ptr.bad{border-color:#5a2a2e}
.ptr.bad .a{color:#ff8a8a}

/* 点位的水域声明标签（钓点行）：只在用户显式声明过时出现 */
.wtag{margin-left:6px;font-style:normal;font-size:9.5px;font-weight:400;color:#7ff0e0;
  background:#0f2a26;border:1px solid #1e5a51;border-radius:5px;padding:1px 5px}
/* 站点弹层的类型过滤（选中态）：.map-chip 原样式没有 on */
.map-chip.on{background:#123832;border-color:#286558;color:#e9f2f9}
/* 未校准站的转流提示：琥珀色，说明这是推算 */
.tl-hint.tl-unc{color:#e0a24a}
/* 实测水位（日更）：径流主导的内河站，这一行才是判断涨退的主信息 */
.tl-meas{font-size:12px;color:#c8d6e2;font-variant-numeric:tabular-nums}

/* 「我的」页：账号单独成卡（唯一会影响云端数据的一块），用青色边区分于普通设置组 */
.view .acct-card{border-color:#1e5a51;background:#08161c}
.view .set-row .set-note{font-size:10px;color:#5f7488;margin-top:2px;line-height:1.4}

/* 全天钓况指数曲线（2026-11-09）：hero 的指数环可点，弹层里看 0–23 点怎么走 */
.ring{cursor:pointer}
.idx-more{margin-top:6px;padding:4px 9px;background:#0c1a22;border:1px solid #1a3244;border-radius:8px;
  color:#7ff0e0;font:11px inherit;cursor:pointer}
.idx-more:active{background:#10222f}
.idx-chart{margin:2px 0 8px;padding:6px 4px 2px;background:#08111c;border:1px solid #132436;border-radius:11px}
.idx-chart svg{display:block;width:100%;height:132px;touch-action:pan-y;cursor:crosshair}
.idx-det{margin:4px 2px 2px;font-size:11px;line-height:1.5;color:#8199ad;min-height:16px}
.idx-det b{color:#e9f2f9}
.idx-row{cursor:pointer}
.idx-row.on{background:#0e1c2a}

/* 「我的」页 2026-11-09 第二轮：页面只留账号概览 + 一行设置入口，其余进弹层 */
.view .acct-row{align-items:flex-start}
.view .acct-name{display:block;font-size:14px;font-weight:600;color:#e9f2f9}
/* 入口行（设置一级/二级弹层共用）：整行可点，右侧 › */
.entry-row{display:flex;align-items:center;gap:9px;width:100%;padding:11px 12px;margin:0;cursor:pointer;
  background:none;border:0;border-bottom:1px solid #0d1926;color:var(--text);font:inherit;text-align:left}
.entry-row:last-child{border-bottom:0}
.entry-row:active{background:#0e1c2a}
.entry-ico{flex:0 0 auto;font-size:15px;color:#7ff0e0}
.entry-txt{flex:1;min-width:0}
.entry-txt b{display:block;font-size:13px;font-weight:600}
.entry-txt small{display:block;font-size:10.5px;color:#8199ad;margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.entry-go{flex:0 0 auto;color:#4a5f74;font-size:15px}
/* 弹层头：标题 + 关闭；二级弹层左侧是「‹ 设置」 */
.sheet-head{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.sheet-head .sheet-title{margin:0;flex:1;min-width:0}
.sheet-x{margin-left:auto;padding:5px 10px;background:#111c2c;border:1px solid var(--line);
  border-radius:8px;color:var(--muted2);font:11px inherit;cursor:pointer}
.sheet-back{padding:5px 10px;background:#0c1a22;border:1px solid #1a3244;border-radius:8px;
  color:#7ff0e0;font:11.5px inherit;cursor:pointer;white-space:nowrap}
.sheet-back:active{background:#10222f}

/* 弹层里的小节标题：.set-sec 原本只在 .view 作用域内定义，
   2026-11-09 设置搬进弹层后里面也要有同样的"竖条 + 小字提示"样式 */
.sheet-in .set-sec{display:flex;align-items:center;gap:7px;margin:14px 2px 6px;
  font-size:11.5px;font-weight:600;color:#c8d6e2;letter-spacing:.2px}
.sheet-in .set-sec::before{content:"";flex:0 0 2px;width:2px;height:9px;border-radius:1px;
  background:rgba(47,227,207,.55)}
.sheet-in .set-sec:first-child{margin-top:2px}
.sheet-in .set-sec .sec-hint{margin-left:auto;font-size:10px;font-weight:400;color:#5f7488;letter-spacing:0}
.sheet-in .set-note{display:block;font-size:10px;color:#5f7488;margin-top:2px;line-height:1.4}

/* ---------- 子页面（2026-11-09：设置/账号/记录详情/地图总览 都是页面，不是弹窗） ---------- */
.page-back{display:inline-flex;align-items:center;gap:4px;background:transparent;border:0;color:var(--muted2);
  font:12.5px inherit;padding:6px 2px 2px;cursor:pointer}
.page-back:active{color:var(--teal)}
.sub-page{padding-bottom:8px}
/* 记录页：进入子页面时把列表等常规内容藏起来，只留 #recPage */
#view-records.sub > *:not(#recPage){display:none}
#view-records.sub #recPage{display:block}
/* 照片大图页：整屏宽、可点返回 */
.photo-page{display:flex;align-items:center;justify-content:center;min-height:60vh;
  background:#04070d;border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-top:6px}
.photo-page img{display:block;width:100%;height:auto;max-height:72vh;object-fit:contain}
.rec-detail .rec-photo img{cursor:zoom-in}
/* 地图总览 */
#spotMapHost .map-box{height:min(62vh,460px)}
/* 钓点页两个入口瓦片（2026-11-09）：图标在上、文案在下，像一张大按钮 */
.view .spot-tiles{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:10px 0 4px}
.view .spot-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;
  padding:16px 10px;background:#0b1622;border:1px solid var(--line);border-radius:12px;
  color:var(--text);font:inherit;cursor:pointer}
.view .spot-tile:active{background:#0e1c2a;border-color:var(--teal)}
.view .spot-tile .tile-ico{font-size:22px;line-height:1;color:var(--teal)}
.view .spot-tile .tile-tx{font-size:13px;font-weight:600;letter-spacing:.2px}
/* ---------- 安装到桌面的引导条（2026-11-09 改为网页端为主） ---------- */
.install-bar{display:none;align-items:center;gap:8px;margin-top:10px;
  background:#0c1e2b;border:1px solid #1d3c52;border-radius:10px;padding:8px 10px}
.install-bar.on{display:flex}
.install-bar .ib-txt{flex:1;font-size:11.5px;color:var(--muted2);line-height:1.4}
.install-bar .ib-go{background:var(--teal);color:#04222a;border:0;border-radius:8px;
  padding:7px 12px;font:600 12px inherit;cursor:pointer;white-space:nowrap}
.install-bar .ib-go:active{opacity:.85}
.install-bar .ib-later{background:transparent;border:0;color:var(--muted);font:11.5px inherit;
  padding:7px 2px;cursor:pointer;white-space:nowrap}