/* ============================================================
   收藏盒子（curio，v0.55.47）—— 白色陈列：物件照片带落地阴影，
   衬线名称 + 小字题注；选中一律紫色实色小点；图标按钮无框无底
   ============================================================ */
.cu-screen { background: #fff; }
.cu-screen > .app-header { display: none; }
.cu-app { --ink: #1d1d1f; --sub: #8e8e93; --faint: #b8b8bd; --tile: #f5f5f7; --dot: #8a7ba8;
  flex: 1; min-height: 0; display: flex; flex-direction: column; position: relative; background: #fff; color: var(--ink);
  font-family: -apple-system, "PingFang SC", "Noto Sans SC", sans-serif; }

/* 顶栏 */
.cu-top { display: flex; align-items: center; gap: 6px; padding: calc(16px + env(safe-area-inset-top, 0px)) 14px 6px; flex: none; }
.cu-tsp { flex: 1; }
.cu-ib { width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; color: #8e8e93; cursor: pointer; }
.cu-ib svg { width: 23px; height: 23px; }
.cu-ib.ghost { visibility: hidden; }
.cu-tt { flex: 1; text-align: center; font-size: 16px; font-weight: 600; letter-spacing: .5px; }
.cu-tx { font-size: 15px; color: var(--ink); font-weight: 500; padding: 6px 8px; cursor: pointer; }
.cu-scroll { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; padding: 0 18px calc(40px + env(safe-area-inset-bottom, 0px)); }

/* 刊头 */
.cu-hero { padding: 6px 2px 18px; }
.cu-lat { font-family: "SereinIt", Georgia, serif; font-style: italic; font-size: 17px; color: #a9a9af; letter-spacing: .5px; }
.cu-h1 { margin: 2px 0 0; font-family: "SereinSerif", Georgia, serif; font-weight: 600; font-size: 34px; letter-spacing: 3px; line-height: 1.2; }
.cu-hero.sm .cu-h1 { font-size: 28px; }
.cu-sub { margin-top: 8px; font-size: 13px; color: var(--sub); line-height: 1.7; }

/* 盒子的主人 */
.cu-owners { display: flex; gap: 16px; overflow-x: auto; padding: 4px 2px 14px; margin: 0 -18px; padding-left: 20px; padding-right: 20px; scrollbar-width: none; }
.cu-owners::-webkit-scrollbar { display: none; }
.cu-ow { position: relative; flex: none; width: 52px; display: flex; flex-direction: column; align-items: center; gap: 6px; cursor: pointer; }
.cu-ow span { font-size: 11.5px; color: var(--sub); max-width: 58px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cu-ow em { width: 5px; height: 5px; border-radius: 50%; background: transparent; margin-top: -2px; }
.cu-ow.on span { color: var(--ink); font-weight: 500; }
.cu-ow.on em { background: var(--dot); }
.cu-ow .cu-av { box-shadow: 0 6px 14px -8px rgba(0,0,0,.35); }
.cu-ow:not(.on) .cu-av { opacity: .72; }
.cu-nd { position: absolute; top: 1px; right: 2px; width: 8px; height: 8px; border-radius: 50%; background: var(--dot); box-shadow: 0 0 0 2px #fff; }
.cu-av { display: inline-block; border-radius: 50%; overflow: hidden; background: #ececf0; flex: none; }
.cu-av img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cu-av i { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-style: normal; font-family: "SereinSerif", Georgia, serif; color: #8e8e93; }

/* 类别：文字 + 上标件数 */
.cu-cats { display: flex; gap: 18px; overflow-x: auto; padding: 2px 2px 16px; scrollbar-width: none; }
.cu-cats::-webkit-scrollbar { display: none; }
.cu-cats span { flex: none; font-size: 14px; color: #a3a3a9; cursor: pointer; white-space: nowrap; }
.cu-cats span.on { color: var(--ink); font-weight: 600; }
.cu-cats sup { font-family: "SereinIt", Georgia, serif; font-style: italic; font-size: 11px; margin-left: 2px; font-weight: 400; color: #b0b0b6; }

/* 陈列墙 */
.cu-wall { display: flex; gap: 14px; align-items: flex-start; }
.cu-col { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 22px; }
.cu-it { position: relative; cursor: pointer; }
.cu-ph { position: relative; border-radius: 18px; overflow: hidden; background: var(--tile);
  box-shadow: 0 22px 26px -22px rgba(0,0,0,.45), 0 1px 2px rgba(0,0,0,.04); }
.cu-ph img { display: block; width: 100%; max-height: 260px; min-height: 120px; object-fit: cover; }
.cu-ph.ty { aspect-ratio: 4 / 5; padding: 14px 14px 16px; display: flex; flex-direction: column; justify-content: flex-end; background: linear-gradient(180deg, #fafafb, #f1f1f4); }
.cu-ph.ty b { font-family: "SereinSerif", Georgia, serif; font-size: 19px; font-weight: 600; line-height: 1.35; letter-spacing: 1px; }
.cu-ph.ty em { font-style: normal; font-size: 11.5px; color: var(--sub); line-height: 1.6; margin-top: 6px; }
.cu-q { position: absolute; left: 12px; top: 2px; font-family: Georgia, serif; font-size: 54px; color: #dcdce1; line-height: 1; }
.cu-dot { position: absolute; top: 10px; right: 10px; width: 7px; height: 7px; border-radius: 50%; background: var(--dot); box-shadow: 0 0 0 2px #fff; }
.cu-cap { display: flex; align-items: flex-start; justify-content: space-between; gap: 6px; padding: 11px 2px 0; }
.cu-cap > div:first-child { min-width: 0; }
.cu-cap b { display: block; font-family: "SereinSerif", Georgia, serif; font-size: 14.5px; font-weight: 600; letter-spacing: .5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cu-cap span { display: block; font-size: 11px; color: var(--faint); margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cu-cw { display: flex; flex: none; padding-top: 2px; }
.cu-cw .cu-av { box-shadow: 0 0 0 1.5px #fff; }
.cu-cw .cu-av + .cu-av { margin-left: -6px; }

.cu-ck { position: absolute; top: 10px; right: 10px; width: 22px; height: 22px; border-radius: 50%; background: rgba(255,255,255,.88); box-shadow: 0 1px 4px rgba(0,0,0,.18); }
.cu-it.on .cu-ck::after { content: ""; position: absolute; inset: 7px; border-radius: 50%; background: var(--dot); }
.cu-it.on .cu-ph { opacity: .82; }
.cu-app .cu-it:has(.cu-ck) .cu-dot { display: none; }

/* 空状态 */
.cu-empty { padding: 56px 0 30px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.cu-box { width: 64px; height: 64px; color: #c7c7cc; }
.cu-box svg { width: 100%; height: 100%; stroke-width: 1.6; }
.cu-empty p { margin: 14px 0 22px; font-size: 14px; color: var(--sub); }
.cu-more { display: flex; justify-content: center; padding: 30px 0 6px; }

/* 主按钮：浅灰石墨胶囊（非纯黑） */
.cu-cta { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 46px; padding: 0 26px; border-radius: 23px;
  background: #3a3a3c; color: #fff; font-size: 15px; font-weight: 500; letter-spacing: 1px; cursor: pointer;
  box-shadow: 0 10px 22px -12px rgba(0,0,0,.45); }
.cu-cta svg { width: 18px; height: 18px; }
.cu-cta.ghost { background: #f2f2f4; color: var(--ink); box-shadow: none; height: 40px; font-size: 14px; }
.cu-cta.wide { display: flex; margin: 26px 0 8px; }
.cu-cta.off { opacity: .4; pointer-events: none; }
.cu-spin { width: 22px; height: 22px; border-radius: 50%; border: 2px solid #e5e5ea; border-top-color: #8e8e93; animation: cu-rot .8s linear infinite; }
@keyframes cu-rot { to { transform: rotate(360deg); } }

/* 多选底栏 */
.cu-pickbar { position: absolute; left: 14px; right: 14px; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); display: flex; align-items: center; justify-content: space-between;
  padding: 8px 8px 8px 20px; border-radius: 30px; background: rgba(255,255,255,.92); box-shadow: 0 10px 30px -10px rgba(0,0,0,.25), 0 0 0 .5px rgba(0,0,0,.06); }
.cu-pickbar span { font-size: 14px; color: var(--sub); }
.cu-pickbar b { color: var(--ink); font-family: "SereinIt", Georgia, serif; font-style: italic; font-size: 18px; font-weight: 400; margin: 0 2px; }
.cu-pickbar .cu-cta { height: 42px; padding: 0 22px; }

/* 物品页 */
.cu-scroll.item { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
.cu-stage { margin: 4px 6px 0; border-radius: 22px; overflow: hidden; background: var(--tile);
  box-shadow: 0 34px 40px -32px rgba(0,0,0,.5), 0 1px 2px rgba(0,0,0,.04); }
.cu-stage img { display: block; width: 100%; max-height: 440px; object-fit: contain; background: #f7f7f9; }
.cu-stage.ty { position: relative; aspect-ratio: 1 / 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 30px;
  background: linear-gradient(180deg, #fbfbfc, #f0f0f3); }
.cu-stage.ty .cu-q { left: 22px; top: 10px; font-size: 90px; }
.cu-stage.ty b { font-family: "SereinSerif", Georgia, serif; font-size: 28px; font-weight: 600; letter-spacing: 3px; line-height: 1.4; }
.cu-stage.ty p { margin: 12px 0 0; font-size: 13px; color: var(--sub); }
.cu-name { margin: 26px 2px 0; font-family: "SereinSerif", Georgia, serif; font-size: 26px; font-weight: 600; letter-spacing: 2px; line-height: 1.35; }
.cu-by { display: flex; align-items: center; gap: 7px; margin: 10px 2px 0; font-size: 12.5px; color: var(--sub); }
.cu-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; margin: 22px 2px 0; padding: 16px 0; border-top: .5px solid rgba(0,0,0,.08); border-bottom: .5px solid rgba(0,0,0,.08); }
.cu-facts div { min-width: 0; }
.cu-facts span { display: block; font-size: 11px; color: var(--faint); letter-spacing: 2px; }
.cu-facts b { display: block; margin-top: 4px; font-size: 14.5px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cu-note { margin: 18px 2px 0; font-family: "SereinSerif", Georgia, serif; font-size: 15px; line-height: 1.95; color: #3a3a3e; text-align: justify; }
.cu-lab { margin: 30px 2px 12px; font-size: 12px; color: var(--faint); letter-spacing: 3px; }
.cu-lab sup { font-family: "SereinIt", Georgia, serif; font-style: italic; letter-spacing: 0; margin-left: 3px; font-size: 12px; }
.cu-cms { display: flex; flex-direction: column; gap: 16px; }
.cu-cm { display: flex; gap: 10px; align-items: flex-start; }
.cu-cm > div { flex: 1; min-width: 0; }
.cu-cmh { display: flex; align-items: baseline; gap: 8px; }
.cu-cmh b { font-size: 13px; font-weight: 600; }
.cu-cmh span { font-size: 11px; color: var(--faint); }
.cu-cmt { margin-top: 4px; font-size: 14.5px; line-height: 1.7; color: #2c2c2e; word-break: break-word; white-space: pre-wrap; }
.cu-cmt.emo { font-size: 26px; line-height: 1.3; }
.cu-cm.me .cu-cmt { color: #48484c; }
.cu-act { align-self: center; font-size: 12px; color: var(--sub); padding: 6px 14px; border-radius: 14px; background: #f5f5f7; letter-spacing: .5px; }
.cu-none { font-size: 13px; color: var(--faint); padding: 2px; }
.cu-typing { display: flex; gap: 4px; padding: 6px 4px; }
.cu-typing i { width: 6px; height: 6px; border-radius: 50%; background: #c7c7cc; animation: cu-ty 1.1s infinite ease-in-out; }
.cu-typing i:nth-child(2) { animation-delay: .15s; }
.cu-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes cu-ty { 0%, 60%, 100% { opacity: .35; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }
.cu-askrow { display: flex; gap: 16px; overflow-x: auto; padding: 2px 2px 6px; scrollbar-width: none; }
.cu-askrow::-webkit-scrollbar { display: none; }
.cu-ask { flex: none; display: flex; flex-direction: column; align-items: center; gap: 6px; cursor: pointer; width: 50px; }
.cu-ask span { font-size: 11px; color: var(--sub); max-width: 56px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cu-input { position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: flex-end; gap: 8px;
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px)); background: rgba(255,255,255,.96); box-shadow: 0 -.5px 0 rgba(0,0,0,.06); }
.cu-input textarea { flex: 1; min-height: 42px; max-height: 110px; resize: none; border: none; outline: none; border-radius: 21px; background: #f3f3f5;
  padding: 10px 16px; font-size: 16px; line-height: 22px; font-family: inherit; color: var(--ink); }
.cu-send { width: 42px; height: 42px; flex: none; display: flex; align-items: center; justify-content: center; color: #8e8e93; cursor: pointer; }
.cu-send svg { width: 24px; height: 24px; }
.cu-full { position: absolute; inset: 0; z-index: 30; background: rgba(255,255,255,.97); display: flex; align-items: center; justify-content: center; padding: 20px; }
.cu-full img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 12px; box-shadow: 0 30px 50px -30px rgba(0,0,0,.5); }

/* 编辑页 */
.cu-scroll.ed { padding-top: 6px; }
.cu-pic { margin: 6px 0 4px; border-radius: 22px; background: var(--tile); min-height: 200px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  color: #a3a3a9; cursor: pointer; overflow: hidden; }
.cu-pic.has { background: #f7f7f9; box-shadow: 0 26px 30px -26px rgba(0,0,0,.45); }
.cu-pic img { display: block; width: 100%; max-height: 360px; object-fit: contain; }
.cu-pg svg { width: 34px; height: 34px; }
.cu-pic b { font-size: 13px; font-weight: 500; letter-spacing: 1px; }
.cu-picops { display: flex; justify-content: center; gap: 26px; padding: 10px 0 0; }
.cu-picops span { font-size: 13px; color: var(--sub); cursor: pointer; }
.cu-f { margin-top: 22px; }
.cu-f label { display: block; font-size: 12px; color: var(--faint); letter-spacing: 3px; margin: 0 2px 8px; }
.cu-f.two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.cu-in { width: 100%; box-sizing: border-box; border: none; outline: none; border-radius: 14px; background: #f4f4f6; padding: 12px 14px; font-size: 16px;
  font-family: inherit; color: var(--ink); -webkit-appearance: none; appearance: none; }
.cu-in.ta { min-height: 96px; resize: none; line-height: 1.7; }
.cu-in[type="date"] { min-height: 46px; }
.cu-price { position: relative; }
.cu-price span { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--sub); font-size: 15px; }
.cu-price .cu-in { padding-left: 30px; }
.cu-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.cu-chips span { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px; border-radius: 17px; background: #fff; font-size: 13.5px; color: #6d6d72;
  box-shadow: 0 2px 8px -4px rgba(0,0,0,.2), 0 0 0 .5px rgba(0,0,0,.06); cursor: pointer; }
.cu-chips span i { width: 5px; height: 5px; border-radius: 50%; background: transparent; display: none; }
.cu-chips span.on { color: var(--ink); font-weight: 500; }
.cu-chips span.on i { display: block; background: var(--dot); }
.cu-chips span.add { width: 34px; padding: 0; justify-content: center; color: #a3a3a9; box-shadow: none; background: #f4f4f6; }
.cu-chips span.add svg { width: 16px; height: 16px; }
.cu-modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.cu-mode { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 16px 8px 14px; border-radius: 18px; background: #f6f6f8; cursor: pointer; color: #8e8e93; }
.cu-mode b { font-size: 13.5px; font-weight: 500; }
.cu-mg svg { width: 26px; height: 26px; }
.cu-mode em { position: absolute; top: 11px; right: 11px; width: 7px; height: 7px; border-radius: 50%; box-shadow: inset 0 0 0 1px #c7c7cc; }
.cu-mode.on { background: #fff; color: var(--ink); box-shadow: 0 8px 20px -12px rgba(0,0,0,.3), 0 0 0 .5px rgba(0,0,0,.05); }
.cu-mode.on em { background: var(--dot); box-shadow: none; }

/* 弹层 */
.cu-ov { position: absolute; inset: 0; z-index: 40; background: rgba(0,0,0,0); display: flex; align-items: flex-end; transition: background .2s; }
.cu-ov.in { background: rgba(0,0,0,.22); }
.cu-sheet { width: 100%; background: #fff; border-radius: 24px 24px 0 0; padding: 18px 18px calc(18px + env(safe-area-inset-bottom, 0px)); transform: translateY(100%); transition: transform .22s ease; }
.cu-ov.in .cu-sheet { transform: none; }
.cu-sh-t { font-size: 12px; color: var(--faint); letter-spacing: 2px; padding: 0 4px 10px; }
.cu-sh-t.big { font-size: 16px; color: var(--ink); letter-spacing: .5px; font-weight: 600; padding-bottom: 16px; text-align: center; }
.cu-si { display: flex; align-items: center; gap: 12px; padding: 14px 6px; font-size: 15.5px; color: var(--ink); cursor: pointer; }
.cu-si + .cu-si { box-shadow: 0 -.5px 0 rgba(0,0,0,.06); }
.cu-si-ic { width: 22px; height: 22px; color: #8e8e93; display: flex; }
.cu-si-ic svg { width: 22px; height: 22px; }
.cu-si.dg { color: #c0392b; }
.cu-si.dg .cu-si-ic { color: #c0392b; }
.cu-row2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
.cu-b2 { height: 46px; border-radius: 23px; display: flex; align-items: center; justify-content: center; font-size: 15px; background: #f2f2f4; color: var(--ink); cursor: pointer; }
.cu-b2.pri { background: #3a3a3c; color: #fff; }
.cu-b2.dg { background: #f2f2f4; color: #c0392b; font-weight: 500; }
.cu-sheet .cu-in { margin-bottom: 4px; }
.cu-pp { display: flex; flex-wrap: wrap; gap: 14px 10px; max-height: 300px; overflow-y: auto; }
.cu-pp.wide { max-height: none; overflow: visible; }
.cu-ppi { position: relative; width: calc(25% - 8px); display: flex; flex-direction: column; align-items: center; gap: 7px; cursor: pointer; }
.cu-ppi b { font-size: 12px; font-weight: 400; color: var(--sub); max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cu-ppi i { width: 5px; height: 5px; border-radius: 50%; background: transparent; }
.cu-ppi.on b { color: var(--ink); font-weight: 500; }
.cu-ppi.on i { background: var(--dot); }
.cu-ppi:not(.on) .cu-av { opacity: .7; }
.cu-empty-s { font-size: 13px; color: var(--faint); text-align: center; padding: 16px 0; }
.cu-app:has(.cu-pickbar) .cu-scroll { padding-bottom: calc(110px + env(safe-area-inset-bottom, 0px)); }
