/* ============================================================================
   styles.css · 藏家在线 H5（生产前端）
   视觉蓝本：/workspace/mobile/prototype.html
   适配：全屏移动端 shell（去掉原型里的 phone 外框 + 右侧控制台）
   ========================================================================== */

:root{
  --c-bg:#f7f8fa; --c-card:#fff; --c-line:#e8eaee; --c-txt:#1b1f26; --c-sub:#8b93a3;
  --c-dim:#9aa2ae; --c-soft:#f2f4f8; --c-dash:#cfd5df;
  --brand:#c8a15a; --brand-d:#a8843f; --ok:#3fb950; --warn:#e3b341; --bad:#f85149;
  --r:14px; --r-sm:10px; --r-lg:18px;
  --sh-1:0 1px 3px rgba(20,25,35,.06);
  --sh-2:0 4px 14px rgba(20,25,35,.10);
  --safe-t:env(safe-area-inset-top, 0px);
  --safe-b:env(safe-area-inset-bottom, 0px);
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;height:100%}
body{
  background:var(--c-bg); color:var(--c-txt);
  font:15px/1.6 -apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  -webkit-font-smoothing:antialiased;
}
input,textarea,select,button{font-family:inherit}
img{display:block;max-width:100%}

/* ---------- 应用壳 ---------- */
#app{height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden;position:relative}
.view{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative}

/* ---------- 通用结构 ---------- */
.body{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}
.body::-webkit-scrollbar{width:0;height:0}
#app.tabbar-on .body{padding-bottom:calc(86px + var(--safe-b))}

.hd{
  flex:0 0 auto; display:flex; align-items:center; gap:10px; padding:calc(8px + var(--safe-t)) 14px 10px;
  background:#fff; border-bottom:.6px solid var(--c-line); position:sticky; top:0; z-index:20;
}
.hd h1{margin:0;font-size:17px;font-weight:600;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.back{font-size:24px;line-height:1;color:#5b6472;width:30px;flex:0 0 auto;cursor:pointer;user-select:none}
.back:active{opacity:.5}
.more-link{font-size:13px;color:var(--brand-d);white-space:nowrap;cursor:pointer;flex:0 0 auto}

.prog{flex:1;display:flex;gap:4px;padding:0 2px}
.seg{flex:1;height:5px;border-radius:3px;background:#e3e6ec;transition:background .25s}
.seg.on{background:var(--brand-d)}
.seg.cur{background:var(--brand)}

.ft{
  flex:0 0 auto; padding:10px 16px calc(12px + var(--safe-b)); background:#fff; border-top:.6px solid var(--c-line);
}
.btn{
  width:100%; height:52px; border:none; border-radius:12px; background:var(--brand-d); color:#fff;
  font-size:17px; font-weight:600; cursor:pointer; letter-spacing:.5px;
}
.btn:active{transform:scale(.985);opacity:.9}
.btn.ghost{background:#fff;color:#4a5260;border:1.4px solid #d7dbe3}
.btn.sm{height:44px;font-size:15px}
.btn:disabled{background:#d8dce4;color:#fff;cursor:not-allowed}
.btn-row{display:flex;gap:10px}
.btn-row .btn{flex:1}

/* ---------- 底部 tabbar ---------- */
.tabbar{
  flex:0 0 auto; display:flex; align-items:flex-end; background:#fff; border-top:.6px solid var(--c-line);
  padding:6px 0 calc(6px + var(--safe-b)); position:relative; height:auto; z-index:25;
}
.tab{flex:1;text-align:center;font-size:11px;color:#9aa2ae;cursor:pointer;padding:4px 0}
.tab i{display:block;font-style:normal;font-size:21px;margin-bottom:2px}
.tab.on{color:var(--brand-d);font-weight:600}
.fab{
  position:absolute; left:50%; bottom:calc(50px + var(--safe-b)); transform:translateX(-50%);
  width:56px;height:56px;border-radius:50%;background:var(--brand-d);color:#fff;
  font-size:32px;line-height:54px;text-align:center;box-shadow:0 6px 18px rgba(168,132,63,.45);cursor:pointer;z-index:30;
}
.fab:active{transform:translateX(-50%) scale(.94)}

/* ---------- 首页 / 列表 ---------- */
.notice{
  background:#fff8e6;color:#8a6100;font-size:13px;padding:9px 16px;display:flex;
  align-items:center;gap:8px;border-bottom:.6px solid #f0e2bd;cursor:pointer;
}
.notice.info{background:#eef4ff;color:#2b5fb0;border-color:#cfe0ff}
.notice b{color:inherit;font-weight:600}
.hometitle{padding:18px 16px 2px;font-size:22px;font-weight:700}
.sub{padding:0 16px 10px;font-size:12px;color:var(--c-dim)}
.card{
  background:var(--c-card);border-radius:12px;margin:10px 12px;overflow:hidden;display:flex;gap:12px;
  padding:12px;box-shadow:0 1px 3px rgba(20,25,35,.06);cursor:pointer;
}
.card:active{background:#f3f5f8}
.thumb{width:76px;height:76px;border-radius:9px;flex:0 0 auto;position:relative;overflow:hidden;background:var(--c-soft)}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb span{position:absolute;bottom:0;right:0;background:rgba(0,0,0,.55);color:#fff;font-size:10px;padding:1px 5px;border-radius:5px 0 0 0}
.card .meta{flex:1;min-width:0}
.card .t{font-size:15px;font-weight:600;line-height:1.35;margin-bottom:3px}
.card .s{font-size:12px;color:var(--c-sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lock{font-size:11px;color:var(--c-sub);background:var(--c-soft);padding:2px 7px;border-radius:20px;display:inline-block;margin-top:6px}
.draft{font-size:11px;color:#8a6100;background:#fff2d9;padding:2px 7px;border-radius:20px;display:inline-block;margin-top:6px;margin-left:6px;font-weight:600}

/* 网格（#/collection 藏品库） */
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding:12px}
.tile{background:var(--c-card);border-radius:12px;overflow:hidden;box-shadow:0 1px 3px rgba(20,25,35,.06);cursor:pointer}
.tile .cv{width:100%;aspect-ratio:1;background:var(--c-soft);position:relative}
.tile .cv img{width:100%;height:100%;object-fit:cover}
.tile .cap{padding:8px 10px}
.tile .cap .t{font-size:14px;font-weight:600;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile .cap .s{font-size:12px;color:var(--c-sub);margin-top:2px}

/* ---------- 空态 / 骨架 ---------- */
.empty{padding:64px 30px;text-align:center;color:var(--c-sub)}
.empty .ic{font-size:46px;margin-bottom:12px}
.empty h3{margin:0 0 6px;font-size:17px;color:var(--c-txt)}
.empty p{margin:0;font-size:13.5px;line-height:1.6}
.empty .btn{margin-top:18px;max-width:240px;margin-left:auto;margin-right:auto}
.skeleton{background:linear-gradient(90deg,#eef0f3 25%,#e3e6ea 37%,#eef0f3 63%);background-size:400% 100%;animation:sk 1.2s ease infinite;border-radius:10px}
@keyframes sk{0%{background-position:100% 0}100%{background-position:0 0}}

/* ---------- 品类选择 ---------- */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:14px 16px}
.cat{
  background:#fff;border-radius:13px;padding:14px 6px 11px;text-align:center;cursor:pointer;
  box-shadow:0 1px 3px rgba(20,25,35,.06);border:1.6px solid transparent;
}
.cat:active{background:#f3f5f8}
.cat.sel{border-color:var(--brand-d);background:#fdf8ec}
.cat em{font-style:normal;font-size:30px;display:block;margin-bottom:5px}
.cat b{font-size:13px;font-weight:500}
.chips{display:flex;gap:8px;padding:6px 16px 12px;overflow-x:auto}
.chips::-webkit-scrollbar{height:0}
.chip{background:#fff;border:1px solid #e3e6ec;border-radius:18px;padding:6px 13px;font-size:13px;white-space:nowrap;cursor:pointer}
.chip:active{background:#f3f5f8}
.srch{margin:12px 16px 4px;background:#fff;border-radius:10px;padding:9px 13px;font-size:14px;color:var(--c-dim);display:flex;gap:7px;align-items:center}
.sec{padding:14px 16px 6px;font-size:13px;color:var(--c-sub);font-weight:600}
.more{text-align:center;padding:12px;font-size:13px;color:var(--brand-d);cursor:pointer}
.tip{background:#fff5f5;border:.8px solid #f3c9c9;color:#9c3a3a;border-radius:10px;margin:4px 16px 12px;padding:10px 13px;font-size:12.5px;line-height:1.55}
.tip.ok{background:#f3f8f4;border-color:#c9e3cf;color:#2c6b3d}

/* ---------- 拍照 / 选图 ---------- */
.slot{
  background:#fff;border-radius:12px;margin:10px 12px 0;overflow:hidden;box-shadow:0 1px 3px rgba(20,25,35,.06);
}
.slot .row{display:flex;align-items:center;gap:12px;padding:13px 14px}
.slot .info{flex:1;min-width:0}
.slot .nm{font-size:15.5px;font-weight:600}
.slot .nm i{font-style:normal;color:var(--bad);margin-left:3px}
.slot .ds{font-size:12px;color:var(--c-sub);margin-top:2px}
.shot{
  width:64px;height:64px;border-radius:10px;flex:0 0 auto;position:relative;overflow:hidden;
  background:var(--c-soft);border:1.6px dashed var(--c-dash);display:flex;align-items:center;justify-content:center;
  font-size:26px;color:#b9c0cc;cursor:pointer;
}
.shot:active{background:#e9ecf2}
.shot.done{border:none}
.shot img{width:100%;height:100%;object-fit:cover}
.badge{
  position:absolute;left:0;right:0;bottom:0;font-size:10px;text-align:center;padding:2px 0;
  background:rgba(0,0,0,.5);color:#fff;
}
.badge.up{background:rgba(63,185,80,.92)}
.badge.wait{background:rgba(227,179,65,.95);color:#3d2c00}
.hint{font-size:12px;color:var(--c-dim);padding:10px 16px 0;line-height:1.6}
.mini{display:flex;gap:10px;padding:12px 12px 0;flex-wrap:wrap}
.mini .m{flex:1;min-width:100px;background:#fff;border-radius:11px;padding:11px;text-align:center;cursor:pointer;box-shadow:0 1px 3px rgba(20,25,35,.06)}
.mini .m .ph{height:58px;border-radius:8px;margin-bottom:7px;background:var(--c-soft);border:1.4px dashed var(--c-dash);display:flex;align-items:center;justify-content:center;font-size:21px;color:#b9c0cc;overflow:hidden}
.mini .m .ph.done{border:none}
.mini .m .ph img{width:100%;height:100%;object-fit:cover}
.mini .m b{font-size:12.5px;font-weight:500}

/* ---------- AI 识别中 ---------- */
.aibox{padding:40px 24px;text-align:center}
.spin{width:52px;height:52px;border-radius:50%;border:3.5px solid #eceef3;border-top-color:var(--brand-d);margin:18px auto 20px;animation:sp .85s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
.steps{text-align:left;background:#fff;border-radius:12px;padding:16px 18px;margin-top:26px}
.steps div{display:flex;align-items:center;gap:10px;padding:7px 0;font-size:14px;color:var(--c-dim)}
.steps div.on{color:var(--c-txt);font-weight:600}
.steps div.ok{color:var(--ok)}
.steps div u{text-decoration:none;width:18px;display:inline-block;text-align:center}

/* ---------- 建议卡 ---------- */
.sug{background:#fff;border-radius:12px;margin:10px 12px 0;padding:13px 14px;box-shadow:0 1px 3px rgba(20,25,35,.06)}
.sug.lo{border:1.6px solid #f0d98a;background:#fffdf5}
.sug .l{display:flex;align-items:center;gap:8px}
.sug .k{font-size:12.5px;color:var(--c-sub);flex:0 0 auto}
.sug .v{flex:1;font-size:16px;font-weight:600;min-width:0;word-break:break-word}
.sug .c{font-size:12px;color:var(--ok);font-weight:600;flex:0 0 auto}
.sug.lo .c{color:#a67c00}
.sug .rs{font-size:11.5px;color:#a2aab8;margin-top:6px;line-height:1.5}
.sug .act{display:flex;gap:8px;margin-top:10px}
.sug .act button{flex:1;height:38px;border-radius:9px;border:1.3px solid #dfe3ea;background:#fff;font-size:14px;cursor:pointer}
.sug .act button.p{background:var(--brand-d);color:#fff;border:none;font-weight:600}
.sug .act button.p:active{opacity:.85}
.sug.dim{opacity:.55}
.sug .ok{color:var(--ok);font-size:14px;font-weight:600}
.sug .edit{width:100%;height:40px;border:1.3px solid var(--brand-d);border-radius:9px;padding:0 10px;font-size:15px;margin-top:8px}

/* ---------- 表单 ---------- */
.fgrp{padding:14px 16px 0}
.fgrp .gt{font-size:22px;font-weight:700;margin-bottom:3px}
.fgrp .gs{font-size:12.5px;color:var(--c-dim);margin-bottom:14px}
.fld{margin-bottom:16px}
.fld label{display:block;font-size:13.5px;color:#5b6472;margin-bottom:6px}
.fld label i{font-style:normal;color:var(--bad)}
.fld label .priv{color:var(--c-dim);font-size:11px;margin-left:4px}
.inp{
  width:100%;height:50px;border:1.3px solid #dfe3ea;border-radius:11px;padding:0 14px;
  font-size:16px;background:#fff;color:var(--c-txt);outline:none;
}
.inp:focus{border-color:var(--brand-d)}
.inp::placeholder{color:#b9c0cc}
.wrap{position:relative;display:flex;align-items:center;gap:8px}
.wrap .inp{flex:1}
.mic{
  width:46px;height:46px;flex:0 0 auto;border-radius:11px;border:1.3px solid #dfe3ea;background:#fff;
  font-size:19px;cursor:pointer;display:flex;align-items:center;justify-content:center;
}
.mic:active{background:#f0f2f6}
textarea.inp{height:auto;min-height:78px;padding:12px 14px;line-height:1.55;resize:none}
.pick{
  width:100%;height:50px;border:1.3px solid #dfe3ea;border-radius:11px;background:#fff;
  display:flex;align-items:center;padding:0 14px;font-size:16px;cursor:pointer;
}
.pick span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pick em{font-style:normal;color:#b9c0cc;font-size:13px;margin-left:8px}
.pick.filled{color:var(--c-txt)}
.tags{display:flex;gap:8px;flex-wrap:wrap}
.tag{border:1.3px solid #dfe3ea;background:#fff;border-radius:20px;padding:8px 14px;font-size:14px;cursor:pointer}
.tag.on{background:var(--brand-d);color:#fff;border-color:var(--brand-d)}
.slider{display:flex;gap:4px;margin-top:2px}
.slider div{flex:1;height:7px;border-radius:4px;background:#e6e9ef;cursor:pointer}
.slider div.on{background:var(--brand-d)}
.slbl{display:flex;justify-content:space-between;font-size:12px;color:var(--c-dim);margin-top:6px}
.addf{
  margin:6px 16px 16px;border:1.4px dashed var(--c-dash);border-radius:11px;padding:13px;
  text-align:center;color:var(--c-sub);font-size:14px;cursor:pointer;background:#fff;
}
.chk{display:flex;gap:10px;align-items:flex-start;background:#fff8e6;border:.8px solid #f0e2bd;border-radius:11px;padding:12px 13px;margin-top:4px}
.chk input{width:19px;height:19px;margin-top:2px;flex:0 0 auto;accent-color:var(--brand-d)}
.chk p{margin:0;font-size:13px;color:#7a5a12;line-height:1.55}

/* ---------- 预览 ---------- */
.hero{width:100%;aspect-ratio:1/1;position:relative;flex:0 0 auto;background:var(--c-soft)}
.hero img{width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:56px;background:linear-gradient(transparent,rgba(0,0,0,.28));pointer-events:none}
.hero .dots{position:absolute;bottom:10px;left:0;right:0;display:flex;justify-content:center;gap:6px;z-index:2}
.hero .dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.5)}
.hero .dots i.on{background:#fff;width:16px;border-radius:3px}
.pv{padding:14px 16px}
.pv h2{margin:0 0 4px;font-size:19px;font-weight:700}
.pv .m{font-size:13px;color:var(--c-sub)}
.vis{background:#fff;border-radius:12px;margin:12px;padding:4px 0}
.vo{display:flex;align-items:center;gap:12px;padding:13px 14px;cursor:pointer;border-bottom:.6px solid #f0f2f6}
.vo:last-child{border:none}
.vo .ic{width:34px;height:34px;border-radius:9px;background:var(--c-soft);display:flex;align-items:center;justify-content:center;font-size:17px;flex:0 0 auto}
.vo .tx{flex:1;min-width:0}
.vo .tx b{display:block;font-size:15px;font-weight:500}
.vo .tx s{display:block;text-decoration:none;font-size:12px;color:var(--c-dim);margin-top:2px}
.rad{width:21px;height:21px;border-radius:50%;border:1.6px solid #cfd5df;flex:0 0 auto;position:relative}
.rad.on{border-color:var(--brand-d);background:var(--brand-d)}
.rad.on::after{content:"";position:absolute;left:6px;top:3px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.warn{background:#f3f8f4;border:.8px solid #c9e3cf;color:#2c6b3d;border-radius:10px;margin:0 12px;padding:10px 13px;font-size:12.5px;line-height:1.55}

/* ---------- 结果 / 弹层 ---------- */
.res{padding:64px 30px;text-align:center}
.res .ic{font-size:60px;margin-bottom:14px}
.res h3{margin:0 0 8px;font-size:20px}
.res p{margin:0;font-size:14px;color:var(--c-sub);line-height:1.6}
.res .btn{margin-top:22px;max-width:260px;margin-left:auto;margin-right:auto}
.mask{position:absolute;inset:0;background:rgba(0,0,0,.42);z-index:40;display:flex;align-items:flex-end}
.sheet{width:100%;background:#fff;border-radius:18px 18px 0 0;padding:8px 0 calc(18px + var(--safe-b));max-height:78%;display:flex;flex-direction:column}
.sheet h4{margin:6px 0 4px;font-size:15px;text-align:center;color:var(--c-sub);font-weight:500}
.sheet .opts{overflow-y:auto;padding:4px 0}
.sheet .o{padding:14px 20px;font-size:17px;cursor:pointer;text-align:center}
.sheet .o.on{color:var(--brand-d);font-weight:600}
.sheet .o:active{background:#f5f6f9}
.sheet .o .od{font-size:12px;color:var(--c-dim);font-weight:400;margin-top:3px;line-height:1.5}
.sheet .cls{margin:8px 16px 0;height:46px;border:none;background:#f3f5f8;border-radius:11px;font-size:16px;cursor:pointer}

/* ---------- 详情（item） ---------- */
.detail-hero{width:100%;aspect-ratio:4/3;background:var(--c-soft);position:relative}
.detail-hero img{width:100%;height:100%;object-fit:cover}
.kv{background:#fff;border-radius:12px;margin:12px;padding:6px 0}
.kv .row{display:flex;gap:12px;padding:11px 14px;border-bottom:.6px solid #f0f2f6}
.kv .row:last-child{border:none}
.kv .k{font-size:13px;color:var(--c-sub);width:96px;flex:0 0 auto}
.kv .v{font-size:14.5px;flex:1;min-width:0;word-break:break-word}
.ribbon{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:3px 10px;border-radius:20px;font-weight:600}
.ribbon.ok{background:#e7f6ec;color:#2c6b3d}
.ribbon.pending{background:#fff5e0;color:#8a6100}
.ribbon.none{background:var(--c-soft);color:var(--c-sub)}
.block{background:#fff;border-radius:12px;margin:12px;padding:14px}
.block h3{margin:0 0 10px;font-size:15px}

/* ---------- 配额面板 ---------- */
.quota-card{background:#fff;border-radius:14px;margin:12px;padding:16px;box-shadow:0 1px 3px rgba(20,25,35,.06)}
.quota-card h3{margin:0 0 4px;font-size:15px}
.quota-num{font-size:26px;font-weight:700}
.quota-num small{font-size:13px;font-weight:400;color:var(--c-sub)}
.bar{height:10px;border-radius:6px;background:#eef0f3;overflow:hidden;margin:10px 0 6px}
.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--brand-d));border-radius:6px}
.bar.low i{background:linear-gradient(90deg,#e3b341,#c9962a)}
.bar.full i{background:linear-gradient(90deg,#f85149,#d23b34)}
.qrow{display:flex;justify-content:space-between;font-size:12.5px;color:var(--c-sub);margin-top:4px}
.qgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:0 12px}
.qstat{background:#fff;border-radius:12px;padding:14px;text-align:center;box-shadow:0 1px 3px rgba(20,25,35,.06)}
.qstat .n{font-size:20px;font-weight:700}
.qstat .l{font-size:12px;color:var(--c-sub);margin-top:2px}

/* ---------- 展馆 ---------- */
.exh{background:#fff;border-radius:12px;margin:10px 12px;overflow:hidden;display:flex;gap:12px;padding:12px;box-shadow:0 1px 3px rgba(20,25,35,.06);cursor:pointer}
.exh:active{background:#f3f5f8}
.exh .cv{width:76px;height:76px;border-radius:9px;overflow:hidden;background:var(--c-soft);flex:0 0 auto}
.exh .cv img{width:100%;height:100%;object-fit:cover}
.exh .meta{flex:1;min-width:0}
.exh .t{font-size:15px;font-weight:600}
.exh .s{font-size:12px;color:var(--c-sub);margin-top:4px}

/* ---------- toast ---------- */
.toast{
  position:absolute;left:50%;top:calc(70px + var(--safe-t));transform:translateX(-50%);
  background:rgba(28,32,40,.93);color:#fff;font-size:13.5px;padding:10px 18px;border-radius:22px;
  z-index:60;white-space:nowrap;max-width:88%;text-align:center;animation:tin .2s ease;
}
.toast.err{background:rgba(180,40,35,.95)}
@keyframes tin{from{opacity:0;transform:translate(-50%,-6px)}}

/* ==========================================================================
   开通引导页（onboard）：默认不开通，用户确认后才写入
   全屏覆盖 #app 之上，自带滚动；与 tabbar 互斥（引导页期间不渲染 tabbar）
   ========================================================================== */
#app > .onbd{
  position:absolute; inset:0; z-index:80; overflow-y:auto; -webkit-overflow-scrolling:touch;
  background:linear-gradient(180deg,#f7f8fa 0%,#eef1f6 100%);
  padding:calc(24px + var(--safe-t)) 18px calc(24px + var(--safe-b));
  display:flex; align-items:flex-start; justify-content:center;
}
.onbd-card{width:100%;max-width:420px;display:flex;flex-direction:column;gap:16px;padding-bottom:10px}
.onbd-top{text-align:center;padding:8px 0 4px}
.onbd-logo{
  width:66px;height:66px;margin:0 auto 14px;border-radius:20px;display:flex;align-items:center;justify-content:center;
  font-size:34px;background:#fff;border:.6px solid var(--c-line);box-shadow:0 6px 18px rgba(15,17,21,.06);
}
.onbd-top h2{margin:0;font-size:22px;font-weight:700;color:var(--c-txt);letter-spacing:.5px}
.onbd-sub{margin:6px 0 0;font-size:13px;color:var(--c-sub)}

.onbd-rights{background:#fff;border-radius:var(--r);border:.6px solid var(--c-line);overflow:hidden}
.onbd-r{display:flex;gap:12px;padding:14px 16px;align-items:flex-start}
.onbd-r + .onbd-r{border-top:.6px solid var(--c-line)}
.onbd-ri{width:36px;height:36px;flex:0 0 auto;border-radius:10px;background:var(--c-soft);display:flex;align-items:center;justify-content:center;font-size:19px}
.onbd-rt{display:flex;flex-direction:column;gap:2px;min-width:0}
.onbd-rt b{font-size:15px;font-weight:600;color:var(--c-txt)}
.onbd-rt span{font-size:12.5px;line-height:1.5;color:var(--c-sub)}

.onbd-gift{
  display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:var(--r);
  background:linear-gradient(135deg,#fdf6e6,#f7ecd4);border:.6px solid #ecd9ab;
}
.onbd-tag{
  flex:0 0 auto;font-size:11px;padding:3px 8px;border-radius:6px;color:#6b4c14;
  background:var(--brand);color:#fff;font-weight:600;
}
.onbd-gt{font-size:13px;color:#6b4c14;font-weight:600}

.onbd-agree{display:flex;gap:9px;align-items:flex-start;padding:2px 4px;cursor:pointer;user-select:none}
.onbd-agree input{margin:2px 0 0;width:16px;height:16px;flex:0 0 auto;accent-color:var(--brand-d)}
.onbd-agree span{font-size:12.5px;line-height:1.6;color:var(--c-sub)}

.onbd-btn{
  margin-top:4px;height:48px;border:0;border-radius:24px;font-size:16px;font-weight:600;color:#fff;
  background:linear-gradient(135deg,var(--brand),var(--brand-d));box-shadow:0 8px 18px rgba(168,132,63,.26);
}
.onbd-btn:active{opacity:.88}
.onbd-btn:disabled{background:#d7dbe2;color:#fff;box-shadow:none}
.onbd-skip{height:42px;border:0;background:transparent;font-size:13.5px;color:var(--c-sub)}
.onbd-skip:active{opacity:.6}

/* 即将上线角标（引导页权益、详情页按钮等） */
.soon-tag{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600;line-height:1.5;color:#a9722b;background:#fdf2e0;border:1px solid #f3dcb8;vertical-align:middle}

/* 引导页可点开的协议链接 */
.onbd-link{color:var(--brand-d);text-decoration:none;border-bottom:1px solid rgba(127,90,255,.35);cursor:pointer}
.onbd-link:active{opacity:.7}

/* 协议全文弹层（复用 .mask） */
.mask.agr{align-items:center;justify-content:center;background:rgba(0,0,0,.5);z-index:100}
.agr-box{width:100%;max-width:560px;max-height:82%;background:#fff;border-radius:16px;display:flex;flex-direction:column;overflow:hidden;margin:0 16px}
.agr-h{display:flex;align-items:center;justify-content:space-between;padding:16px 18px 12px;border-bottom:1px solid var(--c-line)}
.agr-h b{font-size:17px;font-weight:700;color:var(--c-txt)}
.agr-x{width:30px;height:30px;border:none;background:#f3f5f8;border-radius:50%;font-size:15px;color:var(--c-sub);cursor:pointer;line-height:1}
.agr-x:active{opacity:.7}
.agr-body{padding:14px 18px;overflow-y:auto;font-size:14px;line-height:1.9;color:var(--c-txt);white-space:pre-wrap;word-break:break-word}
.agr-f{padding:10px 18px 14px;font-size:12px;color:var(--c-dim);text-align:center;border-top:1px solid var(--c-line)}

/* 详情页上链按钮置灰（存证未上线） */
.rowact.disabled{opacity:.5;filter:grayscale(.4);cursor:not-allowed;pointer-events:none}

/* 全站导航让位（/assets/nav.js 固定底部，避免压住藏品 tabbar）
   —— 必须保留：nav.js 会把真实导航高度写进 html 的 --nav-h */
#app{padding-bottom:var(--nav-h,0px);box-sizing:border-box}

/* ---------- 藏品库：关键词检索条（后端 chinese 分词检索） ---------- */
.searchwrap{position:sticky;top:0;z-index:18;background:var(--c-bg);padding:8px 12px 2px}
.searchbar{
  display:flex;align-items:center;gap:8px;height:44px;padding:0 12px;background:#fff;
  border:.8px solid var(--c-line);border-radius:12px;box-shadow:0 1px 3px rgba(20,25,35,.05);
}
.searchbar:focus-within{border-color:var(--brand-d);box-shadow:0 2px 8px rgba(168,132,63,.14)}
.sb-ic{font-size:15px;color:var(--c-dim);flex:0 0 auto}
.sb-inp{
  flex:1;min-width:0;height:42px;border:0;outline:none;background:transparent;
  font-size:15px;color:var(--c-txt);-webkit-appearance:none;appearance:none;
}
.sb-inp::-webkit-search-cancel-button{-webkit-appearance:none;display:none}
.sb-inp::placeholder{color:#b9c0cc}
.sb-clr{
  width:22px;height:22px;flex:0 0 auto;border-radius:50%;background:#eceff4;color:#8b93a3;
  font-size:12px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;
}
.sb-clr:active{background:#e2e6ee}

/* ---------- 极速录入 · 多图选择（qc 前缀，避免与既有 .qgrid 冲突） ---------- */
.qcgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:14px 16px}
.qcthumb{position:relative;aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--c-soft);box-shadow:0 1px 3px rgba(20,25,35,.06);animation:qcp .25s ease}
@keyframes qcp{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}
.qcthumb img{width:100%;height:100%;object-fit:cover}
.qcthumb .qcrb{position:absolute;left:0;top:0;background:rgba(0,0,0,.55);color:#fff;font-size:11px;padding:2px 8px;border-bottom-right-radius:9px}
.qcthumb .qcrm{position:absolute;right:5px;top:5px;width:22px;height:22px;border-radius:50%;background:rgba(0,0,0,.5);color:#fff;font-size:15px;line-height:22px;text-align:center;cursor:pointer}
.qcthumb .qcrm:active{background:rgba(0,0,0,.75)}
.qcadd{aspect-ratio:1;border:1.6px dashed var(--c-dash);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#b9c0cc;font-size:13px;gap:3px;cursor:pointer;background:#fff}
.qcadd:active{background:#f3f5f8}
.qcadd .qcpl{font-size:30px;line-height:1}
/* 极速录入 · 按点位传图槽位（20260924h） */
.qslot{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid #f2f4f7}
.qslabel{width:56px;flex:none;font-size:14px;color:#2b2f36;text-align:left;line-height:1.3}
.qslabel .req{display:block;font-style:normal;font-size:11px;color:#e64340;margin-top:2px}
.qslabel .opt{display:block;font-style:normal;font-size:11px;color:#9aa1ab;margin-top:2px}
.qsbody{flex:1;min-width:0;display:flex;justify-content:center}
.qsbody .qcthumb{width:74px;height:74px;margin:0}
.qsbody .qcadd{width:74px;height:74px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1.5px dashed #cfd6e0;border-radius:12px;color:#9aa1ab;font-size:12px;gap:2px}
.qsacts{display:flex;gap:6px;flex:none}
.qsacts .mini{font-size:12px;padding:7px 9px;border:1px solid #dfe3ea;border-radius:10px;background:#fff;color:#333;line-height:1}
.qsacts .mini.ghost{background:#f5f7fa}

/* ============================================================================
   本轮 UI 升级（2026-09-26）
   ----------------------------------------------------------------------------
   1) 变量收口：删掉无人引用的暗色孤儿变量（--bg/--panel/--line/--txt/--dim），
      保留实际在用的单一语义层；index.html 的 theme-color 也改成了 --c-bg 同值，
      此前它是 #0f1115，会让手机端状态栏和界面割裂。
   2) 组件化：新增 pill / rowact / formcard / fctl / switch / media-grid / tick
      等类，替掉原先散在各屏里的内联 style（如 padding:14px 16px 4px）。
   3) 微交互：按压反馈、选中态、过渡曲线统一。
   ========================================================================== */

/* ---------- 按钮 ---------- */
.btn.danger{background:var(--bad)}
.btn.ghost.danger{background:#fff;color:var(--bad);border-color:#f3c9c9}
.btn-row{margin-top:8px}

/* ---------- 状态徽标 pill ---------- */
.pills{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}
.pill{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;line-height:1;
  padding:5px 9px;border-radius:20px;background:var(--c-soft);color:var(--c-sub);
  white-space:nowrap;font-weight:500}
.pill.vis-priv{background:#eef1f6;color:#5b6472}
.pill.vis-link{background:#eef4ff;color:#2b5fb0}
.pill.vis-pub{background:#e9f6ec;color:#2c6b3d}
.pill.nt-none{background:#f2f4f8;color:#8b93a3}
.pill.nt-ing{background:#fff7e6;color:#8a6100}
.pill.nt-ok{background:#e9f6ec;color:#2c6b3d}
.pill.nt-bad{background:#fdf0ef;color:#9c3a3a}
.pill.warn{background:#fdf0ef;color:#9c3a3a}

/* ---------- 动作行 ---------- */
.acts{background:var(--c-card);border-radius:var(--r);margin:12px;overflow:hidden;box-shadow:var(--sh-1)}
.rowact{display:flex;align-items:center;gap:11px;padding:14px 15px;cursor:pointer;
  border-bottom:.6px solid #f0f2f6;transition:background .18s var(--ease)}
.rowact:last-child{border-bottom:none}
.rowact:active{background:#f5f6f9}
.rowact i{font-style:normal;font-size:19px;width:26px;text-align:center;flex:0 0 auto}
.rowact .ra-t{flex:1;min-width:0}
.rowact .ra-t b{display:block;font-size:15px;font-weight:600;line-height:1.35}
.rowact .ra-t span{display:block;font-size:12px;color:var(--c-sub);margin-top:2px;line-height:1.5}
.rowact em{font-style:normal;color:var(--c-dash);font-size:19px;flex:0 0 auto}
.rowact.danger b{color:var(--bad)}

/* ---------- 详情页头图与标题区 ---------- */
.detail-hero{aspect-ratio:4/3;overflow:hidden;background:linear-gradient(160deg,#eef1f6,#dfe4ec)}
.hero-img{width:100%;height:100%;object-fit:cover;display:block}
.hero-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:76px;opacity:.5}
.detail-head{padding:16px 16px 4px}
.detail-head h2{margin:0;font-size:21px;font-weight:700;line-height:1.35;letter-spacing:-.2px}
.exh-sub{padding:2px 16px 0;font-size:14.5px;color:var(--c-sub)}
.exh-intro{padding:10px 16px 0;font-size:14px;line-height:1.75;color:#4a5260;white-space:pre-wrap}
.cardpad{background:var(--c-card);border-radius:var(--r);margin:12px;padding:14px;box-shadow:var(--sh-1)}
.block-h{font-size:14px;font-weight:700;margin:0 0 10px;display:flex;align-items:baseline;gap:8px}
.block-h small{font-size:11.5px;color:var(--c-dim);font-weight:400}

/* ---------- 媒体九宫格 ---------- */
.media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.mg{position:relative;aspect-ratio:1;border-radius:var(--r-sm);overflow:hidden;background:var(--c-soft);cursor:pointer}
.mg img{width:100%;height:100%;object-fit:cover;display:block}
.mg:active{opacity:.86}
.mg .mg-t{position:absolute;left:0;right:0;bottom:0;padding:4px 6px;font-size:10.5px;color:#fff;
  background:linear-gradient(transparent,rgba(0,0,0,.62));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.phico{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:30px;opacity:.45}

/* ---------- 表单 ---------- */
.formcard{background:var(--c-card);border-radius:var(--r);margin:12px;padding:14px 15px;box-shadow:var(--sh-1)}
.frow{margin-bottom:14px}
.frow:last-child{margin-bottom:4px}
.frow>label{display:block;font-size:13px;color:#5b6472;margin-bottom:7px}
.frow>label .req{font-style:normal;color:var(--bad);margin-left:3px}
.frow>label u{text-decoration:none;font-size:11px;color:var(--c-dim);margin-left:5px}
.fctl{width:100%;min-height:48px;border:1.3px solid #dfe3ea;border-radius:var(--r-sm);
  padding:11px 13px;font-size:16px;background:#fff;color:var(--c-txt);outline:none;
  transition:border-color .18s var(--ease),box-shadow .18s var(--ease)}
.fctl:focus{border-color:var(--brand-d);box-shadow:0 0 0 3px rgba(168,132,63,.10)}
.fctl::placeholder{color:#b9c0cc}
textarea.fctl{min-height:84px;line-height:1.6;resize:vertical}
.frow.switchrow{display:flex;align-items:center;justify-content:space-between;gap:12px}
.frow.switchrow>label{margin-bottom:0}
.switchwrap{display:flex;align-items:center;gap:9px}
.switch{position:relative;display:inline-block;width:50px;height:30px;flex:0 0 auto}
.switch input{opacity:0;width:0;height:0;position:absolute}
.switch span{position:absolute;inset:0;background:#dfe3ea;border-radius:30px;
  transition:background .22s var(--ease);cursor:pointer}
.switch span::after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;
  border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);
  transition:transform .22s var(--ease)}
.switch input:checked+span{background:var(--brand-d)}
.switch input:checked+span::after{transform:translateX(20px)}
.sw-t{font-size:13.5px;color:var(--c-sub);min-width:28px}
.sliderwrap{display:flex;align-items:center;gap:12px}
.sliderwrap input[type=range]{flex:1;accent-color:var(--brand-d)}
.sliderwrap b{font-size:14px;min-width:32px;text-align:right}
.formcard .hint{padding:2px 0 0}

/* ---------- 多选标签 ---------- */
.formcard .chips,.cardpad .chips{display:flex;flex-wrap:wrap;gap:8px;padding:2px 0;overflow:visible}
.formcard .chip,.cardpad .chip{border-radius:20px;padding:8px 14px;font-size:13.5px;
  border:1.3px solid #e3e6ec;background:#fff;color:#4a5260;cursor:pointer;
  transition:all .18s var(--ease);user-select:none;white-space:nowrap}
.formcard .chip.on,.cardpad .chip.on{background:var(--brand-d);border-color:var(--brand-d);color:#fff;font-weight:500}
.formcard .chip:active,.cardpad .chip:active{transform:scale(.96)}

/* ---------- 建展厅步骤条 ---------- */
.wizsteps{display:flex;align-items:center;justify-content:center;padding:14px 16px 6px}
.wizsteps .sp{width:26px;height:26px;border-radius:50%;background:#fff;border:1.4px solid #e3e6ec;
  color:var(--c-dim);font-size:13px;font-style:normal;display:flex;align-items:center;
  justify-content:center;transition:all .22s var(--ease)}
.wizsteps .sp.on{background:var(--brand-d);border-color:var(--brand-d);color:#fff;font-weight:600}
.wizsteps .sp.done{background:#e9f6ec;border-color:#c9e3cf;color:#2c6b3d}
.wizsteps i{flex:0 0 34px;height:1.4px;background:#e3e6ec;display:block}

/* ---------- 多选宫格 / 封面角标 ---------- */
.tile.picked{outline:2px solid var(--brand-d);outline-offset:-2px}
.tick{position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:50%;
  background:var(--brand-d);color:#fff;font-size:13px;display:flex;align-items:center;
  justify-content:center;box-shadow:0 1px 4px rgba(0,0,0,.2)}
.tagline{margin-top:7px;display:flex;gap:6px;flex-wrap:wrap}
.tflag{position:absolute;top:6px;left:6px;width:22px;height:22px;border-radius:50%;
  background:rgba(0,0,0,.42);color:#fff;font-size:11px;display:flex;align-items:center;justify-content:center}
.tile{cursor:pointer;transition:transform .16s var(--ease)}
.tile:active{transform:scale(.975)}
.card{transition:background .18s var(--ease)}

/* ---------- 回收站 ---------- */
.trash-card{flex-wrap:wrap}
.trash-card .meta{flex:1;min-width:0}
.tbtns{width:100%;display:flex;gap:8px;margin-top:10px}
.tbtns .btn{flex:1;height:38px;font-size:14px}

/* ---------- 分享设置 / 公开访问页 ---------- */
.linkbox{background:var(--c-soft);border-radius:var(--r-sm);padding:11px 12px;margin-top:2px}
.linkbox code{display:block;font-size:12.5px;color:#4a5260;word-break:break-all;line-height:1.6;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.pub-foot{padding:16px 16px calc(24px + var(--safe-b));text-align:center}
.fineprint{font-size:12px;color:var(--c-dim);line-height:1.7}
.hd.public .back{color:#5b6472}
.pub-item{background:var(--c-card);border-radius:var(--r);overflow:hidden;margin-bottom:12px;box-shadow:var(--sh-1)}
.pi-cv{position:relative;width:100%;aspect-ratio:16/10;background:var(--c-soft);overflow:hidden}
.pi-cv img{width:100%;height:100%;object-fit:cover;display:block;-webkit-user-drag:none;user-select:none}
.pi-body{padding:12px 14px 14px}
.pi-t{font-size:16px;font-weight:600;margin-bottom:8px;line-height:1.4}
.pi-row{display:flex;gap:12px;padding:6px 0;font-size:13px;border-top:.6px solid #f0f2f6}
.pi-row span{width:84px;flex:0 0 auto;color:var(--c-sub)}
.pi-row b{flex:1;min-width:0;font-weight:500;word-break:break-word}
/* 水印：提高盗用成本（挡不住截图，原图也未被改动） */
.wm{position:absolute;inset:0;pointer-events:none;background-repeat:repeat}

/* ---------- 忙碌遮罩 / 图片预览 / 确认弹层 ---------- */
.busy{position:absolute;inset:0;background:rgba(247,248,250,.74);z-index:70;display:flex;
  flex-direction:column;align-items:center;justify-content:center;gap:14px}
.busy-t{font-size:14px;color:#5b6472}
.mask.preview{align-items:center;justify-content:center;background:rgba(0,0,0,.9);z-index:60}
.mask.preview img{max-width:100%;max-height:100%;object-fit:contain}
.pv-x{position:absolute;top:calc(14px + var(--safe-t));right:16px;color:#fff;font-size:22px;padding:8px;cursor:pointer}
.sheet.confirm{padding:14px 16px calc(18px + var(--safe-b))}
.sheet.confirm h4{font-size:16.5px;color:var(--c-txt);font-weight:600}
.sheet.confirm.danger h4{color:var(--bad)}
.cdesc{font-size:13.5px;color:var(--c-sub);line-height:1.65;margin:6px 4px 12px;text-align:center}
.cword{font-size:12.5px;color:var(--c-sub);margin:0 4px 8px;text-align:center}
.cword b{color:var(--c-txt)}
.sheet.confirm .fctl{margin-bottom:12px}
.sheet.confirm .btn-row{margin-top:4px}

/* ---------- 其它 ---------- */
.hd2{display:flex;align-items:center;gap:8px;padding:10px 14px;background:var(--c-card)}
.hd2 h1{flex:1;font-size:17px;font-weight:600;margin:0}
.hd2 .back{font-size:24px;color:#5b6472;cursor:pointer;width:28px}
.tipblk{display:block;line-height:1.75;color:#5b6472;font-size:12.5px;padding:2px 0}
.exh .tagline{margin-top:7px;display:flex}
.empty .mini{margin:0}

/* ---------- tabbar 选中指示线 + FAB 热区 ---------- */
.tabbar{position:relative}
.tab{position:relative;padding:7px 0 5px;transition:color .2s var(--ease)}
.tab::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:0;height:2.5px;border-radius:2px;background:var(--brand-d);transition:width .24s var(--ease)}
.tab.on::before{width:22px}
.tab i{transition:transform .2s var(--ease)}
.tab.on i{transform:translateY(-1px)}
.fab{width:54px;height:54px;font-size:27px;line-height:52px}

/* ---------- 危险操作区（与常规操作分组隔开，避免误触） ---------- */
.acts.danger-zone{margin-top:20px}
.acts.danger-zone::before{content:"危险操作";display:block;padding:12px 15px 6px;
  font-size:11.5px;letter-spacing:.5px;color:#a87070}

/* 全站页脚（#relic-footer）内徽标回归内联：全局 img{display:block} 会把公安备案徽标变块级导致错位 */
#relic-footer .relic-beian-ico{display:inline-block;max-width:none;width:14px;height:14px;vertical-align:-2px;margin-right:4px;}
#relic-footer .relic-beian a{display:inline;}
