.platform-preview-dialog{width:min(1160px,calc(100vw - 34px));max-width:none;max-height:calc(100dvh - 34px);padding:0;border:1px solid var(--line);border-radius:15px;overflow:auto;background:var(--paper);color:var(--ink);box-shadow:0 25px 100px #10241635}.platform-preview-dialog::backdrop{background:#17221e99;backdrop-filter:none}.preview-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:20px 25px 15px;background:var(--paper)}.preview-heading p{font-size:8px;letter-spacing:1.6px;color:var(--muted);margin:0 0 7px}.preview-heading h2{font-size:24px;letter-spacing:-.7px;margin:0}.preview-heading .icon-button{font-size:27px;font-weight:300}.preview-platform-tabs{display:flex;gap:8px;padding:0 25px 17px;border-bottom:1px solid var(--line);background:var(--paper);overflow-x:auto}.preview-platform-tabs button{display:flex;align-items:center;gap:8px;flex:1;min-width:90px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;font-size:11px;justify-content:center;white-space:nowrap}.preview-platform-tabs img{width:23px;height:23px;object-fit:contain;border-radius:5px;background:white}.preview-platform-tabs button[aria-pressed="true"]{background:#edf3e5;color:var(--green);border-color:#b4c8a2;font-weight:600}.preview-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px}.preview-stage{padding:21px 30px 13px;display:flex;align-items:center;flex-direction:column;background-color:#eef1e9;background-image:radial-gradient(#9ba68e32 1px,transparent 1px);background-size:15px 15px;min-width:0}.preview-stage-caption{display:flex;justify-content:space-between;gap:20px;width:100%;font-size:9px;color:#7d8e72;margin-bottom:17px}.preview-stage-caption>span:first-child{font-weight:600;color:#526c42}.preview-stage-foot{font-size:8px;color:#7e8f73;margin:13px 0 0;text-align:center;line-height:1.8}.platform-phone{color-scheme:light;color:#242424;background:#fff;border:7px solid #29322b;border-radius:32px;width:310px;height:500px;max-width:100%;box-shadow:0 16px 38px #23312522;overflow:hidden;display:flex;flex-direction:column;flex-shrink:0}.scene-status{height:30px;flex-shrink:0;padding:7px 14px 0;display:flex;align-items:start;justify-content:space-between;position:relative;font-size:9px;font-family:Arial,sans-serif;letter-spacing:.3px;background:#fff;color:#161b17}.scene-status>span:last-child{font-size:8px}.scene-camera{position:absolute;width:70px;height:16px;background:#20251f;border-radius:16px;left:calc(50% - 35px);top:3px}.scene-discovery-nav{display:flex;gap:24px;justify-content:center;align-items:center;position:relative;height:41px;flex-shrink:0;font-size:12px;background:#fff}.scene-discovery-nav>strong{position:relative}.scene-discovery-nav>strong:after{content:'';height:3px;background:#ff2442;border-radius:3px;position:absolute;bottom:-8px;left:2px;right:2px}.scene-discovery-nav>b{position:absolute;right:12px;font-size:23px;font-weight:400}.scene-subnav{display:flex;justify-content:space-around;align-items:center;flex-shrink:0;font-size:10px;height:31px;background:#fff;color:#939393;border-bottom:1px solid #f1f1f1}.scene-subnav strong{color:#292929;font-weight:600}.scene-store-header{padding:8px 12px 9px;background:color-mix(in srgb,var(--scene-accent) 15%,#fff);flex-shrink:0}.scene-store-header>div{display:flex;align-items:center;gap:6px}.scene-store-header img{width:23px;height:23px;object-fit:contain;border-radius:6px}.scene-store-header strong{font-size:12px;white-space:nowrap}.scene-search{flex:1;background:#fff;color:#aaa;font-size:9px;line-height:1.5;border-radius:20px;padding:7px 10px;margin-left:5px}.scene-store-header p{font-size:8px;margin:10px 0 0;color:#776b5d}.scene-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;background:#f6f6f4}.scene-list-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:7px;align-items:start}.scene-current-card,.scene-placeholder-card{background:#fff;border-radius:7px;overflow:hidden;min-width:0}.scene-art{overflow:hidden;background:#efefeb;width:100%}.scene-art img{display:block;width:100%;height:100%;object-fit:contain}.platform-preview-dialog[data-preview-fit="cover"] .scene-art:not(.scene-art-detail) img{object-fit:cover}.scene-card-copy{padding:8px 7px}.scene-card-copy h4{font-size:10px;line-height:1.7;margin:0 0 8px;font-weight:500;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:#242424}.scene-price{display:flex;gap:2px;align-items:baseline;line-height:1.5;color:#e94825}.scene-price>span{font-size:10px}.scene-price strong{font-size:18px;font-family:Arial,sans-serif}.scene-price small{font-size:6px;margin-left:auto;color:#9e9e9e;font-weight:400}.scene-card-brand{font-size:7px;color:#999;margin:4px 0 1px}.scene-author{display:flex;align-items:center;gap:4px;color:#888;font-size:7px}.scene-avatar{background:#dce7cf;border-radius:50%;width:18px;height:18px;display:inline-grid;place-items:center;font-size:8px;color:#5c7249;flex-shrink:0}.scene-author>span:nth-child(2){overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:76px}.scene-author b{font-size:16px;font-weight:400;margin-left:auto}.scene-placeholder-art{aspect-ratio:3/4;background:#e9e4d8;display:grid;place-content:center;text-align:center;gap:9px;color:#b6a78d}.scene-placeholder-art>span{font-size:43px;font-weight:300}.scene-placeholder-art small{font-size:7px}.shade-2{background:#dce6df;color:#a2b9a9;aspect-ratio:1}.shade-3{background:#e8e1ed;color:#b5a8c2;aspect-ratio:1}.scene-placeholder-lines{padding:11px 9px;display:flex;flex-direction:column;gap:6px}.scene-placeholder-lines i{height:6px;background:#eceee8;border-radius:4px;width:90%}.scene-placeholder-lines i:last-child{width:60%}.scene-bottom-nav{display:flex;justify-content:space-around;align-items:center;flex-shrink:0;background:#fff;border-top:1px solid #eee;height:45px;padding-bottom:3px}.scene-bottom-nav>span{display:flex;align-items:center;flex-direction:column;font-size:7px;gap:2px;color:#878787}.scene-bottom-nav>span:first-child{color:#202520}.scene-bottom-nav b{font-size:18px;line-height:1;font-weight:400}.scene-detail-bar{display:flex;align-items:center;gap:8px;padding:9px 12px 12px;background:#fff;color:#222;font-size:13px;flex-shrink:0}.scene-detail-bar>span:first-child{font-size:25px;margin-right:2px;line-height:1}.scene-detail-bar .scene-avatar{width:23px;height:23px;font-size:10px}.scene-detail-bar strong{font-size:10px;font-weight:500;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:130px}.scene-follow{color:#d8593c;border:1px solid #e7bbad;border-radius:20px;padding:4px 8px;font-size:8px;margin-left:auto}.scene-detail-copy{padding:14px;background:#fff}.scene-detail-copy h4{font-size:14px;line-height:1.6;color:#202520;margin:7px 0 10px}.scene-detail-copy>p{font-size:10px;line-height:1.9;margin:0 0 12px;color:#686e65}.scene-post-brand{font-size:8px;color:#8b9d7a}.scene-copy-rule{height:1px;background:#ededeb;margin:15px 0}.scene-detail-copy>small{font-size:7px;color:#a8aea2}
.preview-controls{padding:24px 22px;background:var(--paper);min-width:0;border-left:1px solid var(--line)}.preview-control-group{margin-bottom:18px}.preview-controls h3{font-size:12px;font-weight:600;margin:0 0 11px}.preview-segment{display:flex;border:1px solid var(--line);background:var(--bg);border-radius:6px;padding:3px;gap:3px}.preview-segment button{flex:1;font-size:10px;padding:9px 5px;border-radius:4px;line-height:1.4;white-space:nowrap}.preview-segment button[aria-pressed="true"]{background:var(--green);color:var(--paper)}.preview-control-group>p{font-size:9px;line-height:1.8;color:var(--muted);margin:10px 0 0}.preview-design-summary{border-block:1px solid var(--line);padding:13px 0;margin:15px 0}.preview-design-summary>span{font-size:8px;letter-spacing:1px;color:var(--muted)}.preview-design-summary h3{font-size:13px;line-height:1.7;margin:8px 0}.preview-design-summary p{font-size:10px;line-height:1.9;color:var(--muted);margin:0 0 10px}.preview-design-summary small{font-size:9px;color:var(--green)}.preview-simulation-note{padding:12px;background:#eff4e8;border-radius:6px;color:#768b63}.preview-simulation-note b{font-size:10px;font-weight:500}.preview-simulation-note p{font-size:9px;line-height:1.9;margin:5px 0 0}.preview-platform-link{font-size:10px;color:var(--green);display:inline-block;margin-top:17px;line-height:1.8;text-decoration:underline;text-underline-offset:4px}.preview-footer{position:sticky;bottom:0;z-index:2;border-top:1px solid var(--line);display:flex;align-items:center;gap:20px;justify-content:space-between;padding:15px 25px;background:var(--paper)}.preview-footer>p{font-size:9px;line-height:1.8;color:var(--muted);margin:0}.preview-footer>div{display:flex;gap:10px;flex-shrink:0}.preview-footer button{font-size:11px;padding:12px 16px;min-height:39px}.editor-preview-button{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;border:1px solid #afc697;background:#ecf3e2;color:#446d30;padding:13px;border-radius:6px;font-size:11px;font-weight:600;margin:0 0 11px}.editor-preview-button:hover{background:#dfeccf}.editor-preview-button:disabled{cursor:wait}.preview-button-help{font-size:9px;line-height:1.8;color:var(--muted);margin:-4px 0 16px}
:root[data-theme="dark"] .preview-platform-tabs button[aria-pressed="true"]{background:#324529;border-color:#617c47}:root[data-theme="dark"] .preview-stage{background-color:#17221b;background-image:radial-gradient(#8a9e7330 1px,transparent 1px)}:root[data-theme="dark"] .preview-stage-caption>span:first-child{color:#b8d19d}:root[data-theme="dark"] .preview-stage-caption,:root[data-theme="dark"] .preview-stage-foot{color:#9aaf86}:root[data-theme="dark"] .preview-segment button[aria-pressed="true"]{color:#1b281a;background:#bad7aa}:root[data-theme="dark"] .preview-simulation-note{background:#2d3c25;color:#c2d5ac}:root[data-theme="dark"] .editor-preview-button{background:#344829;border-color:#5c7941;color:#daedc2}:root[data-theme="dark"] .editor-preview-button:hover{background:#405a31}
@media(max-width:900px){.preview-layout{grid-template-columns:minmax(0,1fr) 244px}.preview-stage{padding-inline:18px}.preview-controls{padding:22px 17px}.preview-platform-tabs{gap:5px;padding-inline:20px}.preview-platform-tabs button{padding:9px 8px;min-width:83px;font-size:10px}.preview-heading{padding-inline:20px}.preview-heading h2{font-size:22px}.preview-footer{padding-inline:20px;gap:12px}.preview-footer>p{max-width:220px}.platform-phone{width:295px;height:500px}}
@media(max-width:650px){.platform-preview-dialog{width:100vw;max-width:100vw;max-height:96dvh;margin:auto 0 0;border-radius:15px 15px 0 0;border:0}.preview-heading{padding:17px 17px 13px}.preview-heading h2{font-size:21px}.preview-heading p{font-size:7px;margin-bottom:7px}.preview-platform-tabs{display:grid;grid-template-columns:repeat(3,1fr);padding:0 17px 14px;gap:6px;overflow:visible}.preview-platform-tabs button{min-width:0;font-size:10px;padding:8px 6px;gap:6px}.preview-platform-tabs img{width:20px;height:20px}.preview-layout{display:flex;flex-direction:column}.preview-controls{order:0;padding:16px 17px 9px;border-left:0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:14px}.preview-control-group{margin:0}.preview-controls h3{font-size:10px;margin-bottom:8px}.preview-segment button{font-size:9px;padding:8px 4px;white-space:normal}.preview-control-group>p{font-size:8px;line-height:1.8;margin-top:8px}.preview-design-summary,.preview-simulation-note{display:none}.preview-platform-link{font-size:9px;margin:0 0 4px;grid-column:1 / -1}.preview-stage{order:1;padding:18px 13px 12px}.preview-stage-caption{font-size:8px;gap:10px;margin-bottom:14px}.platform-phone{width:min(300px,100%);height:520px;border-width:6px;border-radius:28px}.preview-stage-foot{font-size:8px}.preview-footer{display:block;padding:12px 17px}.preview-footer>p{max-width:100%;font-size:8px;margin:0 0 8px;line-height:1.7}.preview-footer>div{display:flex;gap:9px}.preview-footer button{flex:1;font-size:10px;justify-content:center;padding:11px 8px;min-height:39px}.preview-button-help{font-size:9px}.preview-heading:after{content:'场景模拟 · 实际以平台为准';position:absolute;left:17px;top:75px;font-size:8px;color:var(--muted);display:none}.preview-stage-foot:after{content:' · 场景为示意，实际以平台为准';display:block;margin-top:3px}}



.scene-scroll:focus-visible{outline:2px solid #80a84f;outline-offset:-2px}
