/* Browser adaptations only. Original geometry lives in styles.css. */
:root { --app-width: min(100vw, 430px); --rpx: calc(var(--app-width) / 750); --web-top: max(20px, env(safe-area-inset-top)); font-family: -apple-system,BlinkMacSystemFont,'Helvetica Neue','PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif; color:var(--color-text-primary); background:#f4eff1; font-synthesis:none; -webkit-font-smoothing:antialiased; }
* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; }
html { scrollbar-width:none; }
html::-webkit-scrollbar { display:none; }
body { font-size:var(--font-size-body); line-height:var(--line-height-body); }
button { padding:0; margin:0; font:inherit; color:inherit; border:0; background:transparent; text-align:inherit; cursor:pointer; touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
button:active { opacity:.78; }
button:disabled { opacity:.45; cursor:default; }
button:focus-visible { outline:2px solid var(--color-text-brand-strong); outline-offset:3px; }
img { display:block; object-fit:cover; }
.app-shell { width:var(--app-width); min-height:100vh; min-height:100svh; margin:0 auto; position:relative; background:var(--color-bg-page); }
/* svh 不随移动端地址栏收放变化，避免滚动时整页反复重排。 */
.page { min-height:100vh; min-height:100svh; }
.nav-host { width:var(--app-width); left:50%; right:auto; transform:translateX(-50%); pointer-events:none; }
.nav-host button { pointer-events:auto; }
.home-page .content { padding-top:var(--web-top); }
.home-page .profile { text-align:left; }
.home-page .usp-card-host { flex:1; min-width:0; }
.home-page .quick-action-host { flex:1; min-width:0; }
.home-page .quota,.home-page .inspiration,.home-page .cta { width:100%; }
.home-page .hero__dot::after { content:''; position:absolute; inset:-10px; }
.home-page .hero__dot { position:relative; }
.home-page .hero__highlight { flex-shrink:0; }
.home-page .hero__caption-text { flex:1; }
.wardrobe-page { --safe-top-h:var(--web-top); }
.wardrobe-page .header { width:var(--app-width); left:50%; right:auto; transform:translateX(-50%); }
.wardrobe-page .title { text-align:left; }
.wardrobe-page .icon-button__icon--add { filter:brightness(0) saturate(100%) invert(32%) sepia(25%) saturate(1812%) hue-rotate(297deg); }
.wardrobe-page .item__open { display:block; width:100%; }
.wardrobe-page .item__media { display:block; }
.wardrobe-page .item__delete { top:calc(var(--card-padding) + var(--item-action-offset)); right:calc(var(--card-padding) + var(--item-action-offset)); }
.wardrobe-page .filter { overflow-x:auto; scrollbar-width:none; }
.wardrobe-page .filter__item { flex-shrink:0; }
.profile-page { --profile-safe-top:var(--web-top); }
.profile-page .record__preview { display:block; width:100%; height:100%; }
.profile-page .record__img { object-fit:cover; }
.profile-page .identity__row { white-space:nowrap; }
.fitting-page,.camera-page { height:100vh; height:100svh; min-height:0; }
.fitting-page .hud,.camera-page .hud { pointer-events:none; }
.fitting-page .quota { width:calc(var(--rpx) * 246); }
.tryon-panel-host .fitting-panel__body { overflow-y:auto; overscroll-behavior:contain; scrollbar-width:none; }
.tryon-panel-host .fitting-panel__cats { overflow-x:auto; scrollbar-width:none; }
.tryon-panel-host .fitting-panel__head { touch-action:none; }
/* 头部多了模型选择后，副标题在窄屏下省略显示，避免挤压按钮。 */
.tryon-panel-host .fitting-panel__meta { white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
/* 试穿台头部的模型选择：开始试穿前选定 Vidu / XMax，进入实时试衣后不再切换。 */
.tryon-panel-host .model-switch { flex:none;display:flex;align-items:center;gap:2px;margin-right:10px;padding:2px;border-radius:999px;background:#f6e7ec;box-shadow:inset 0 0 0 1px #eed6de; }
.tryon-panel-host .model-switch__item { border:0;background:transparent;color:#a8334e;font-size:12px;line-height:1;padding:6px 10px;border-radius:999px;font-weight:600; }
.tryon-panel-host .model-switch__item--active { background:#fff;color:#7d1f36;box-shadow:0 1px 4px #0000001f; }
.tryon-panel-host .grid-cell__image { object-fit:cover; }
.tryon-panel-host .add-frame__title { margin-top:calc(var(--rpx) * 4); font-size:var(--font-size-xs); }
.reopen-panel { position:absolute; z-index:4; bottom:calc(var(--size-tabbar) + env(safe-area-inset-bottom) + 22px); left:50%; transform:translateX(-50%); padding:12px 20px; border-radius:30px; background:#fff; color:var(--color-text-brand-strong); white-space:nowrap; box-shadow:var(--shadow-cta); }
.camera-page .stage { bottom:calc(var(--rpx) * 219 + env(safe-area-inset-bottom)); transition:bottom .22s ease; }
/* 实时试衣 3s 后自动收起底部搭配栏，让摄像头/结果画面满屏；点屏幕恢复。 */
.camera-page.stack-hidden .stage { bottom:0; }
.camera-page .stack,.camera-page .garment-rail,.camera-page .garment-dismiss,.camera-page .camera-status-stack { transition:opacity .2s ease,transform .22s ease; }
.camera-page.stack-hidden .stack,
.camera-page.stack-hidden .garment-rail,
.camera-page.stack-hidden .garment-dismiss,
.camera-page.stack-hidden .camera-status-stack { opacity:0;pointer-events:none;transform:translateY(14px); }
/* 本地预览：默认完整视野不裁切；空出来的区域用同一路画面的模糊放大版填满。
   运行时按实际采集宽高比写入 data-camera-fit：竖屏/近方 → cover（系统相机观感），横向 → contain（保留完整视野）。 */
.camera-page .camera-backdrop { position:absolute; inset:0; visibility:hidden; object-fit:cover; object-position:center; filter:blur(26px) brightness(.55) saturate(1.05); transform:scale(1.12); }
.camera-page.camera-ready .camera-backdrop { visibility:visible; }
.camera-backdrop.mirrored { transform:scale(-1.12,1.12); }
.camera-page .camera-video { position:absolute; inset:0; visibility:hidden; object-fit:contain; object-position:center; }
.camera-page[data-camera-fit="cover"] .camera-video { object-fit:cover; }
.camera-page[data-camera-fit="contain"] .camera-video { object-fit:contain; }
.camera-page[data-camera-fit="cover"] .camera-backdrop { visibility:hidden; }
.camera-page.camera-ready .camera-video { visibility:visible; }
.camera-page.camera-ready .camera-fallback { visibility:hidden; }
.camera-video.mirrored { transform:scaleX(-1); }
.camera-page .stage { background:#2e2027; }
.camera-empty { position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:#fff1f5;background:radial-gradient(ellipse at 50% 40%,#73515e,#30212a);font-size:20px; }
.camera-empty__icon { display:grid;place-items:center;width:68px;height:68px;border-radius:50%;background:#ffffff18; }
.camera-empty__icon img { width:32px;height:32px; }
.camera-empty small { color:#e6cdd7;font-size:12px; }
.camera-page.camera-ready .camera-empty { visibility:hidden; }
/* 试装结果：竖屏合成流铺满取景框；横向合成流完整显示（不裁切头部），空余用同一路结果的模糊背景填充。 */
.camera-page .tryon-video { position:absolute;inset:0;visibility:hidden;object-fit:cover;object-position:center;background:#211920; }
.camera-page[data-tryon-fit="contain"] .tryon-video { object-fit:contain; }
.camera-page .tryon-backdrop { position:absolute;inset:0;visibility:hidden;object-fit:cover;object-position:center;filter:blur(26px) brightness(.55) saturate(1.05);transform:scale(1.12);background:#211920; }
.camera-page.tryon-ready .tryon-video { visibility:visible; }
.camera-page.tryon-ready[data-tryon-fit="contain"] .tryon-backdrop { visibility:visible; }
.camera-page.tryon-ready .camera-backdrop { visibility:hidden; }
/* XMax 模式：官方 SDK 自行挂载本地预览，Vidu 的视频层让位。 */
.camera-page .xmax-layer { position:absolute;inset:0;visibility:hidden; }
.camera-page[data-provider="xmax"] .xmax-layer { visibility:visible; }
.camera-page[data-provider="xmax"] .camera-video,
.camera-page[data-provider="xmax"] .camera-backdrop,
.camera-page[data-provider="xmax"] .tryon-backdrop { visibility:hidden !important; }
.xmax-layer video,.xmax-layer canvas { display:block;width:100%;height:100%;object-fit:cover; }
.xmax-layer.mirrored video,.xmax-layer.mirrored canvas { transform:scaleX(-1); }
/* ?debug=1 诊断浮层：手机截图即可核对采集/结果分辨率与资产版本。 */
.camera-debug { position:absolute;z-index:6;left:calc(var(--rpx) * 23);top:calc(var(--web-top) + 96px);max-width:calc(100% - var(--rpx) * 46);padding:6px 10px;border-radius:8px;background:#000000b0;color:#fff;font:11px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;word-break:break-all; }
.camera-page.tryon-ready .camera-video { visibility:hidden; }
.camera-mode-label { position:absolute;top:calc(var(--web-top) + 52px);left:50%;transform:translateX(-50%);z-index:3;font-size:11px;color:white;background:#34232b99;border-radius:20px;padding:5px 10px;white-space:nowrap; }
/* 试装结果与本地预览保持同一镜像方向。 */
.tryon-video.mirrored { transform:scaleX(-1); }
/* 换装即时预览：用本次参考图给出"已收到"的反馈，避免以为按钮没响应。 */
.switch-preview { position:absolute;z-index:4;left:calc(var(--rpx) * 23);bottom:calc(var(--rpx) * 286 + env(safe-area-inset-bottom));display:flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:14px;background:#34232bcc;color:#fff;font-size:11px;max-width:calc(100% - var(--rpx) * 46);animation:switch-preview-in .18s ease-out; }
.switch-preview img { width:34px;height:46px;object-fit:cover;border-radius:6px;background:#fff;flex:none; }
@keyframes switch-preview-in { from { opacity:0;transform:translateY(6px) } to { opacity:1;transform:none } }
.camera-page .live-status { max-width:calc(100% - 28px);white-space:normal;text-align:center;line-height:1.6;opacity:1;padding:10px 14px;background:#34232be6;color:#fff; }
.config-hint { margin:12px 0 0!important;font-size:12px; }
.camera-page .quota__text { font-size:12px;line-height:1.7; }
.camera-page .hud-back { top:var(--web-top); height:44px; }
.camera-page .quota { left:calc(var(--rpx) * 50); top:calc(var(--web-top) + var(--rpx) * 140); touch-action:none; z-index:5; }
.camera-page .stack { padding-bottom:calc(var(--space-2) + env(safe-area-inset-bottom)); }
.camera-page .outfit-slot { position:relative; }
.camera-page .outfit-slot__choose { display:flex; flex-direction:column; align-items:center; justify-content:center; width:100%; height:100%; }
.camera-page .outfit-slot__image { object-fit:contain; }
.camera-page .outfit-slot__clear { right:calc(50% - var(--outfit-thumb) / 2 - var(--rpx) * 6); top:0; }
.camera-page .garment-rail,.camera-page .garment-dismiss,.camera-page .live-status { bottom:calc(var(--rpx) * 219 + env(safe-area-inset-bottom)); }
.camera-page .garment-rail__expand,.camera-page .garment-rail__remove { display:block; width:100%; }
.camera-page .garment-rail__image { object-fit:contain; }
.camera-page .live-status { z-index:3; }
.data-state,.load-error { padding:32px 16px; text-align:center; color:var(--color-text-secondary); }
.load-error { max-width:430px; margin:auto; }
.load-error button { padding:12px 24px; border-radius:20px; background:var(--color-brand); color:white; }
.toast { position:fixed; z-index:3000; bottom:calc(100px + env(safe-area-inset-bottom)); left:50%; transform:translate(-50%,10px); max-width:90vw; width:max-content; padding:10px 18px; border-radius:10px; color:white; background:rgba(34,25,29,.9); opacity:0; pointer-events:none; transition:opacity .2s,transform .2s; font-size:13px; }
.toast.show { opacity:1; transform:translate(-50%,0); }
.modal { width:min(86vw,350px); padding:24px 22px 12px; border:0; border-radius:18px; color:#372b2e; background:white; box-shadow:0 20px 70px #382e3240; font-size:14px; line-height:1.6; }
.modal::backdrop { background:#22191d70; }
.modal h2 { margin:0 0 12px; font-size:17px; text-align:center; }
.modal p { margin:0 0 20px; white-space:pre-line; color:#574144; text-align:center; }
.modal-buttons { display:flex; gap:12px; border-top:1px solid #f4e7eb; margin-top:14px; padding-top:6px; }
.modal-buttons button { flex:1; min-height:44px; text-align:center; }
.modal-confirm { color:var(--color-text-brand-strong); font-weight:600; }
.search-label { display:block; font-size:12px; margin-bottom:6px; }
.modal input { width:100%; border:1px solid #e5cbd2; padding:12px; border-radius:8px; font:inherit; font-size:16px; outline-color:#a8334e; }
.action-list { display:flex; flex-direction:column; }
.action-list button { min-height:48px; text-align:center; border-bottom:1px solid #f6e9ed; }
.action-list .danger { color:#b33b50; }
.image-preview img { max-width:100%; max-height:65dvh; margin:auto; object-fit:contain; }
/* 演示环境提示：HTTP 下摄像头不可用、iOS 添加到主屏幕。 */
.setup-hint { display:flex;flex-direction:column;gap:2px;width:100%;margin:12px 0 4px;padding:10px 14px;border-radius:12px;text-align:left;background:#fff4e5;color:#7a4a12;box-shadow:0 4px 14px #a8334e14;position:relative; }
.setup-hint__title { font-size:13px;font-weight:600; }
.setup-hint__text { font-size:12px;line-height:1.5; }
.setup-hint--install { background:#eef6ff;color:#245a8f; }
.setup-hint__close { position:absolute;right:10px;top:8px;font-size:16px;line-height:1;opacity:.6; }
/* 错误提示和“改用演示画面”可能同时出现，纵向堆叠，避免两个绝对定位按钮重叠。 */
.camera-status-stack { position:absolute;z-index:3;left:calc(var(--rpx) * 23);right:calc(var(--rpx) * 23);bottom:calc(var(--rpx) * 242 + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:8px; }
.camera-status-stack .live-status { position:static;left:auto;right:auto;margin:0;max-width:none;width:100%; }
.camera-mode-label--demo { background:#7a4a12cc; }
.camera-page .live-status--demo { background:#7a4a12e6; }
@media(min-width:431px){.app-shell{box-shadow:0 0 50px #5a283718;}}
/* 手机横屏禁止使用：显示竖屏引导遮罩。用 max-height 限定，桌面/平板宽屏不受影响。 */
.rotate-hint { display:none; }
@media (orientation: landscape) and (max-height: 520px) {
  .app-shell, .nav-host, .tryon-panel-host { display:none !important; }
  .rotate-hint { position:fixed; inset:0; z-index:5000; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:24px; text-align:center; color:#fff1f5; background:radial-gradient(ellipse at 50% 40%,#73515e,#30212a); }
  .rotate-hint__icon { font-size:44px; line-height:1; animation:rotate-hint 2.4s ease-in-out infinite; }
  .rotate-hint p { margin:0; font-size:16px; font-weight:600; }
  .rotate-hint small { color:#e6cdd7; font-size:12px; }
}
@keyframes rotate-hint { 0%,35% { transform:rotate(0deg) } 60%,100% { transform:rotate(90deg) } }
@media(max-height:500px){.tryon-panel-host .fitting-panel{min-height:0;max-height:calc(100dvh - var(--size-tabbar) - 20px);height:80dvh;}.camera-page .garment-rail__list{height:100px;}.camera-page .quota{top:60px;}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important;}}
