@charset "UTF-8";
/* ============================================================================
   Kyoto (京都) — 交易层：商品详情 / 富文本详情 / 订单查询 / 订单结果 / 维护页
   ----------------------------------------------------------------------------
   ⚠ 下单 DOM 契约（不要改名，改了就下不了单）：
       程序 assets/user/controller/index/item.js 依赖这些选择器：
         form.vstack                —— 整张下单表单（serializeArray 取所有 name）
         .switch-race.is-primary    —— 种类（data-sku）
         .switch-sku[data-sku][data-value].is-primary —— 规格
         .abacus .price             —— 价格（JS 直接 innerHTML 覆盖）
         .item-stock                —— 库存徽章（JS 换 badge-soft-* 类）
         .snap-up                   —— 秒杀徽章（JS 换类与文案）
         .cash-pay / .pay-list      —— 付款区与支付方式（JS 注入 a.pay）
         .change-num-sub / .change-num-add / input[name=num]
         .optional-card             —— 自选账号（JS 覆盖其 innerHTML）
         .captcha-img               —— 图形验证码（JS 点击换 src）
     因此本文件只负责「外观」，一切结构沿用程序约定。
   ========================================================================== */

/* ==========================================================================
   1. 商品详情：左图右购 栅格
   ========================================================================== */
.k-item {
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr);
    gap: var(--k-s7);
    align-items: start;
}

/* ---------- 1.1 主图 ---------- */
.k-item__media { min-width: 0; }
.k-gallery {
    position: relative;
    margin: 0;
    background: var(--k-surface);
    border: 1px solid var(--k-line);
    border-radius: var(--k-r-lg);
    box-shadow: var(--k-sh-1);
    overflow: hidden;
}
.k-gallery__zoom {
    display: block; width: 100%;
    padding: 0; border: 0; background: none; cursor: zoom-in;
}
.k-gallery__zoom img,
.item-cover {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    background: var(--k-surface-3);
    transition: transform var(--k-d4) var(--k-ease-out);
}
.k-gallery__zoom:hover img { transform: scale(1.03); }
.k-gallery__hint {
    position: absolute; left: 50%; bottom: var(--k-s4);
    transform: translateX(-50%);
    display: inline-flex; align-items: center; gap: 6px;
    padding: 6px 13px;
    border-radius: var(--k-r-pill);
    background: color-mix(in srgb, var(--k-ink) 74%, transparent);
    color: #fff;
    font-size: 12px; font-weight: 600;
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
    opacity: 0; transition: opacity var(--k-d3) var(--k-ease);
    pointer-events: none;
}
.k-gallery:hover .k-gallery__hint { opacity: 1; }

/* ---------- 1.2 信息面板 ---------- */
.k-item__info { min-width: 0; }
.k-item__title {
    margin: 0 0 var(--k-s3);
    font-size: clamp(20px, 2.3vw, 27px);
    font-weight: 700; line-height: 1.4;
    letter-spacing: -.012em;
    color: var(--k-ink);
    overflow-wrap: anywhere;
}
.k-item__badges {
    display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
    margin-bottom: var(--k-s5);
}
/* badge-soft 用在 button 上时的按钮化处理（如「分享」） */
button.badge-soft {
    font: inherit; font-size: 12px; font-weight: 600;
    border: 1px solid transparent; cursor: pointer;
    transition: filter var(--k-d1) var(--k-ease), transform var(--k-d1) var(--k-ease);
}
button.badge-soft:hover { filter: brightness(.96); }
button.badge-soft:active { transform: translateY(1px); }
.item-stock { font-variant-numeric: tabular-nums; }

/* ---------- 1.3 价格块 ---------- */
.k-price {
    display: flex; align-items: center; gap: var(--k-s3);
    padding: var(--k-s4) var(--k-s5);
    margin-bottom: var(--k-s5);
    border-radius: var(--k-r-md);
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--k-verm) 6%, transparent), transparent 70%),
        var(--k-surface-2);
    border: 1px solid var(--k-line);
}
.k-price__label {
    flex: none;
    font-size: 12px; font-weight: 700; letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--k-ink-4);
    font-family: var(--k-mono);
}
.k-price .price,
.k-price.abacus .price {
    display: inline-flex; align-items: baseline;
    font-family: var(--k-mono);
    font-size: clamp(26px, 3.6vw, 36px);
    font-weight: 800; line-height: 1;
    letter-spacing: -.02em;
    color: var(--k-verm);
    font-variant-numeric: tabular-nums;
}
.k-price .price .unit { font-size: 15px; font-weight: 700; margin-right: 2px; }
.k-price .price .icon-spin { font-size: 16px; color: var(--k-ink-4); }

/* 价格跳变提示：切换规格 / 改数量后价格会变，给一次轻微的放大反馈，避免用户没注意到 */
@keyframes k-price-bump {
    0%   { transform: scale(1); }
    36%  { transform: scale(1.07); }
    100% { transform: scale(1); }
}
.k-price .price.is-bump { animation: k-price-bump .42s var(--k-ease-out); transform-origin: left center; }
/* 付款区引导：从吸底栏跳过来时高亮一下，指明接下来点哪儿 */
@keyframes k-pay-hint {
    0%, 100% { box-shadow: 0 0 0 0 transparent; }
    40%      { box-shadow: 0 0 0 5px var(--k-jade-soft); }
}
.cash-pay.is-bump { border-radius: var(--k-r-md); animation: k-pay-hint .62s var(--k-ease-out); }

/* ---------- 1.4 下单表单 ---------- */
.k-form { display: flex; flex-direction: column; gap: var(--k-s5); }
.k-form .k-field { display: flex; flex-direction: column; gap: var(--k-s2); }
.k-field__label {
    font-size: 13px; font-weight: 600; color: var(--k-ink-2);
    letter-spacing: .01em;
}
.k-field__label i { color: var(--k-ink-4); margin-right: 4px; }

/* 种类 / 规格 选择：卡片式 chip */
.sku-list { display: flex; flex-wrap: wrap; gap: var(--k-s2); }
.sku-list .sku {
    display: inline-flex; align-items: center; gap: 7px;
    padding: 9px 14px;
    background: var(--k-surface-2);
    border: 1px solid var(--k-line-2);
    border-radius: var(--k-r-sm);
    color: var(--k-ink-2);
    font-size: 13.5px; font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: border-color var(--k-d1) var(--k-ease), background var(--k-d1) var(--k-ease),
        color var(--k-d1) var(--k-ease), box-shadow var(--k-d1) var(--k-ease);
}
.sku-list .sku:hover { border-color: var(--k-ink-4); color: var(--k-ink); }
.sku-list .sku.is-primary {
    background: var(--k-surface);
    border-color: var(--k-jade);
    color: var(--k-jade-hi);
    box-shadow: 0 0 0 1px var(--k-jade) inset, var(--k-sh-1);
}
html[data-k-mode="dark"] .sku-list .sku.is-primary { color: var(--k-jade-lo); }
.sku-list .sku.is-primary::before {
    content: "";
    width: 6px; height: 6px; border-radius: 50%;
    background: var(--k-jade);
}
.sku .badge-money {
    font-family: var(--k-mono); font-size: 11.5px; font-weight: 700;
    color: var(--k-verm);
    padding: 1px 6px; border-radius: var(--k-r-xs);
    background: var(--k-verm-soft);
}
html[data-k-mode="dark"] .sku .badge-money { background: color-mix(in srgb, var(--k-verm) 20%, transparent); }
.sku.is-primary .badge-money { background: color-mix(in srgb, var(--k-verm) 14%, transparent); }

/* 自选账号 */
.optional-card {
    display: flex; align-items: center; gap: var(--k-s2);
    width: 100%; padding: 11px var(--k-s4);
    background: var(--k-surface-2);
    border: 1px dashed var(--k-line-3);
    border-radius: var(--k-r-sm);
    font: inherit; font-size: 13.5px; font-weight: 600;
    color: var(--k-ink-2);
    cursor: pointer; text-align: left;
    transition: border-color var(--k-d2) var(--k-ease), background var(--k-d2) var(--k-ease), color var(--k-d2) var(--k-ease);
}
.optional-card:hover { border-color: var(--k-jade); color: var(--k-jade-hi); background: var(--k-surface); }
.optional-card > i:first-child { color: var(--k-ink-4); flex: none; }
.optional-card:hover > i:first-child { color: var(--k-jade); }
.optional-card__caret { margin-left: auto; font-size: 10px; opacity: .55; }
/* JS 覆盖 innerHTML 后会丢掉图标与 caret，这里保证纯文本回填也能居中留白 */
.optional-card:not(:has(i)) { justify-content: flex-start; }

/* 数量步进器（覆盖 bootstrap .input-group 的默认表现） */
.qty-group {
    display: inline-flex; align-items: stretch;
    width: max-content; max-width: 100%;
    background: var(--k-surface-2);
    border: 1px solid var(--k-line);
    border-radius: var(--k-r-sm);
    overflow: hidden;
}
.qty-group .change-num-sub,
.qty-group .change-num-add {
    flex: none;
    width: 44px;
    display: grid; place-items: center;
    border: 0; background: none; cursor: pointer;
    color: var(--k-ink-2); font-size: 12px;
    transition: background var(--k-d1) var(--k-ease), color var(--k-d1) var(--k-ease);
}
.qty-group .change-num-sub:hover,
.qty-group .change-num-add:hover { background: var(--k-surface-3); color: var(--k-ink); }
.qty-group .form-control {
    flex: none;
    width: 74px; height: 42px;
    border: 0 !important;
    border-left: 1px solid var(--k-line) !important;
    border-right: 1px solid var(--k-line) !important;
    border-radius: 0;
    background: var(--k-surface);
    text-align: center;
    font-family: var(--k-mono); font-size: 15px; font-weight: 700;
    font-variant-numeric: tabular-nums;
    box-shadow: none !important;
    -moz-appearance: textfield;
    appearance: textfield;
}
.qty-group .form-control::-webkit-outer-spin-button,
.qty-group .form-control::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.qty-group .form-control:focus { border-color: var(--k-line) !important; }

/* 批发价表（item.js 动态插入到 .qty-group 之后） */
.wholesale-table {
    width: 100%; margin-top: var(--k-s3) !important;
    border: 1px solid var(--k-line);
    border-radius: var(--k-r-sm);
    overflow: hidden;
    font-size: 13px;
    border-collapse: separate; border-spacing: 0;
}
.wholesale-table > thead > tr > th,
.wholesale-table > tbody > tr > td {
    padding: 9px var(--k-s4);
    border-color: var(--k-line);
    color: var(--k-ink-2);
}
.wholesale-table > thead > tr > th {
    background: var(--k-surface-3);
    font-weight: 700; color: var(--k-ink);
    letter-spacing: .01em;
}
.wholesale-table > tbody > tr > td:last-child {
    font-family: var(--k-mono); font-weight: 700; color: var(--k-verm);
}

/* 图形验证码 */
.k-captcha { display: flex; gap: var(--k-s2); align-items: stretch; }
.k-captcha .form-control { flex: 1 1 auto; width: auto; }
.k-captcha .captcha-img {
    flex: none;
    height: 44px; width: 124px;
    border-radius: var(--k-r-sm);
    border: 1px solid var(--k-line);
    background: var(--k-surface-3);
    cursor: pointer; object-fit: cover;
    transition: border-color var(--k-d2) var(--k-ease);
}
.k-captcha .captcha-img:hover { border-color: var(--k-jade); }

/* 付款区 */
.cash-pay {
    display: flex; flex-direction: column; gap: var(--k-s2);
    padding-top: var(--k-s4);
    border-top: 1px dashed var(--k-line-2);
}
.pay-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--k-s2); }
.pay-list .pay {
    display: flex; align-items: center; gap: var(--k-s2);
    padding: 12px var(--k-s3);
    background: var(--k-surface);
    border: 1px solid var(--k-line-2);
    border-radius: var(--k-r-sm);
    color: var(--k-ink); font-size: 13.5px; font-weight: 600;
    text-decoration: none; cursor: pointer;
    transition: border-color var(--k-d2) var(--k-ease), box-shadow var(--k-d2) var(--k-ease), transform var(--k-d1) var(--k-ease);
}
.pay-list .pay:hover {
    border-color: var(--k-jade);
    box-shadow: var(--k-sh-2);
    transform: translateY(-1px);
}
.pay-list .pay:active { transform: translateY(0); }
.pay-list .pay img { width: 22px; height: 22px; object-fit: contain; flex: none; }
.pay-list .pay span { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

/* 仅会员购买时的登录引导 */
.k-loginneed {
    display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--k-s4);
    padding: var(--k-s4);
    border-radius: var(--k-r-md);
    background: var(--k-warn-soft);
    border: 1px solid color-mix(in srgb, var(--k-warn) 26%, transparent);
}
.k-loginneed__copy { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.k-loginneed__copy b { font-size: 14px; color: var(--k-ink); }
.k-loginneed__copy span { font-size: 12.5px; color: var(--k-ink-3); }

/* ==========================================================================
   2. 详情正文（富文本 + 说明片段）
   ========================================================================== */
.k-desc { margin-top: var(--k-s8); }
.k-desc .k-panel__body { padding: var(--k-s6); }
.k-prose { font-size: 14.5px; line-height: 1.85; color: var(--k-ink-2); }
.k-prose > *:first-child { margin-top: 0; }
.k-prose > *:last-child { margin-bottom: 0; }
.k-prose p { margin: 0 0 var(--k-s3); }
.k-prose h1, .k-prose h2, .k-prose h3, .k-prose h4 {
    margin: var(--k-s6) 0 var(--k-s3);
    color: var(--k-ink); font-weight: 700; line-height: 1.45;
}
.k-prose h1 { font-size: 21px; } .k-prose h2 { font-size: 19px; }
.k-prose h3 { font-size: 17px; } .k-prose h4 { font-size: 15.5px; }
.k-prose a { color: var(--k-jade-hi); text-decoration: none; border-bottom: 1px solid var(--k-jade-line); }
.k-prose a:hover { border-bottom-color: var(--k-jade); }
.k-prose strong { color: var(--k-ink); font-weight: 700; }
.k-prose img { max-width: 100%; height: auto; border-radius: var(--k-r-sm); display: block; margin: var(--k-s3) auto; }
.k-prose ul, .k-prose ol { margin: 0 0 var(--k-s3); padding-left: 1.4em; }
.k-prose li { margin-bottom: 6px; }
.k-prose ul { list-style: none; padding-left: 0; }
.k-prose ul > li { position: relative; padding-left: 18px; }
.k-prose ul > li::before {
    content: ""; position: absolute; left: 2px; top: .68em;
    width: 5px; height: 5px; border-radius: 50%;
    background: var(--k-jade);
}
.k-prose blockquote {
    margin: var(--k-s4) 0; padding: var(--k-s3) var(--k-s4);
    border-left: 3px solid var(--k-jade);
    background: var(--k-surface-2);
    border-radius: 0 var(--k-r-sm) var(--k-r-sm) 0;
    color: var(--k-ink-2);
}
.k-prose code {
    font-family: var(--k-mono); font-size: .92em;
    padding: 2px 5px; border-radius: 5px;
    background: var(--k-surface-3); color: var(--k-ink);
}
.k-prose pre {
    margin: var(--k-s4) 0; padding: var(--k-s4);
    background: var(--k-surface-3);
    border: 1px solid var(--k-line);
    border-radius: var(--k-r-sm);
    overflow-x: auto;
}
.k-prose pre code { padding: 0; background: none; }
.k-prose table {
    width: 100%; margin: var(--k-s4) 0;
    border-collapse: separate; border-spacing: 0;
    border: 1px solid var(--k-line); border-radius: var(--k-r-sm);
    overflow: hidden; font-size: 13.5px;
}
.k-prose table th, .k-prose table td { padding: 9px 12px; border-bottom: 1px solid var(--k-line); }
.k-prose table th { background: var(--k-surface-3); font-weight: 700; color: var(--k-ink); text-align: left; }
.k-prose table tr:last-child td { border-bottom: 0; }
.k-prose hr { border: 0; border-top: 1px solid var(--k-line); margin: var(--k-s6) 0; }

/* 暗色下中和正文里写死的白底/黑字（后台富文本常见），保留作者刻意用的强调色 */
html[data-k-mode="dark"] .k-prose [style*="background-color"],
html[data-k-mode="dark"] .k-prose [style*="background: #fff"],
html[data-k-mode="dark"] .k-prose [style*="background:#fff"] { background-color: transparent !important; }
html[data-k-mode="dark"] .k-prose [style*="color: #121212"],
html[data-k-mode="dark"] .k-prose [style*="color:#121212"],
html[data-k-mode="dark"] .k-prose [style*="color: #000000"],
html[data-k-mode="dark"] .k-prose [style*="color:#000000"],
html[data-k-mode="dark"] .k-prose [style*="color: rgb(18, 18, 18)"],
html[data-k-mode="dark"] .k-prose [style*="color:rgb(18,18,18)"] { color: var(--k-ink-2) !important; }

/* ---------- 2.1 说明片段组件（原 Tokyo 片段使用的类名，此处统一接管） ---------- */
.section-title {
    display: flex; align-items: center; gap: var(--k-s2);
    margin: var(--k-s6) 0 var(--k-s3);
    font-size: 16px; font-weight: 700; color: var(--k-ink);
}
.section-title i { color: var(--k-jade); }
.section-title .tag {
    margin-left: 2px; padding: 2px 9px;
    border-radius: var(--k-r-pill);
    background: var(--k-verm-soft); color: var(--k-verm);
    font-size: 11px; font-weight: 700; letter-spacing: .02em;
}
html[data-k-mode="dark"] .section-title .tag { background: color-mix(in srgb, var(--k-verm) 22%, transparent); }

.feature-list, .info-list { margin: 0 0 var(--k-s4); padding: 0; list-style: none; }
.feature-list > li, .info-list > li {
    position: relative;
    padding: var(--k-s3) var(--k-s4) var(--k-s3) 40px;
    margin-bottom: var(--k-s2);
    background: var(--k-surface-2);
    border: 1px solid var(--k-line);
    border-radius: var(--k-r-sm);
    font-size: 13.5px; line-height: 1.75; color: var(--k-ink-2);
}
.feature-list > li::before, .info-list > li::before {
    content: "\f00c";
    position: absolute; left: 15px; top: calc(var(--k-s3) + 2px);
    font-family: "Font Awesome 6 Duotone", "Font Awesome 6 Free", "Font Awesome 5 Free", sans-serif;
    font-weight: 900; font-size: 12px;
    color: var(--k-jade);
}
.info-list > li::before { content: "\f05a"; }
.feature-list strong, .info-list strong { color: var(--k-ink); }
.divider-light { border: 0; border-top: 1px dashed var(--k-line-2); margin: var(--k-s6) 0; }
.highlight { color: var(--k-verm); font-weight: 700; }
.support-note, .warm-tip-line {
    display: flex; align-items: flex-start; gap: var(--k-s2);
    padding: var(--k-s3) var(--k-s4);
    margin: var(--k-s3) 0;
    border-radius: var(--k-r-sm);
    background: var(--k-info-soft);
    border-left: 3px solid var(--k-info);
    font-size: 13.5px; color: var(--k-ink-2);
}
.time-badge {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 2px 9px; border-radius: var(--k-r-xs);
    background: var(--k-surface-3); color: var(--k-ink-3);
    font-size: 11.5px; font-weight: 600;
    font-family: var(--k-mono);
}
.decorated-link { color: var(--k-jade-hi); font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--k-jade-line); }
.decorated-link:hover { border-bottom-color: var(--k-jade); }

/* 引导卡片（教程入口） */
.sticker-wrap { margin: var(--k-s4) 0; }
.sticker-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--k-s3); }
.sticker-btn, .sticker-btn.alipay-guide-card,
a.sticker-btn, a.sticker-btn:hover, a.sticker-btn:focus {
    display: flex; align-items: center; gap: var(--k-s3);
    padding: var(--k-s3) var(--k-s4);
    background: var(--k-surface);
    border: 1px solid var(--k-line-2);
    border-radius: var(--k-r-md);
    text-decoration: none !important;
    color: var(--k-ink);
    box-shadow: var(--k-sh-1);
    transition: border-color var(--k-d2) var(--k-ease), box-shadow var(--k-d2) var(--k-ease), transform var(--k-d1) var(--k-ease);
}
.sticker-btn:hover { border-color: var(--k-jade); box-shadow: var(--k-sh-2); transform: translateY(-2px); }
.alipay-guide-mark {
    flex: none; order: 3;
    padding: 2px 7px; border-radius: var(--k-r-xs);
    background: var(--k-cyan-soft); color: var(--k-cyan);
    font-size: 9.5px; font-weight: 800; letter-spacing: .08em;
    font-family: var(--k-mono);
}
.sticker-ico, .alipay-guide-ico {
    flex: none;
    width: 38px; height: 38px; display: grid; place-items: center;
    border-radius: var(--k-r-sm);
    background: var(--k-jade-soft); color: var(--k-jade-hi);
    font-size: 15px;
}
html[data-k-mode="dark"] .sticker-ico { background: color-mix(in srgb, var(--k-jade) 20%, transparent); color: var(--k-jade-lo); }
.sticker-text, .alipay-guide-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1 1 auto; }
.sticker-text strong, .alipay-guide-text strong { font-size: 13.5px; font-weight: 700; color: var(--k-ink); }
.sticker-text em, .alipay-guide-text em { font-size: 11.5px; font-style: normal; color: var(--k-ink-4); }
.sticker-go, .alipay-guide-go {
    flex: none; display: inline-flex; align-items: center; gap: 4px;
    font-size: 12px; font-weight: 700; color: var(--k-jade-hi);
    white-space: nowrap;
}
.sticker-arrow, .alipay-guide-arrow { display: none; }

/* ==========================================================================
   3. 图片放大灯箱（Assets/Product.js 注入）
   ========================================================================== */
.k-lightbox {
    position: fixed; inset: 0; z-index: var(--k-z-modal);
    display: grid; place-items: center;
    padding: var(--k-s5);
    background: rgba(8, 9, 12, .86);
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
    opacity: 0; transition: opacity var(--k-d3) var(--k-ease);
}
.k-lightbox.is-on { opacity: 1; }
.k-lightbox img {
    max-width: min(94vw, 1180px);
    max-height: 84vh;
    border-radius: var(--k-r-md);
    box-shadow: var(--k-sh-4);
    background: var(--k-surface-3);
}
.k-lightbox__close {
    position: absolute; top: var(--k-s5); right: var(--k-s5);
    width: 42px; height: 42px; display: grid; place-items: center;
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 50%; cursor: pointer;
    background: rgba(255, 255, 255, .1); color: #fff; font-size: 16px;
    transition: background var(--k-d2) var(--k-ease);
}
.k-lightbox__close:hover { background: rgba(255, 255, 255, .2); }

/* ==========================================================================
   4. 移动端吸底购买栏（Product.js 控制显隐与镜像价格）
   ========================================================================== */
.k-buybar { display: none; }
.k-buybar__price { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.k-buybar__label { font-size: 11px; color: var(--k-ink-4); }
.k-buybar__value {
    font-family: var(--k-mono); font-size: 20px; font-weight: 800;
    color: var(--k-verm); line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

/* ==========================================================================
   5. 订单查询页
   ========================================================================== */
.k-query .k-panel__body { padding: var(--k-s6); }
.k-query__row { display: flex; flex-direction: column; gap: var(--k-s2); }
.k-query__combo {
    position: relative;
    display: flex; align-items: center; gap: var(--k-s2);
}
.k-query__ico {
    position: absolute; left: 15px; top: 50%; transform: translateY(-50%);
    font-size: 14px; color: var(--k-ink-4); pointer-events: none;
}
.k-query__combo:focus-within .k-query__ico { color: var(--k-jade); }
.k-query__input { padding-left: 42px; height: 48px; font-size: 15px; }
.k-query__combo .btn-search-query { flex: none; height: 48px; }
.k-query__recent { display: flex; align-items: center; gap: var(--k-s2); flex-wrap: wrap; margin-top: var(--k-s2); }
.k-query__recent-label { font-size: 12px; color: var(--k-ink-4); }
.k-query__recent-list { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.k-query__recent-chip {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 4px 11px;
    border-radius: var(--k-r-pill);
    background: var(--k-surface-3);
    border: 1px solid var(--k-line);
    font-family: var(--k-mono); font-size: 11.5px; font-weight: 600;
    color: var(--k-ink-3);
    cursor: pointer;
    transition: background var(--k-d1) var(--k-ease), color var(--k-d1) var(--k-ease), border-color var(--k-d1) var(--k-ease);
}
.k-query__recent-chip:hover { background: var(--k-jade-soft); border-color: var(--k-jade-line); color: var(--k-jade-hi); }
.k-query__tips {
    display: flex; align-items: flex-start; gap: 6px;
    margin: var(--k-s4) 0 0;
    font-size: 12.5px; line-height: 1.7; color: var(--k-ink-4);
}
.k-query__tips i { margin-top: 3px; flex: none; }

.k-results__head {
    display: flex; align-items: baseline; justify-content: space-between; gap: var(--k-s4);
    margin: var(--k-s6) 0 var(--k-s3);
}
.k-results__title { margin: 0; display: flex; align-items: center; gap: var(--k-s2); font-size: 17px; font-weight: 700; color: var(--k-ink); }
.k-results__title i { color: var(--k-jade); }
.k-results__hint { font-size: 12px; color: var(--k-ink-4); }
.order-list { display: flex; flex-direction: column; gap: var(--k-s4); }

/* ---------- 5.1 订单卡片（程序 query.js 生成的 DOM，此处只做外观） ---------- */
.order-item {
    background: var(--k-surface);
    border: 1px solid var(--k-line);
    border-radius: var(--k-r-lg);
    box-shadow: var(--k-sh-1);
    overflow: hidden;
}
.order-header {
    display: flex; align-items: flex-start; justify-content: space-between; gap: var(--k-s4);
    flex-wrap: wrap;
    padding: var(--k-s4) var(--k-s5);
    background: var(--k-surface-2);
    border-bottom: 1px solid var(--k-line);
}
.order-left { display: flex; flex-direction: column; gap: var(--k-s2); min-width: 0; }
.order-status { display: flex; align-items: center; gap: var(--k-s2); }
.status-badge {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 4px 12px; border-radius: var(--k-r-pill);
    font-size: 12.5px; font-weight: 700;
    border: 1px solid transparent;
}
.status-badge.status-pending         { color: var(--k-warn);   background: var(--k-warn-soft);   border-color: color-mix(in srgb, var(--k-warn) 24%, transparent); }
.status-badge.status-paid            { color: var(--k-jade-hi); background: var(--k-jade-soft);  border-color: var(--k-jade-line); }
.status-badge.status-shipped         { color: var(--k-info);   background: var(--k-info-soft);   border-color: color-mix(in srgb, var(--k-info) 24%, transparent); }
.status-badge.status-waiting-shipment{ color: var(--k-verm);   background: var(--k-verm-soft);   border-color: color-mix(in srgb, var(--k-verm) 24%, transparent); }
html[data-k-mode="dark"] .status-badge.status-paid { background: color-mix(in srgb, var(--k-jade) 20%, transparent); color: var(--k-jade-lo); }

.order-basic { display: flex; flex-direction: column; gap: 3px; font-size: 12.5px; color: var(--k-ink-3); }
.order-no { font-size: 13.5px; font-weight: 700; color: var(--k-ink); font-family: var(--k-mono); letter-spacing: .01em; }
.order-no-text { cursor: copy; }
.order-time-text, .payment-time-text { font-family: var(--k-mono); }
.payment-method { display: inline-flex; align-items: center; gap: 5px; }
.payment-icon { width: 15px; height: 15px; object-fit: contain; vertical-align: -2px; }

.order-right { display: flex; align-items: center; gap: var(--k-s2); }
.order-amount { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; }
.amount-label { font-size: 11.5px; color: var(--k-ink-4); }
.amount-value {
    display: inline-flex; align-items: baseline;
    font-family: var(--k-mono); font-size: 22px; font-weight: 800;
    color: var(--k-verm); letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
}

.goods-section {
    display: flex; align-items: center; gap: var(--k-s4);
    padding: var(--k-s4) var(--k-s5);
}
.goods-thumb { flex: none; }
.goods-image {
    width: 62px; height: 62px; border-radius: var(--k-r-sm);
    object-fit: cover; border: 1px solid var(--k-line);
    background: var(--k-surface-3);
}
.goods-details { min-width: 0; display: flex; flex-direction: column; gap: var(--k-s2); }
.goods-name { margin: 0; font-size: 14.5px; font-weight: 700; color: var(--k-ink); overflow-wrap: anywhere; }
.goods-meta { display: flex; flex-wrap: wrap; gap: 5px; }
.goods-sku {
    display: inline-flex; align-items: center;
    padding: 2px 9px; border-radius: var(--k-r-xs);
    font-size: 11.5px; font-weight: 600;
    border: 1px solid transparent;
}
.a-badge { display: inline-flex; align-items: center; border-radius: var(--k-r-xs); font-size: 11.5px; font-weight: 600; }
.a-badge-primary { color: var(--k-info);   background: var(--k-info-soft);   border-color: color-mix(in srgb, var(--k-info) 22%, transparent); }
.a-badge-success { color: var(--k-jade-hi); background: var(--k-jade-soft);  border-color: var(--k-jade-line); }
.a-badge-warning { color: var(--k-warn);   background: var(--k-warn-soft);   border-color: color-mix(in srgb, var(--k-warn) 22%, transparent); }
.a-badge-danger  { color: var(--k-danger); background: var(--k-danger-soft); border-color: color-mix(in srgb, var(--k-danger) 22%, transparent); }
.a-badge-info    { color: var(--k-cyan);   background: var(--k-cyan-soft);   border-color: color-mix(in srgb, var(--k-cyan) 22%, transparent); }

.card-section { border-top: 1px dashed var(--k-line-2); }
.card-header { padding: var(--k-s3) var(--k-s5) 0; }
.card-title.shipment-content {
    display: flex; align-items: center; justify-content: space-between; gap: var(--k-s3);
    font-size: 14px !important; font-weight: 700; color: var(--k-ink);
}
.shipment-title { display: inline-flex; align-items: center; gap: 6px; }
.shipment-title i { color: var(--k-jade); }
.shipment-badge { padding: 2px 10px; border-radius: var(--k-r-pill); font-size: 11.5px; font-weight: 700; }
.shipment-badge.shipment-waiting { color: var(--k-warn); background: var(--k-warn-soft); }
.shipment-badge.shipment-paid    { color: var(--k-jade-hi); background: var(--k-jade-soft); }

.card-password-section, .card-content-no-password, .card-content { padding: var(--k-s3) var(--k-s5) var(--k-s5); }
.password-form .input-group { display: flex; gap: var(--k-s2); }
.password-form .card-password-input { flex: 1 1 auto; height: 42px; }
.password-form .view-card-btn {
    flex: none; height: 42px; padding: 0 var(--k-s4);
    display: inline-flex; align-items: center; gap: 6px;
    border: 0; border-radius: var(--k-r-sm); cursor: pointer;
    background: var(--k-ink); color: var(--k-surface);
    font: inherit; font-size: 13.5px; font-weight: 600;
    transition: background var(--k-d2) var(--k-ease);
}
.password-form .view-card-btn:hover { background: var(--k-jade); }
.card-loading { padding: var(--k-s4) var(--k-s5); }
.loading-content { display: flex; align-items: center; gap: var(--k-s2); font-size: 13.5px; color: var(--k-ink-3); }
.loading-content i { color: var(--k-jade); }

.card-display {
    padding: var(--k-s4);
    border-radius: var(--k-r-sm);
    background: var(--k-surface-3);
    border: 1px solid var(--k-line);
    font-family: var(--k-mono); font-size: 13px; line-height: 1.8;
    color: var(--k-ink);
    white-space: pre-wrap; overflow-wrap: anywhere;
    -webkit-user-select: all; user-select: all;
    max-height: 260px; overflow: auto;
}
.card-content-no-password .card-display { margin: 0; }

/* 交付文件行（ready.js 的 acgDelivery 组件）在 Kyoto 下的配色对齐 */
.k-prose .acg-delivery, .order-item .acg-delivery {
    --acg-delivery-radius: var(--k-r-sm);
    --acg-delivery-border: var(--k-line);
    --acg-delivery-surface: var(--k-surface-2);
    --acg-delivery-accent: var(--k-jade);
    --acg-delivery-accent-soft: var(--k-jade-soft);
    --acg-delivery-on-accent: #fff;
    --acg-delivery-success: var(--k-jade-hi);
}

/* ==========================================================================
   6. 维护页
   ========================================================================== */
.k-closed .k-state__ico--warn { background: var(--k-warn-soft); color: var(--k-warn); }
.k-closed__notice {
    display: flex; align-items: flex-start; gap: var(--k-s3);
    max-width: 640px; margin: var(--k-s5) auto 0;
    padding: var(--k-s3) var(--k-s4);
    border-radius: var(--k-r-md);
    background: var(--k-surface-2);
    border: 1px solid var(--k-line);
    font-size: 13.5px; line-height: 1.75; color: var(--k-ink-2);
    text-align: left;
}
.k-closed__notice i { color: var(--k-verm); margin-top: 3px; flex: none; }
.k-closed__actions { display: flex; flex-wrap: wrap; gap: var(--k-s3); justify-content: center; margin-top: var(--k-s6); }