/*
 * 衣起 · 全站样式（潮流风改版）
 * 白底 + 纯黑粗描边 + 底部实心阴影；衣服是带白边的贴纸；强调色每天变（--day，由 yiqi-day.js 设置）。
 * 每个页面最后加载这个文件，覆盖旧的 app-shell / final-polish / editorial-* 样式。
 */
@font-face { font-family: "Anton"; src: url(/assets/fonts/anton-latin-400-normal.woff2) format("woff2"); font-display: swap; }

:root {
  --day: #FF6A2B;
  --ink: #000;
  --muted: #6b6b6b;
  --faint: #a5a5a5;
  --hair: #e6e6e6;
  --bw: 2.5px;
  --line: 2.5px solid #000;
  --lift: 0 4px 0 #000;
  --lift-sm: 0 3px 0 #000;
  --r-lg: 22px;
  --r-md: 16px;
  --r-sm: 12px;
  --display: "Anton", "Arial Narrow", Impact, sans-serif;
  --sticker: drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff) drop-shadow(0 0 1px rgba(0,0,0,.45)) drop-shadow(0 6px 8px rgba(0,0,0,.16));
  --sticker-sm: drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff) drop-shadow(0 0 1px rgba(0,0,0,.45)) drop-shadow(0 3px 4px rgba(0,0,0,.14));
  --voye-ink: #000; --shell-ink: #000;
}

html, body { background: #fff !important; color: #000; }
body { font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif !important; }

/* ---------- 通用组件 ---------- */
.yq-box { background: #fff; border: var(--line); border-radius: var(--r-md); box-shadow: var(--lift); }
.yq-pill { display: inline-flex; align-items: center; justify-content: center; gap: 4px; height: 32px; padding: 0 13px; border: 2px solid #000; border-radius: 999px; background: #fff; color: #000; font-size: 12px; font-weight: 800; text-decoration: none; white-space: nowrap; cursor: pointer; }
.yq-pill.on, .yq-pill.dark { background: #000; color: #fff; }
.yq-btn { display: flex; align-items: center; justify-content: center; gap: 6px; height: 54px; padding: 0 18px; border: var(--line); border-radius: var(--r-md); background: #fff; color: #000; box-shadow: var(--lift); font-size: 16px; font-weight: 900; text-decoration: none; cursor: pointer; }
.yq-btn.dark { background: #000; color: #fff; }
.yq-btn:active, .yq-pill:active { transform: translateY(2px); box-shadow: 0 2px 0 #000; }
.yq-icon-btn { display: grid; place-items: center; width: 42px; height: 42px; border: var(--line); border-radius: 13px; background: #fff; color: #000; box-shadow: var(--lift-sm); text-decoration: none; cursor: pointer; }
.yq-icon-btn.dark { background: #000; color: #fff; }
.yq-icon-btn i { font-size: 20px; }
.yq-sticker { filter: var(--sticker); }
.yq-num { font-family: var(--display); font-weight: 400; letter-spacing: 0; }
.yq-dot { display: inline-block; width: 10px; height: 10px; margin-right: 5px; border-radius: 50%; border: 1.5px solid rgba(0,0,0,.3); vertical-align: 0; }
.voye-dot { border-color: rgba(0,0,0,.3) !important; width: 10px !important; height: 10px !important; }

/* 页面大标题：英文大字 + 中文小字 */
.yq-title { margin: 0; font-family: var(--display); font-weight: 400; font-size: 46px; line-height: .9; letter-spacing: 0; color: #000; }
.yq-title small { display: block; margin-top: 7px; font-family: -apple-system, "PingFang SC", sans-serif; font-size: 13px; line-height: 1.2; font-weight: 700; color: var(--muted); letter-spacing: 0; }
.yq-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.yq-sec-head { display: flex; align-items: center; justify-content: space-between; margin: 28px 0 12px; }
.yq-sec-head h2 { margin: 0; font-size: 20px; font-weight: 900; letter-spacing: 0; }

/* ---------- 底栏：纯文字 TODAY / CLOSET / FIT / ME ---------- */
.voye-tab-bar-wrap { pointer-events: none; }
.voye-tab-bar { min-height: 0 !important; padding: 11px 6px calc(11px + env(safe-area-inset-bottom)) !important; background: #fff !important; border-top: var(--line) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; border-radius: 0 !important; }
.voye-tab-bar a { gap: 1px !important; min-height: 46px !important; color: var(--faint) !important; border-radius: 0 !important; background: none !important; }
.voye-tab-bar a .yq-en { font-family: var(--display); font-size: 21px; line-height: 1.05; letter-spacing: .3px; padding: 0 2px; }
.voye-tab-bar a .yq-zh { font-size: 10px; font-weight: 800; }
.voye-tab-bar a.active { color: #000 !important; }
.voye-tab-bar a.active .yq-en { box-shadow: inset 0 -7px 0 var(--day); }
.voye-tab-bar a:after, .voye-tab-bar a i:after { display: none !important; }

/* ---------- 衣服贴纸：所有拼贴/缩略图里的衣服都加白边 ---------- */
.voye-oc-piece, .canvas-piece img, .cover-piece img, .cloth-thumb img, .item-media img, .material-item img,
.card .th img, .part .pt img, .wr-th img, .todo-stack img, .sth img, .yq-st {
  filter: var(--sticker-sm) !important; mix-blend-mode: normal !important;
}
.voye-oc-piece, .canvas-piece img, .yq-st-lg { filter: var(--sticker) !important; }

/* 旧的手账/拼贴装饰全部去掉 */
.paper-layer, .cover-caption, .collage-caption, .editorial-note, .qs-caption, .qs-swatches, .qs-spark, .qs-medallion, .cover-arrow { display: none !important; }
.voye-builder .canvas:before, .voye-builder .canvas:after { display: none !important; }

/* 表单基础 */
input[type=search], input[type=text], input[type=date], textarea, select, .text-input, .search-input {
  border: var(--line) !important; border-radius: 14px !important; background: #fff !important; color: #000 !important; font-weight: 600; box-shadow: none !important;
}
input::placeholder, textarea::placeholder { color: #9b9b9b; font-weight: 600; }

/* 弹层/底部面板 */
.sheet { border: var(--line) !important; border-bottom: 0 !important; border-radius: 24px 24px 0 0 !important; box-shadow: none !important; }
.dialog { border: var(--line) !important; border-radius: 20px !important; box-shadow: 0 5px 0 #000 !important; }
.dialog-actions button, .action-cancel { border: var(--line) !important; border-radius: 14px !important; font-weight: 900 !important; color: #000 !important; background: #fff !important; }
.dialog-actions .dark { background: #000 !important; color: #fff !important; }
.action-list button { font-weight: 700; color: #000; }
.toast { background: #000 !important; color: #fff !important; border-radius: 999px !important; font-weight: 700 !important; }
.primary-button { background: #000 !important; color: #fff !important; border: var(--line) !important; border-radius: 16px !important; box-shadow: var(--lift) !important; font-weight: 900 !important; font-size: 15px !important; }
.secondary-button { background: #fff !important; color: #000 !important; border: var(--line) !important; border-radius: 16px !important; box-shadow: var(--lift) !important; font-weight: 900 !important; }
.form-label { color: #000 !important; font-weight: 800 !important; }

/* 属性选择器（添加/编辑衣服） */
.vap-head { color: #000 !important; font-weight: 800 !important; }
.vap-chip { border: 2px solid #000 !important; color: #000 !important; font-weight: 700 !important; }
.vap-chip.on { background: #000 !important; color: #fff !important; }
.vap-sw { border: 2px solid #000 !important; }
.vap-sw.on { box-shadow: 0 0 0 2px #fff, 0 0 0 4.5px #000 !important; }

/* ---------- 次级页面：我的搭配 / 收藏 / 穿搭详情 / 添加衣服 ---------- */
body .page, body .app { background: transparent !important; }
body.voye-list .page, body.voye-detail .page { padding-top: max(24px, env(safe-area-inset-top)) !important; border: 0 !important; border-radius: 0 !important; }
body.voye-list .head h1 { font-size: 26px !important; font-weight: 900 !important; letter-spacing: 0 !important; color: #000 !important; }
body.voye-list .head span { padding: 5px 12px !important; border: 2px solid #000 !important; background: #fff !important; color: #000 !important; font-size: 12px !important; font-weight: 800 !important; }
body.voye-list .card { border: var(--line) !important; border-radius: 18px !important; box-shadow: var(--lift) !important; background: #fff !important; }
body.voye-list .card-date { font-family: var(--display); font-size: 14px !important; background: #000 !important; color: #fff !important; border-radius: 999px !important; }
body.voye-list .card-more { border: 2px solid #000 !important; background: #fff !important; color: #000 !important; }
body.voye-list .empty { color: #555 !important; font-weight: 700; }
body.voye-list .confirm-box { border: var(--line) !important; border-radius: 20px !important; box-shadow: 0 5px 0 #000 !important; }

body.voye-detail, body.voye-detail .head { background: #fff !important; }
body.voye-detail .head { border-bottom: 0 !important; }
body.voye-detail .head button, body.voye-detail .head a { color: #000 !important; }
body.voye-detail .hero-collage { background: transparent !important; border: 0 !important; box-shadow: none !important; }
body.voye-detail .hero:not(#hero) { background: #fff !important; border: var(--line) !important; border-radius: 24px !important; box-shadow: var(--lift) !important; }
body.voye-detail .stamp { background: #000 !important; color: #fff !important; border-radius: 999px !important; font-weight: 800; }
body.voye-detail .item { border: 2px solid #000 !important; border-radius: 14px !important; background: #fff !important; box-shadow: var(--lift-sm) !important; }
body.voye-detail .meta-card, body.voye-detail .note { border: var(--line) !important; border-radius: 16px !important; background: #fff !important; box-shadow: var(--lift-sm) !important; }
body.voye-detail .send, body.voye-detail .resend, body.voye-detail .edit { border: var(--line) !important; border-radius: 14px !important; background: #000 !important; color: #fff !important; font-weight: 900 !important; }
body.voye-detail .delete { border: var(--line) !important; border-radius: 14px !important; background: #fff !important; color: #d1301f !important; font-weight: 900 !important; }

body.voye-add-clothing .entry { border: var(--line) !important; border-radius: 16px !important; box-shadow: var(--lift) !important; background: #fff !important; }
body.voye-add-clothing .entry-icon { background: var(--day) !important; color: #000 !important; border: 2px solid #000; }
body.voye-add-clothing .entry-weak { box-shadow: none !important; border-style: dashed !important; }
body.voye-add-clothing .entry-weak .entry-icon { background: #fff !important; }
body.voye-add-clothing .entry-copy strong { font-weight: 900 !important; color: #000 !important; }
body.voye-add-clothing .entry-head h1 { font-size: 28px !important; font-weight: 900 !important; }
body.voye-add-clothing .soon-badge { border: 2px solid #000; background: #fff !important; color: #000 !important; }
body.voye-add-clothing .panel-icon { background: var(--day) !important; color: #000 !important; border: var(--line); }
body.voye-add-clothing .panel-title { font-weight: 900 !important; }
body.voye-add-clothing .file-drop { border: 2.5px dashed #000 !important; background: #fff !important; }
body.voye-add-clothing .top button { border: var(--line) !important; border-radius: 13px !important; box-shadow: var(--lift-sm); margin-left: 0 !important; }
body.voye-add-clothing .row-field { border-bottom: 2px solid #000 !important; font-weight: 800; }
body.voye-add-clothing .manual-photo-tile { border: 2.5px dashed #000 !important; }
body.voye-detail .meta-card { padding: 10px 12px !important; }
body.voye-detail .item { overflow: hidden; padding-bottom: 6px !important; }
body.voye-detail .item img { background: #fff !important; }
body.voye-detail .item span, body.voye-detail .item small { padding: 0 6px; font-weight: 800; color: #000 !important; }
input:focus-visible, textarea:focus-visible, select:focus-visible { outline: none !important; box-shadow: 0 0 0 3px var(--day) !important; }
[hidden] { display: none !important; }

/* 等大格子展示一套衣服（今天页吊牌等） */
.yq-fit-grid { --cols: 2; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.yq-fit-grid > * { flex: 0 0 calc((100% - (var(--cols) - 1) * 10px) / var(--cols)); }
.yq-fit-cell { position: relative; margin: 0; aspect-ratio: .82; }
.yq-fit-cell img { position: absolute; inset: 0; width: 100%; height: 100%; padding: 10px 10px 24px; object-fit: contain; filter: var(--sticker); }
.yq-fit-cell figcaption { position: absolute; left: 0; right: 0; bottom: 7px; text-align: center; font-size: 12px; font-weight: 800; }
.yq-fit-cell img { padding: 12px 12px 28px !important; }

/* 等大格子不要太端正：每件轻轻歪一点、错开一点，像随手贴上去的贴纸 */
.yq-fit-cell:nth-child(4n+1) img { transform: rotate(-4deg); }
.yq-fit-cell:nth-child(4n+2) img { transform: rotate(3deg) translateY(6px); }
.yq-fit-cell:nth-child(4n+3) img { transform: rotate(2deg) translateY(-2px); }
.yq-fit-cell:nth-child(4n+4) img { transform: rotate(-3deg) translateY(5px); }
@media (prefers-reduced-motion: reduce) { .yq-fit-cell img { transform: none !important; } }
/* 穿搭详情页的大图也用等大格子 */
body.voye-detail .hero:has(.hero-collage.show) { aspect-ratio: auto !important; min-height: 0 !important; }
body.voye-detail .hero-collage.show { position: relative !important; inset: auto !important; display: block; width: 100%; padding: 22px 18px 14px; }
body.voye-detail .hero .yq-fit-cell img { display: block !important; position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; max-height: none !important; }
.yq-fit-cell figcaption { color: #000; }