/* 4号：从已认可 style-gallery-v3.html 提取正文；不定义全局壳、外部字体或远程资源。 */ .style-gallery-page, .style-gallery-dialog, .style-gallery-toast { --sg-green:#2f6456; --sg-green-dark:#254e43; --sg-wash:#eaf0ec; --sg-ink:#243b32; --sg-muted:#69786f; --sg-line:#e1e6e2; --sg-paper:#f5f7f5; --sg-white:#fff; --sg-error:#975548; --sg-radius:10px; box-sizing:border-box; color-scheme:light; color:var(--sg-ink); font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif; font-size:14px; line-height:1.6; } /* 根容器只包新正文；不接管 body、main、顶栏或共享抽屉的定位与尺寸。 */ .style-gallery-page { min-width:0; background:var(--sg-paper); } /* 正文基础与本地控件；共享导航壳继续由 navigation.css 负责。 */ :is(.style-gallery-page, .style-gallery-dialog) * { box-sizing:border-box; } :is(.style-gallery-page, .style-gallery-dialog) button, :is(.style-gallery-page, .style-gallery-dialog) input, :is(.style-gallery-page, .style-gallery-dialog) textarea, :is(.style-gallery-page, .style-gallery-dialog) select { font:inherit; } :is(.style-gallery-page, .style-gallery-dialog) button, :is(.style-gallery-page, .style-gallery-dialog) a, :is(.style-gallery-page, .style-gallery-dialog) input, :is(.style-gallery-page, .style-gallery-dialog) textarea, :is(.style-gallery-page, .style-gallery-dialog) select { -webkit-tap-highlight-color:transparent; } :is(.style-gallery-page, .style-gallery-dialog) button { cursor:pointer; } :is(.style-gallery-page, .style-gallery-dialog) a { color:inherit;text-decoration:none; } :is(.style-gallery-page, .style-gallery-dialog) button { color:inherit; } :is(.style-gallery-page, .style-gallery-dialog) button:disabled { cursor:not-allowed;opacity:.6; } :is(.style-gallery-page, .style-gallery-dialog) button:focus-visible, :is(.style-gallery-page, .style-gallery-dialog) a:focus-visible, :is(.style-gallery-page, .style-gallery-dialog) input:focus-visible, :is(.style-gallery-page, .style-gallery-dialog) textarea:focus-visible, :is(.style-gallery-page, .style-gallery-dialog) select:focus-visible, :is(.style-gallery-page, .style-gallery-dialog) summary:focus-visible { outline:3px solid var(--sg-green);outline-offset:4px; } :is(.style-gallery-page, .style-gallery-dialog) h1, :is(.style-gallery-page, .style-gallery-dialog) h2, :is(.style-gallery-page, .style-gallery-dialog) h3, :is(.style-gallery-page, .style-gallery-dialog) p { margin:0; } :is(.style-gallery-page, .style-gallery-dialog) svg { width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0; } :is(.style-gallery-page, .style-gallery-dialog) [hidden] { display:none!important; } :is(.style-gallery-page, .style-gallery-dialog) .sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; } :is(.style-gallery-page, .style-gallery-dialog) .content { padding:26px 32px 48px;max-width:1720px;margin:auto; } /* 26 格目录、搜索、白卡与真实加载／缺图／空态；原编号不合并。 */ :is(.style-gallery-page, .style-gallery-dialog) .page-heading { display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:20px; } :is(.style-gallery-page, .style-gallery-dialog) .page-heading h1 { font-family:"SimSun","Songti SC",serif;font-weight:500;letter-spacing:.035em;font-size:29px;line-height:1.3; } :is(.style-gallery-page, .style-gallery-dialog) .page-heading p { font-size:12px;color:var(--sg-muted);margin-top:7px; } :is(.style-gallery-page, .style-gallery-dialog) .search-wrap { display:flex;align-items:center;gap:10px;width:320px;max-width:100%;height:44px;border:1px solid #d9e1da;background:#fff;border-radius:8px;padding:0 13px; } :is(.style-gallery-page, .style-gallery-dialog) .search-wrap:focus-within { border-color:var(--sg-green); } :is(.style-gallery-page, .style-gallery-dialog) .search-wrap svg { width:17px;height:17px;color:#6a7b70; } :is(.style-gallery-page, .style-gallery-dialog) .search-wrap input { min-width:0;width:100%;height:100%;border:0;outline:0;background:transparent;color:var(--sg-ink);font-size:13px; } :is(.style-gallery-page, .style-gallery-dialog) .search-wrap input:focus-visible { outline:0; } :is(.style-gallery-page, .style-gallery-dialog) .search-wrap input::placeholder { color:#8b958e; } :is(.style-gallery-page, .style-gallery-dialog) .search-clear { display:grid;place-items:center;width:30px;height:32px;border:0;background:transparent;color:var(--sg-muted);font-size:19px; } :is(.style-gallery-page, .style-gallery-dialog) .filter-stack { display:grid;gap:8px; } :is(.style-gallery-page, .style-gallery-dialog) .filter-row { display:flex;align-items:center;gap:5px;min-height:37px;overflow-x:auto;padding:3px 2px 5px;scrollbar-width:thin; } :is(.style-gallery-page, .style-gallery-dialog) .filter-row:focus-within { outline-offset:2px; } :is(.style-gallery-page, .style-gallery-dialog) .filter-row button { flex-shrink:0;min-height:34px;border:1px solid transparent;background:transparent;color:var(--sg-muted);padding:5px 13px;border-radius:6px;font-size:12px;white-space:nowrap; } :is(.style-gallery-page, .style-gallery-dialog) .type-row { border-bottom:1px solid var(--sg-line);gap:8px;padding-bottom:11px; } :is(.style-gallery-page, .style-gallery-dialog) .type-row button { font-size:13px;padding:6px 14px; } :is(.style-gallery-page, .style-gallery-dialog) .filter-row button:hover { color:var(--sg-green);background:#eef2ee; } :is(.style-gallery-page, .style-gallery-dialog) .filter-row button[aria-pressed=true] { background:var(--sg-green);color:#fff; } :is(.style-gallery-page, .style-gallery-dialog) .category-row button[aria-pressed=true] { color:var(--sg-green-dark);background:#e4ece6;border-color:#d4dfd6; } :is(.style-gallery-page, .style-gallery-dialog) .filter-label { font-size:11px;flex-shrink:0;color:#7b897e;margin-right:7px; } :is(.style-gallery-page, .style-gallery-dialog) .results-line { display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0 14px;color:var(--sg-muted);font-size:11px; } :is(.style-gallery-page, .style-gallery-dialog) .results-line strong { font-weight:500;color:var(--sg-ink); } :is(.style-gallery-page, .style-gallery-dialog) .gallery { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 20px; } :is(.style-gallery-page, .style-gallery-dialog) .style-card { display:block;min-width:0;background:#fff;border:1px solid #e1e6e2;border-radius:var(--sg-radius);overflow:hidden;transition:border-color .17s,box-shadow .17s,transform .17s; } :is(.style-gallery-page, .style-gallery-dialog) .style-card:hover { border-color:#9ab2a0;box-shadow:0 8px 22px #284c3510;transform:translateY(-2px); } :is(.style-gallery-page, .style-gallery-dialog) .style-card:focus-visible { outline-offset:4px; } :is(.style-gallery-page, .style-gallery-dialog) .card-media { position:relative;height:230px;background:#edf0eb;overflow:hidden; } :is(.style-gallery-page, .style-gallery-dialog) .card-media img { display:block;width:100%;height:100%;object-fit:contain;object-position:center;transition:transform .25s; } :is(.style-gallery-page, .style-gallery-dialog) .style-card:hover img { transform:none; } :is(.style-gallery-page, .style-gallery-dialog) .card-enter { position:absolute;right:12px;bottom:12px;display:flex;align-items:center;gap:5px;padding:5px 8px;border-radius:5px;background:#ffffffed;color:var(--sg-green-dark);font-size:11px;opacity:0;transition:opacity .15s; } :is(.style-gallery-page, .style-gallery-dialog) .card-enter svg { width:14px;height:14px; } :is(.style-gallery-page, .style-gallery-dialog) .style-card:hover .card-enter, :is(.style-gallery-page, .style-gallery-dialog) .style-card:focus-visible .card-enter { opacity:1; } :is(.style-gallery-page, .style-gallery-dialog) .card-body { padding:12px 14px 13px; } :is(.style-gallery-page, .style-gallery-dialog) .card-body h2 { font-weight:600;font-size:14px;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; } :is(.style-gallery-page, .style-gallery-dialog) .card-meta { display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px;min-height:21px; } :is(.style-gallery-page, .style-gallery-dialog) .tags { display:flex;flex-wrap:wrap;gap:4px;min-width:0; } :is(.style-gallery-page, .style-gallery-dialog) .tag { font-size:10px;color:#597260;background:#f0f4ef;padding:1px 6px;border-radius:3px;white-space:nowrap; } :is(.style-gallery-page, .style-gallery-dialog) .provenance { font-size:10px;color:#819084;white-space:nowrap; } :is(.style-gallery-page, .style-gallery-dialog) .image-missing { height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;gap:8px;color:#7e8a80;padding:18px;font-size:12px; } :is(.style-gallery-page, .style-gallery-dialog) .image-missing svg { width:29px;height:29px;stroke-width:1.2; } :is(.style-gallery-page, .style-gallery-dialog) .image-missing small { font-size:10px; } :is(.style-gallery-page, .style-gallery-dialog) .gallery-foot { margin:30px 0 0;border-top:1px solid var(--sg-line);padding-top:18px;font-size:11px;color:var(--sg-muted);text-align:center; } :is(.style-gallery-page, .style-gallery-dialog) .empty { padding:70px 24px;text-align:center;background:#fff;border:1px dashed #d6ded7;border-radius:10px; } :is(.style-gallery-page, .style-gallery-dialog) .empty svg { width:32px;height:32px;color:#8c9d8e;margin-bottom:14px; } :is(.style-gallery-page, .style-gallery-dialog) .empty h2 { font-size:18px;font-weight:500; } :is(.style-gallery-page, .style-gallery-dialog) .empty p { font-size:13px;margin:8px 0 20px;color:var(--sg-muted); } :is(.style-gallery-page, .style-gallery-dialog) .button { display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:10px 17px;border:1px solid #d4ded5;border-radius:7px;background:#fff;color:var(--sg-green-dark);font-size:13px;font-weight:500; } :is(.style-gallery-page, .style-gallery-dialog) .button:hover { background:#f3f6f2; } :is(.style-gallery-page, .style-gallery-dialog) .button.primary { background:var(--sg-green);border-color:var(--sg-green);color:#fff; } :is(.style-gallery-page, .style-gallery-dialog) .button.primary:hover { background:var(--sg-green-dark); } :is(.style-gallery-page, .style-gallery-dialog) .button.quiet { background:transparent;border-color:transparent;padding-left:0; } :is(.style-gallery-page, .style-gallery-dialog) .button.small { font-size:12px;padding:6px 11px;min-height:36px; } :is(.style-gallery-page, .style-gallery-dialog) .gallery-loading { height:150px;border-radius:10px;border:1px dashed var(--sg-line);display:grid;place-items:center;color:var(--sg-muted);font-size:13px; } /* 左右创作详情、完整参考图、上传、表单与折叠设置。 */ :is(.style-gallery-page, .style-gallery-dialog) .detail-back { margin-bottom:18px;font-size:12px;gap:6px;min-height:40px; } :is(.style-gallery-page, .style-gallery-dialog) .detail-back svg { width:17px;height:17px; } :is(.style-gallery-page, .style-gallery-dialog) .detail-grid { display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:40px;align-items:start; } :is(.style-gallery-page, .style-gallery-dialog) .reference-panel { min-width:0; } :is(.style-gallery-page, .style-gallery-dialog) .reference-frame { display:block;width:100%;height:560px;border:1px solid #dfe6df;border-radius:10px;overflow:hidden;background:#e9eee7;padding:0;position:relative; } :is(.style-gallery-page, .style-gallery-dialog) .reference-frame img { display:block;width:100%;height:100%;object-fit:contain; } :is(.style-gallery-page, .style-gallery-dialog) .enlarge-hint { position:absolute;right:14px;bottom:14px;display:flex;align-items:center;gap:5px;color:var(--sg-green-dark);font-size:11px;background:#fffffff2;border:1px solid #e0e6dc;border-radius:5px;padding:6px 10px; } :is(.style-gallery-page, .style-gallery-dialog) .enlarge-hint svg { width:15px;height:15px; } :is(.style-gallery-page, .style-gallery-dialog) .source-label { margin:14px 0 7px;font-size:12px;font-weight:600;color:#566d5d; } :is(.style-gallery-page, .style-gallery-dialog) .source-note, :is(.style-gallery-page, .style-gallery-dialog) .source-info { font-size:11px;line-height:1.8;color:var(--sg-muted); } :is(.style-gallery-page, .style-gallery-dialog) .source-info { margin-top:9px;overflow-wrap:anywhere; } :is(.style-gallery-page, .style-gallery-dialog) .source-info a { text-decoration:underline;text-underline-offset:3px; } :is(.style-gallery-page, .style-gallery-dialog) .detail-form { min-width:0; } :is(.style-gallery-page, .style-gallery-dialog) .detail-form h1 { font-family:"SimSun","Songti SC",serif;font-weight:500;font-size:30px;letter-spacing:.03em;line-height:1.4; } :is(.style-gallery-page, .style-gallery-dialog) .original-name { font-family:Georgia,"Times New Roman",serif;color:#8a958d;font-size:12px;margin-top:4px; } :is(.style-gallery-page, .style-gallery-dialog) .style-description { font-size:12px;color:var(--sg-muted);margin-top:12px;line-height:1.9;max-width:50ch; } :is(.style-gallery-page, .style-gallery-dialog) .detail-divider { height:1px;background:var(--sg-line);margin:21px 0; } :is(.style-gallery-page, .style-gallery-dialog) .field { margin-top:19px; } :is(.style-gallery-page, .style-gallery-dialog) .field-label { display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px;font-size:13px;font-weight:600; } :is(.style-gallery-page, .style-gallery-dialog) .optional { font-size:11px;font-weight:400;color:var(--sg-muted); } :is(.style-gallery-page, .style-gallery-dialog) .use-options { display:flex;flex-wrap:wrap;gap:7px; } :is(.style-gallery-page, .style-gallery-dialog) .use-options button { border:1px solid #dce3dc;border-radius:6px;background:#fff;min-height:36px;padding:7px 12px;font-size:12px;color:var(--sg-muted); } :is(.style-gallery-page, .style-gallery-dialog) .use-options button[aria-pressed=true] { border-color:#9fb9a7;background:#e9f0e9;color:var(--sg-green-dark); } :is(.style-gallery-page, .style-gallery-dialog) .field-help { font-size:11px;color:var(--sg-muted);line-height:1.8;margin-top:7px; } :is(.style-gallery-page, .style-gallery-dialog) .upload { position:relative;display:flex;align-items:center;gap:14px;background:#fff;border:1px dashed #b8cabb;border-radius:8px;padding:17px;min-height:103px; } :is(.style-gallery-page, .style-gallery-dialog) .upload-symbol { display:grid;place-items:center;width:51px;height:60px;border:1px solid #dce5dc;border-radius:5px;color:#6b8b72;background:#f5f8f3;flex-shrink:0; } :is(.style-gallery-page, .style-gallery-dialog) .upload-symbol img { width:100%;height:100%;object-fit:contain;border-radius:4px; } :is(.style-gallery-page, .style-gallery-dialog) .upload-text { min-width:0;flex:1; } :is(.style-gallery-page, .style-gallery-dialog) .upload-text strong { display:block;font-size:12px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:210px; } :is(.style-gallery-page, .style-gallery-dialog) .upload-text p { font-size:10px;color:var(--sg-muted);margin-top:4px; } :is(.style-gallery-page, .style-gallery-dialog) .upload-actions { display:flex;gap:6px;align-items:center;flex-shrink:0; } :is(.style-gallery-page, .style-gallery-dialog) .file-input { position:absolute;width:1px;height:1px;opacity:0;pointer-events:none; } :is(.style-gallery-page, .style-gallery-dialog) .remove-upload { min-width:30px;height:34px;border:0;background:transparent;color:var(--sg-muted);padding:4px; } :is(.style-gallery-page, .style-gallery-dialog) .text-input { display:block;width:100%;border:1px solid #d7e0d7;border-radius:7px;background:#fff;min-height:44px;padding:11px 12px;line-height:1.7;color:var(--sg-ink);font-size:12px; } :is(.style-gallery-page, .style-gallery-dialog) textarea.text-input { resize:vertical;min-height:91px; } :is(.style-gallery-page, .style-gallery-dialog) textarea.text-input.short { min-height:73px; } :is(.style-gallery-page, .style-gallery-dialog) .text-input::placeholder { color:#94a095; } :is(.style-gallery-page, .style-gallery-dialog) .more-settings { border-top:1px solid var(--sg-line);border-bottom:1px solid var(--sg-line);margin-top:23px; } :is(.style-gallery-page, .style-gallery-dialog) .more-settings summary { padding:14px 2px;font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;list-style:none; } :is(.style-gallery-page, .style-gallery-dialog) .more-settings summary::-webkit-details-marker { display:none; } :is(.style-gallery-page, .style-gallery-dialog) .more-settings summary:after { content:"＋";font-size:16px;color:var(--sg-green); } :is(.style-gallery-page, .style-gallery-dialog) .more-settings[open] summary:after { content:"−"; } :is(.style-gallery-page, .style-gallery-dialog) .settings-grid { display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:0 0 17px; } :is(.style-gallery-page, .style-gallery-dialog) .settings-grid label { font-size:11px;color:var(--sg-muted); } :is(.style-gallery-page, .style-gallery-dialog) .settings-grid select { display:block;width:100%;margin-top:6px;min-height:40px;padding:7px;border:1px solid #d5dfd6;border-radius:6px;background:#fff;font-size:12px;color:var(--sg-ink); } :is(.style-gallery-page, .style-gallery-dialog) .form-actions { display:flex;gap:10px;margin-top:21px; } :is(.style-gallery-page, .style-gallery-dialog) .form-actions .primary { flex:1; } :is(.style-gallery-page, .style-gallery-dialog) .form-actions svg { width:16px;height:16px; } :is(.style-gallery-page, .style-gallery-dialog) .design-note { font-size:10px;color:#7f8d81;margin-top:10px;line-height:1.8; } :is(.style-gallery-page, .style-gallery-dialog) .form-message { margin-top:12px;padding:12px 14px;border:1px solid #c8dbcc;background:#eef5ef;color:#365e41;border-radius:7px;font-size:12px;line-height:1.8; } :is(.style-gallery-page, .style-gallery-dialog) .form-message.error { border-color:#dfcfc5;background:#faf3ed;color:var(--sg-error); } /* 原生放大与批量弹层；同根放置即可，根外弹层须加 style-gallery-dialog。 */ .style-gallery-page dialog, dialog.style-gallery-dialog { padding:0;border:1px solid #d7e1d7;border-radius:12px;background:#fff;color:var(--sg-ink);box-shadow:0 20px 90px #163e2520;max-width:calc(100vw - 28px);max-height:calc(100dvh - 40px); } .style-gallery-page dialog::backdrop, dialog.style-gallery-dialog::backdrop { background:#1a3026a3; } :is(.style-gallery-page, .style-gallery-dialog) .dialog-head { display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 20px;border-bottom:1px solid var(--sg-line); } :is(.style-gallery-page, .style-gallery-dialog) .dialog-head h2 { font-size:16px;font-weight:500; } :is(.style-gallery-page, .style-gallery-dialog) .dialog-close { height:36px;min-width:36px;border:0;background:transparent;font-size:25px;line-height:1;color:var(--sg-muted); } .style-gallery-page .lightbox, dialog.style-gallery-dialog.lightbox { width:min(1000px,calc(100vw - 28px));background:#f5f7f4; } .style-gallery-page .lightbox .dialog-head, dialog.style-gallery-dialog.lightbox .dialog-head { background:#fff; } :is(.style-gallery-page, .style-gallery-dialog) .lightbox-image { display:block;width:100%;height:min(74dvh,900px);object-fit:contain; } :is(.style-gallery-page, .style-gallery-dialog) .lightbox-caption { padding:11px 20px;font-size:11px;color:var(--sg-muted); } .style-gallery-page .batch-dialog, dialog.style-gallery-dialog.batch-dialog { width:510px; } :is(.style-gallery-page, .style-gallery-dialog) .dialog-body { padding:21px; } :is(.style-gallery-page, .style-gallery-dialog) .dialog-body>p { font-size:12px;color:var(--sg-muted);line-height:1.8; } :is(.style-gallery-page, .style-gallery-dialog) .batch-list { list-style:none;margin:17px 0 0;padding:0;display:grid;gap:9px; } :is(.style-gallery-page, .style-gallery-dialog) .batch-item { display:flex;gap:13px;align-items:center;padding:9px;border:1px solid var(--sg-line);border-radius:7px; } :is(.style-gallery-page, .style-gallery-dialog) .batch-thumb { width:48px;height:56px;background:#f0f2ec;overflow:hidden;flex-shrink:0;border-radius:4px; } :is(.style-gallery-page, .style-gallery-dialog) .batch-thumb img { width:100%;height:100%;object-fit:contain; } :is(.style-gallery-page, .style-gallery-dialog) .batch-item div:nth-child(2) { flex:1;min-width:0; } :is(.style-gallery-page, .style-gallery-dialog) .batch-item strong { font-size:12px;display:block; } :is(.style-gallery-page, .style-gallery-dialog) .batch-item p { font-size:10px;color:var(--sg-muted);margin-top:3px; } :is(.style-gallery-page, .style-gallery-dialog) .batch-item button { min-height:36px;background:transparent;border:0;font-size:11px;color:var(--sg-muted);padding:6px; } :is(.style-gallery-page, .style-gallery-dialog) .batch-empty { padding:26px 0;text-align:center;color:var(--sg-muted);font-size:13px; } :is(.style-gallery-page, .style-gallery-dialog) .dialog-bottom { padding:16px 21px;border-top:1px solid var(--sg-line); } :is(.style-gallery-page, .style-gallery-dialog) .dialog-bottom .button { width:100%; } .style-gallery-page .toast, .style-gallery-toast { position:fixed;bottom:24px;left:calc(var(--rail, 0px) + (100vw - var(--rail, 0px))/2);transform:translateX(-50%);z-index:150;max-width:min(520px,calc(100vw - 36px));background:#294f42;color:#fff;padding:12px 19px;border-radius:8px;font-size:12px;box-shadow:0 7px 25px #173e2429;white-space:normal; } /* 沿用认可稿断点：大桌面四列，中间宽度三列／两列，手机两列。 */ @media(min-width:1700px) { :is(.style-gallery-page, .style-gallery-dialog) .card-media { height:240px; } :is(.style-gallery-page, .style-gallery-dialog) .gallery { gap:24px; } } @media(max-width:1200px) and (min-width:701px) { :is(.style-gallery-page, .style-gallery-dialog) .gallery { grid-template-columns:repeat(3,minmax(0,1fr)); } :is(.style-gallery-page, .style-gallery-dialog) .card-media { height:220px; } :is(.style-gallery-page, .style-gallery-dialog) .detail-grid { gap:24px; } :is(.style-gallery-page, .style-gallery-dialog) .reference-frame { height:480px; } :is(.style-gallery-page, .style-gallery-dialog) .upload { flex-wrap:wrap; } :is(.style-gallery-page, .style-gallery-dialog) .upload-actions { margin-left:auto; } :is(.style-gallery-page, .style-gallery-dialog) .content { padding:26px 25px 48px; } :is(.style-gallery-page, .style-gallery-dialog) .page-heading { gap:15px; } :is(.style-gallery-page, .style-gallery-dialog) .search-wrap { width:270px; } :is(.style-gallery-page, .style-gallery-dialog) .card-body { padding:11px; } } @media(max-width:950px) and (min-width:701px) { :is(.style-gallery-page, .style-gallery-dialog) .gallery { grid-template-columns:repeat(2,minmax(0,1fr)); } :is(.style-gallery-page, .style-gallery-dialog) .detail-grid { grid-template-columns:1fr; } :is(.style-gallery-page, .style-gallery-dialog) .reference-frame { height:440px; } :is(.style-gallery-page, .style-gallery-dialog) .reference-panel { max-width:none; } :is(.style-gallery-page, .style-gallery-dialog) .page-heading { align-items:flex-start;flex-direction:column; } :is(.style-gallery-page, .style-gallery-dialog) .search-wrap { width:100%; } :is(.style-gallery-page, .style-gallery-dialog) .detail-form { max-width:none; } } @media(max-width:700px) { :is(.style-gallery-page, .style-gallery-dialog) .content { padding:21px 14px 30px; } :is(.style-gallery-page, .style-gallery-dialog) .page-heading { display:block;margin-bottom:13px; } :is(.style-gallery-page, .style-gallery-dialog) .page-heading h1 { font-size:27px; } :is(.style-gallery-page, .style-gallery-dialog) .page-heading p { font-size:11px;margin-top:6px; } :is(.style-gallery-page, .style-gallery-dialog) .search-wrap { width:100%;height:42px;margin-top:16px; } :is(.style-gallery-page, .style-gallery-dialog) .filter-stack { gap:5px; } :is(.style-gallery-page, .style-gallery-dialog) .type-row { gap:2px;padding-bottom:7px; } :is(.style-gallery-page, .style-gallery-dialog) .filter-row button { padding:5px 10px;min-height:33px;font-size:11px; } :is(.style-gallery-page, .style-gallery-dialog) .category-row { gap:2px; } :is(.style-gallery-page, .style-gallery-dialog) .filter-label { font-size:10px;margin-right:3px; } :is(.style-gallery-page, .style-gallery-dialog) .results-line { margin:9px 0 12px;font-size:10px; } :is(.style-gallery-page, .style-gallery-dialog) .results-line .results-note { display:none; } :is(.style-gallery-page, .style-gallery-dialog) .gallery { grid-template-columns:repeat(2,minmax(0,1fr));gap:15px 12px; } :is(.style-gallery-page, .style-gallery-dialog) .card-media { height:205px; } :is(.style-gallery-page, .style-gallery-dialog) .card-body { padding:10px 10px 11px; } :is(.style-gallery-page, .style-gallery-dialog) .card-body h2 { font-size:13px; } :is(.style-gallery-page, .style-gallery-dialog) .card-meta { display:block;margin-top:5px; } :is(.style-gallery-page, .style-gallery-dialog) .tag { font-size:9px;padding:1px 5px; } :is(.style-gallery-page, .style-gallery-dialog) .tags { gap:3px;min-height:18px; } :is(.style-gallery-page, .style-gallery-dialog) .provenance { font-size:9px;display:block;margin-top:4px; } :is(.style-gallery-page, .style-gallery-dialog) .card-enter { display:none; } :is(.style-gallery-page, .style-gallery-dialog) .gallery-foot { font-size:10px;line-height:1.9;margin-top:22px; } :is(.style-gallery-page, .style-gallery-dialog) .detail-back { margin-bottom:13px; } :is(.style-gallery-page, .style-gallery-dialog) .detail-grid { grid-template-columns:1fr;gap:24px; } :is(.style-gallery-page, .style-gallery-dialog) .reference-frame { height:350px;border-radius:9px; } :is(.style-gallery-page, .style-gallery-dialog) .source-label { margin-top:11px; } :is(.style-gallery-page, .style-gallery-dialog) .source-note, :is(.style-gallery-page, .style-gallery-dialog) .source-info { font-size:10px; } :is(.style-gallery-page, .style-gallery-dialog) .source-info { margin-top:5px; } :is(.style-gallery-page, .style-gallery-dialog) .detail-form h1 { font-size:27px; } :is(.style-gallery-page, .style-gallery-dialog) .style-description { font-size:11px; } :is(.style-gallery-page, .style-gallery-dialog) .detail-divider { margin:17px 0; } :is(.style-gallery-page, .style-gallery-dialog) .field { margin-top:18px; } :is(.style-gallery-page, .style-gallery-dialog) .upload { gap:11px;padding:13px; } :is(.style-gallery-page, .style-gallery-dialog) .upload-symbol { width:43px;height:54px; } :is(.style-gallery-page, .style-gallery-dialog) .upload-text strong { max-width:155px; } :is(.style-gallery-page, .style-gallery-dialog) .upload-actions .button { padding:6px 9px;font-size:11px; } :is(.style-gallery-page, .style-gallery-dialog) .use-options { gap:6px; } :is(.style-gallery-page, .style-gallery-dialog) .use-options button { padding:7px 10px; } :is(.style-gallery-page, .style-gallery-dialog) .form-actions { gap:8px; } :is(.style-gallery-page, .style-gallery-dialog) .form-actions .button { font-size:12px;padding:11px 13px; } :is(.style-gallery-page, .style-gallery-dialog) .empty { padding:48px 17px; } :is(.style-gallery-page, .style-gallery-dialog) .empty h2 { font-size:16px; } :is(.style-gallery-page, .style-gallery-dialog) .empty p { font-size:12px; } .style-gallery-page .toast, .style-gallery-toast { left:50%;bottom:18px;width:max-content; } :is(.style-gallery-page, .style-gallery-dialog) .dialog-head { padding:12px 15px; } :is(.style-gallery-page, .style-gallery-dialog) .dialog-head h2 { font-size:14px; } :is(.style-gallery-page, .style-gallery-dialog) .dialog-body { padding:17px; } :is(.style-gallery-page, .style-gallery-dialog) .lightbox-image { height:68dvh; } :is(.style-gallery-page, .style-gallery-dialog) .lightbox-caption { padding:10px 15px;font-size:10px; } } @media(prefers-reduced-motion:reduce) { :is(.style-gallery-page, .style-gallery-dialog) * { scroll-behavior:auto!important; } :is(.style-gallery-page, .style-gallery-dialog) .style-card, :is(.style-gallery-page, .style-gallery-dialog) .card-media img, :is(.style-gallery-page, .style-gallery-dialog) .card-enter { transition:none; } :is(.style-gallery-page, .style-gallery-dialog) .style-card:hover { transform:none; } :is(.style-gallery-page, .style-gallery-dialog) .style-card:hover img { transform:none; } } @media(max-width:700px) { :is(.style-gallery-page, .style-gallery-dialog) button, :is(.style-gallery-page, .style-gallery-dialog) .button { min-height:44px;min-width:44px; } :is(.style-gallery-page, .style-gallery-dialog) .search-wrap input { min-height:48px;padding-right:52px; } :is(.style-gallery-page, .style-gallery-dialog) .detail-back { min-height:44px; } :is(.style-gallery-page, .style-gallery-dialog) .filter-row button { min-height:44px; } :is(.style-gallery-page, .style-gallery-dialog) .use-options button, :is(.style-gallery-page, .style-gallery-dialog) .upload-actions .button, :is(.style-gallery-page, .style-gallery-dialog) .dialog-close { min-height:44px;min-width:44px; } :is(.style-gallery-page, .style-gallery-dialog) .remove-upload { width:44px;min-width:44px;height:44px; } } /* 固定原编号与可折叠来源记录。 */ :is(.style-gallery-page, .style-gallery-dialog) .sample-number { position:absolute;top:10px;left:10px;display:grid;place-items:center;min-width:32px;min-height:30px;padding:2px 8px;border:1px solid #dbe4dc;border-radius:5px;background:#fffffff2;font-size:12px;font-weight:600;color:var(--sg-green-dark); } :is(.style-gallery-page, .style-gallery-dialog) .sample-id { font-size:11px;font-weight:600;color:#4d6b57; } :is(.style-gallery-page, .style-gallery-dialog) .local-status { margin-top:9px;font-size:12px;color:var(--sg-green-dark);line-height:1.8; } :is(.style-gallery-page, .style-gallery-dialog) .source-details { border-top:1px solid var(--sg-line);margin-top:14px; } :is(.style-gallery-page, .style-gallery-dialog) .source-details summary { display:flex;align-items:center;min-height:44px;padding:10px 0;font-size:12px;color:var(--sg-green-dark);cursor:pointer; } :is(.style-gallery-page, .style-gallery-dialog) .source-details .source-info { margin:0 0 10px;overflow-wrap:anywhere; } :is(.style-gallery-page, .style-gallery-dialog) .source-details .source-info a { display:inline-flex;align-items:center;min-height:44px; } /* 触控与完整图片补齐：桌面和手机控件均不少于44px；删除按钮不会挤掉上传文字。 */ :is(.style-gallery-page, .style-gallery-dialog) :is(button, .button, select, summary) { min-width:44px; min-height:44px; } .style-gallery-page *::before, .style-gallery-page *::after, .style-gallery-dialog *::before, .style-gallery-dialog *::after { box-sizing:border-box; } /* 这些原稿紧凑控件的选择器更具体，单独补齐以免36px规则盖过触控下限。 */ :is(.style-gallery-page, .style-gallery-dialog) .button.small, :is(.style-gallery-page, .style-gallery-dialog) .filter-row button, :is(.style-gallery-page, .style-gallery-dialog) .use-options button, :is(.style-gallery-page, .style-gallery-dialog) .settings-grid select, :is(.style-gallery-page, .style-gallery-dialog) .batch-item button { min-width:44px; min-height:44px; } :is(.style-gallery-page, .style-gallery-dialog) .button:focus-visible { outline:3px solid var(--sg-green); outline-offset:4px; } :is(.style-gallery-page, .style-gallery-dialog) .search-wrap { height:auto; min-height:46px; padding-right:0; } :is(.style-gallery-page, .style-gallery-dialog) .search-wrap:focus-within { outline:3px solid var(--sg-green); outline-offset:2px; } :is(.style-gallery-page, .style-gallery-dialog) .search-wrap input { height:44px; min-height:44px; padding-right:0; } :is(.style-gallery-page, .style-gallery-dialog) .search-clear { flex-shrink:0; width:44px; height:44px; } :is(.style-gallery-page, .style-gallery-dialog) .remove-upload { flex-shrink:0; width:44px; min-width:44px; height:44px; min-height:44px; } :is(.style-gallery-page, .style-gallery-dialog) .upload-text strong { max-width:100%; } :is(.style-gallery-page, .style-gallery-dialog) .upload-symbol img { display:block; object-fit:contain; } :is(.style-gallery-page, .style-gallery-dialog) #detail-image { display:block; width:100%; height:100%; } :is(.style-gallery-page, .style-gallery-dialog) .image-missing { width:100%; } :is(.style-gallery-page, .style-gallery-dialog) #lightbox-media .image-missing { display:flex; min-height:min(50dvh,500px); } :is(.style-gallery-page, .style-gallery-dialog) :is(.gallery-loading, .empty, .form-message) { overflow-wrap:anywhere; } :is(.style-gallery-page, .style-gallery-dialog) .gallery-loading { grid-column:1 / -1; } :is(.style-gallery-page, .style-gallery-dialog) [aria-busy="true"] { cursor:progress; } :is(.style-gallery-page, .style-gallery-dialog) .batch-item strong, :is(.style-gallery-page, .style-gallery-dialog) .batch-item p { overflow-wrap:anywhere; } .style-gallery-dialog[hidden], .style-gallery-toast[hidden] { display:none!important; } /* 手机上传行允许自然换行，保留完整图片和44px移除／更换控件。 */ @media(max-width:700px) { .style-gallery-page .upload { flex-wrap:wrap; } .style-gallery-page .upload-actions { margin-left:auto; } } /* 标题仅承接换页后的程序焦点；移除浏览器黑框，交互控件的可见键盘焦点保持。 */ .style-gallery-page h1[tabindex="-1"]:focus { outline:none; } /* 已确认的模型选择稿：模型/清晰度常显；原图及原Skill决定内容，不保留自由要求输入。 */ :is(.style-gallery-page,.style-gallery-dialog) .model-picker{margin:20px 0 22px;padding:0;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)} :is(.style-gallery-page,.style-gallery-dialog) .model-picker label{font-size:13px;font-weight:600;color:var(--sg-ink)} :is(.style-gallery-page,.style-gallery-dialog) .model-picker select{font-size:13px;min-height:44px;margin-top:9px;padding:10px 12px} :is(.style-gallery-page,.style-gallery-dialog) .model-help{grid-column:1/-1;margin-top:-8px;color:var(--sg-muted);font-size:11px;font-weight:400} @media(max-width:700px){ :is(.style-gallery-page,.style-gallery-dialog) .model-picker{gap:12px} /* 与已认可手机稿一致：先选择模型和原图，风格参考在表单之后。 */ :is(.style-gallery-page,.style-gallery-dialog) .detail-form{order:1} :is(.style-gallery-page,.style-gallery-dialog) .reference-panel{order:2} } /* 仅返回按钮覆盖 quiet 的透明底与左侧零内边距；组合类优先于手机通用按钮规则，保持认可稿的收拢左对齐和统一间距。 */ :is(.style-gallery-page, .style-gallery-dialog) .button.quiet.detail-back { display:inline-flex;align-items:center;justify-content:center;justify-self:start;align-self:start; width:fit-content;max-width:100%;min-width:0;min-height:44px;height:44px;gap:8px; margin:0 0 20px;padding:11px 14px;border:1px solid #cbd8cf;border-radius:6px; background:#fff;color:#2f6456;font-size:14px;font-weight:500;line-height:20px;white-space:nowrap; transition:background-color 150ms ease-out,border-color 150ms ease-out; } :is(.style-gallery-page, .style-gallery-dialog) .button.quiet.detail-back svg { display:block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none; } :is(.style-gallery-page, .style-gallery-dialog) .button.quiet.detail-back:hover { background:#eaf0ec;border-color:#aabeb2;color:#254e43; } :is(.style-gallery-page, .style-gallery-dialog) .button.quiet.detail-back:active { background:#e2eae4; } :is(.style-gallery-page, .style-gallery-dialog) .button.quiet.detail-back:focus-visible { outline:2px solid #2f6456;outline-offset:3px; } @media(prefers-reduced-motion:reduce) { /* 返回入口遵循系统减少动态效果设置。 */ :is(.style-gallery-page, .style-gallery-dialog) .button.quiet.detail-back { transition:none; } } /* 61号：批准A的风格目录与真实详情布局增量；共享材质由后加载的49号CSS提供。 仅在服务端注入A标记后启用，不接管页面壳、业务状态、独立艺术模块或批量流程。 */ body[data-studio-ui="a"] :is(.style-gallery-page,.style-gallery-dialog,.style-gallery-toast) { --sg-green:var(--studio-ink,#3D3158); --sg-green-dark:var(--studio-ink,#3D3158); --sg-wash:var(--studio-lilac,#EBE6F6); --sg-ink:var(--studio-ink,#3D3158); --sg-muted:var(--studio-muted,#6C6279); --sg-line:var(--studio-line,#DCD6E7); --sg-paper:var(--studio-page,#FAFBFD); --sg-error:var(--studio-danger,#A13848); --sg-radius:var(--studio-radius-md,16px); font-family:var(--studio-sans,"Microsoft YaHei",sans-serif); font-size:15px; line-height:1.75; } /* 正文按批准稿的32px节奏收口；min-width清除网格和长错误文本的最小内容宽度。 */ body[data-studio-ui="a"] .style-gallery-page .content { width:100%;max-width:1440px;min-width:0;margin-inline:auto;padding:32px 32px 56px; } body[data-studio-ui="a"] .style-gallery-page :is(.page-heading,.gallery,.detail-grid,.reference-panel,.detail-form,#job-output,#batch-output) { min-width:0;max-width:100%; } body[data-studio-ui="a"] .style-gallery-page .page-heading { gap:24px;align-items:flex-end;margin-bottom:24px;flex-wrap:wrap; } body[data-studio-ui="a"] .style-gallery-page .page-heading>div:first-child { min-width:0;flex:1 1 320px; } body[data-studio-ui="a"] .style-gallery-page :is(.page-heading h1,.detail-form h1) { font-family:var(--studio-display,Georgia,"Songti SC",serif);font-size:32px; font-weight:600;line-height:1.35;letter-spacing:.01em;overflow-wrap:anywhere; } body[data-studio-ui="a"] .style-gallery-page .page-heading p { font-size:15px;line-height:1.8;margin-top:10px; } body[data-studio-ui="a"] .style-gallery-page .search-wrap { width:340px;min-width:0;max-width:100%;flex:0 1 340px;min-height:52px; } body[data-studio-ui="a"] .style-gallery-page .search-wrap input { font-size:15px; } body[data-studio-ui="a"] .style-gallery-page .results-line { flex-wrap:wrap;gap:8px 16px;font-size:14px;line-height:1.7;margin:16px 0 24px;overflow-wrap:anywhere; } /* 62号合同：原生分类按钮在搜索旁独立排列；只用aria-pressed表达选中，颜色沿用49号映射。 桌面允许换行；手机仅导航自身横滚，不使用负边距或视口宽度撑开body。 */ body[data-studio-ui="a"] .style-gallery-page nav#studio-category-filter.studio-categories { display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:0;max-width:100%; margin:0 0 20px;padding:4px 3px 8px;box-sizing:border-box; } body[data-studio-ui="a"] .style-gallery-page #studio-category-filter button.category { display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:0 0 auto; min-width:44px;min-height:44px;padding:9px 15px;line-height:1.5;font-size:14px; white-space:nowrap;border-width:1px;border-style:solid;border-color:transparent; } body[data-studio-ui="a"] .style-gallery-page #studio-category-filter button.category span { font-size:12px;font-variant-numeric:tabular-nums; } body[data-studio-ui="a"] .style-gallery-page #studio-category-filter button.category[aria-pressed="true"] { border-color:currentColor;font-weight:600;text-decoration:underline;text-underline-offset:5px; } body[data-studio-ui="a"] .style-gallery-page #studio-category-filter button.category:focus-visible { outline:3px solid var(--studio-ink,#3D3158);outline-offset:2px; } /* 正常35款与批量SG26共用真实gallery；不用数量或nth-child隐藏卡片。 四列作品以3:4画框完整contain展示，标题自然换行，不裁切用户认可的公开图像。 */ body[data-studio-ui="a"] .style-gallery-page .gallery { grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 20px; } body[data-studio-ui="a"] .style-gallery-page .style-card { background:transparent;border:0;border-radius:0;overflow:visible;box-shadow:none; } body[data-studio-ui="a"] .style-gallery-page .style-card:hover { box-shadow:none; } body[data-studio-ui="a"] .style-gallery-page .card-media { height:auto;aspect-ratio:3/4;padding:18px;border:1px solid var(--studio-line,#DCD6E7); border-radius:var(--studio-radius-md,16px);background:var(--studio-surface,#fff); } body[data-studio-ui="a"] .style-gallery-page .card-media img { width:100%;height:100%;max-width:100%;object-fit:contain;object-position:center;transform:none; } body[data-studio-ui="a"] .style-gallery-page .card-body { padding:12px 0 0;min-width:0; } body[data-studio-ui="a"] .style-gallery-page .card-body h2 { font-size:17px;font-weight:600;line-height:1.5;white-space:normal;overflow:visible;overflow-wrap:anywhere; } body[data-studio-ui="a"] .style-gallery-page .card-meta { gap:6px 10px;flex-wrap:wrap;align-items:flex-start;margin-top:8px; } body[data-studio-ui="a"] .style-gallery-page :is(.tag,.provenance) { font-size:12px;max-width:100%; } body[data-studio-ui="a"] .style-gallery-page .tag { color:var(--studio-muted,#6C6279);background:var(--studio-tray,#F2EFF8);white-space:normal;overflow-wrap:anywhere; } body[data-studio-ui="a"] .style-gallery-page :is(.provenance,.source-label,.sample-id,.search-wrap svg) { color:var(--studio-muted,#6C6279); } body[data-studio-ui="a"] .style-gallery-page .card-enter { opacity:1;font-size:12px; } body[data-studio-ui="a"] .style-gallery-page :is(.gallery-foot,.gallery-license) { font-size:13px;line-height:1.8;overflow-wrap:anywhere; } body[data-studio-ui="a"] .style-gallery-page .gallery-license { margin:0;padding:0 32px 24px;text-align:center; } /* 真实详情：左侧完整样片和最近结果，右侧参数与输入；保持原DOM与原提交按钮。 普通模型、清晰度、画幅全部常显，长型号可收缩，选项与能力仍由原JS决定。 */ body[data-studio-ui="a"] .style-gallery-page .detail-grid { grid-template-columns:minmax(0,1fr) 350px;gap:32px;align-items:start; } body[data-studio-ui="a"] .style-gallery-page .reference-frame { height:600px;padding:24px;border-color:var(--studio-line,#DCD6E7); border-radius:var(--studio-radius-lg,20px);background:var(--studio-surface,#fff); } body[data-studio-ui="a"] .style-gallery-page :is(.reference-frame img,#detail-image) { width:100%;height:100%;min-width:0;object-fit:contain; } body[data-studio-ui="a"] .style-gallery-page .detail-form { padding:26px;border:1px solid var(--studio-line,#DCD6E7);border-radius:var(--studio-radius-lg,20px); background:var(--studio-surface,#fff); } body[data-studio-ui="a"] .style-gallery-page .detail-form h1 { font-size:28px; } body[data-studio-ui="a"] .style-gallery-page :is(.field-label,.settings-grid label) { font-size:14px;line-height:1.7; } body[data-studio-ui="a"] .style-gallery-page :is(.source-note,.source-info,.local-status,.field-help,.model-help,.design-note,.source-details summary,.source-label) { font-size:14px;line-height:1.8;overflow-wrap:anywhere; } body[data-studio-ui="a"] .style-gallery-page :is(.settings-grid,.model-picker) { grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-width:0;padding:0; } body[data-studio-ui="a"] .style-gallery-page .settings-grid label { min-width:0;max-width:100%; } body[data-studio-ui="a"] .style-gallery-page .settings-grid select { width:100%;min-width:0;max-width:100%;min-height:48px;font-size:14px;padding:10px 12px; } body[data-studio-ui="a"] .style-gallery-page .model-help { grid-column:1/-1;margin:0; } body[data-studio-ui="a"] .style-gallery-page .detail-divider { margin:24px 0; } /* 窄工具栏的上传区可自然换行；文件名全文折行，原file-input的隐藏机制不变。 */ body[data-studio-ui="a"] .style-gallery-page .upload { flex-wrap:wrap;gap:12px;padding:16px; } body[data-studio-ui="a"] .style-gallery-page .upload-text { flex:1 1 130px;min-width:0; } body[data-studio-ui="a"] .style-gallery-page .upload-text strong { font-size:14px;white-space:normal;overflow:visible;overflow-wrap:anywhere; } body[data-studio-ui="a"] .style-gallery-page .upload-text p { font-size:12px;overflow-wrap:anywhere; } body[data-studio-ui="a"] .style-gallery-page .upload-actions { flex-wrap:wrap;max-width:100%;margin-left:auto; } body[data-studio-ui="a"] .style-gallery-page .form-actions { flex-wrap:wrap;gap:10px;margin-top:24px; } body[data-studio-ui="a"] .style-gallery-page .form-actions .button { min-width:44px;max-width:100%;white-space:normal;overflow-wrap:anywhere; } body[data-studio-ui="a"] .style-gallery-page .form-actions .primary { flex:1 1 100%;min-height:54px;font-size:16px; } body[data-studio-ui="a"] .style-gallery-page .button.quiet.detail-back { height:auto;min-height:44px;white-space:normal;line-height:1.5; background:var(--studio-lilac,#EBE6F6);border-color:var(--studio-line,#DCD6E7); color:var(--studio-ink,#3D3158);border-radius:var(--studio-radius-pill,999px); } body[data-studio-ui="a"] .style-gallery-page .button.quiet.detail-back:focus-visible { outline-color:var(--studio-ink,#3D3158); } /* 原稿primary:hover权重高于共享层，局部仅桥接49号材质变量；禁用始终最后覆盖。 不改disabled/aria-disabled属性，也不替代控制器的原号核对或提交防重逻辑。 */ @media(hover:hover) and (pointer:fine) { body[data-studio-ui="a"] :is(.style-gallery-page,.style-gallery-dialog) .button:where(:not(:disabled):not([aria-disabled="true"])):hover { background:var(--studio-lilac,#EBE6F6);color:var(--studio-ink,#3D3158);border-color:var(--studio-line,#DCD6E7); } } body[data-studio-ui="a"] .style-gallery-page .button.primary { color:var(--studio-ink,#3D3158);background:var(--studio-primary-fill,#F8E8AC);border-color:#DFCE94; } @media(hover:hover) and (pointer:fine) { body[data-studio-ui="a"] .style-gallery-page .button.primary:where(:not(:disabled):not([aria-disabled="true"])):hover { color:var(--studio-ink,#3D3158);background:var(--studio-primary-hover,#F3DFA0);border-color:#D3BA76; } body[data-studio-ui="a"] .style-gallery-page .button.quiet.detail-back:where(:not(:disabled):not([aria-disabled="true"])):hover { background:var(--studio-sky,#E6EEF9);border-color:var(--studio-line,#DCD6E7);color:var(--studio-ink,#3D3158); } } body[data-studio-ui="a"] .style-gallery-page .button.quiet.detail-back:where(:not(:disabled):not([aria-disabled="true"])):active { background:var(--studio-sky,#E6EEF9); } body[data-studio-ui="a"] .style-gallery-page .button:is(:disabled,[aria-disabled="true"]), body[data-studio-ui="a"] .style-gallery-page .button.primary:is(:disabled,[aria-disabled="true"]), body[data-studio-ui="a"] .style-gallery-page .button.quiet.detail-back:is(:disabled,[aria-disabled="true"]) { color:var(--studio-disabled-ink,#797183);background:var(--studio-disabled-fill,#ECE9F0); border-color:var(--studio-disabled-line,#B7ADBF);opacity:1;transform:none;box-shadow:none; } /* 任务状态与最近成果完整保留；清除figure默认两侧40px边距，不限制结果图高度。 已有批量篮仍是原flex结构，不把它套进详情网格；超长任务号与错误可换行。 */ body[data-studio-ui="a"] :is(.style-gallery-page,.style-gallery-dialog) :is(.form-message,.batch-item,.batch-item p,.dialog-head h2,.dialog-body>p,.toast) { min-width:0;max-width:100%;overflow-wrap:anywhere;font-size:14px; } body[data-studio-ui="a"] .style-gallery-page :is(#job-output,#batch-output) { margin-top:24px; } body[data-studio-ui="a"] .style-gallery-page [data-result-figure] { margin:16px 0;min-width:0;max-width:100%; } body[data-studio-ui="a"] .style-gallery-page :is([data-result-figure] img,.lightbox-image) { max-width:100%;object-fit:contain; } body[data-studio-ui="a"] .style-gallery-page [data-result-figure] figcaption { margin:10px 0;font-size:13px;overflow-wrap:anywhere; } body[data-studio-ui="a"] .style-gallery-page :is(#job-output,#batch-output) .button { max-width:100%;white-space:normal;overflow-wrap:anywhere; } body[data-studio-ui="a"] :is(.style-gallery-page,.style-gallery-dialog) .batch-list { min-width:0;max-width:100%; } body[data-studio-ui="a"] :is(.style-gallery-page,.style-gallery-dialog) .batch-item { flex-wrap:wrap; } body[data-studio-ui="a"] :is(.style-gallery-page,.style-gallery-dialog) .batch-item>div:nth-child(2) { flex:1 1 150px; } body[data-studio-ui="a"] :is(.style-gallery-page,.style-gallery-dialog) .batch-item button { max-width:100%;white-space:normal; } body[data-studio-ui="a"] :is(.style-gallery-page,.style-gallery-dialog) .dialog-head { min-width:0; } body[data-studio-ui="a"] :is(.style-gallery-page,.style-gallery-dialog) :is(.dialog-body,#job-output,#batch-output) table { display:block;max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain; } /* 中等屏幕三列目录；详情在900px收为输入优先单列，不隐藏样片、正文和最近结果。 */ @media(max-width:1120px) { body[data-studio-ui="a"] .style-gallery-page .content { padding:30px 24px 56px; } body[data-studio-ui="a"] .style-gallery-page .gallery { grid-template-columns:repeat(3,minmax(0,1fr)); } body[data-studio-ui="a"] .style-gallery-page .detail-grid { grid-template-columns:minmax(0,1fr) 310px;gap:22px; } body[data-studio-ui="a"] .style-gallery-page .detail-form { padding:22px; } } @media(max-width:900px) { body[data-studio-ui="a"] .style-gallery-page .detail-grid { grid-template-columns:minmax(0,1fr);gap:26px; } body[data-studio-ui="a"] .style-gallery-page .detail-form { order:1; } body[data-studio-ui="a"] .style-gallery-page .reference-panel { order:2; } body[data-studio-ui="a"] .style-gallery-page .reference-frame { height:520px; } } /* 手机两列作品与自身横滚分类；全部/清除按钮不隐藏，模型能力与批量入口保持可见。 */ @media(max-width:760px) { body[data-studio-ui="a"] .style-gallery-page .content { padding:26px 18px 52px; } body[data-studio-ui="a"] .style-gallery-page .page-heading { display:flex;align-items:stretch;gap:18px;margin-bottom:20px; } body[data-studio-ui="a"] .style-gallery-page .page-heading>div:first-child { flex:1 1 100%; } body[data-studio-ui="a"] .style-gallery-page .page-heading h1 { font-size:30px; } body[data-studio-ui="a"] .style-gallery-page .search-wrap { width:100%;flex:1 1 100%;margin:0; } body[data-studio-ui="a"] .style-gallery-page nav#studio-category-filter.studio-categories { flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin; scroll-padding-inline:3px;-webkit-overflow-scrolling:touch; } body[data-studio-ui="a"] .style-gallery-page .results-line { margin:14px 0 20px; } body[data-studio-ui="a"] .style-gallery-page .results-line .results-note { display:block;font-size:13px; } body[data-studio-ui="a"] .style-gallery-page .gallery { grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px; } body[data-studio-ui="a"] .style-gallery-page .card-media { height:auto;padding:11px; } body[data-studio-ui="a"] .style-gallery-page .card-body { padding:10px 0 0; } body[data-studio-ui="a"] .style-gallery-page .card-body h2 { font-size:15px; } body[data-studio-ui="a"] .style-gallery-page .card-enter { display:flex;font-size:11px;right:6px;bottom:6px; } body[data-studio-ui="a"] .style-gallery-page .sample-number { min-width:28px;font-size:11px;top:6px;left:6px; } body[data-studio-ui="a"] .style-gallery-page .reference-frame { height:440px;padding:18px; } body[data-studio-ui="a"] .style-gallery-page .detail-form h1 { font-size:26px; } body[data-studio-ui="a"] .style-gallery-page .gallery-license { padding-inline:18px; } } /* 减少动态的两路入口覆盖旧卡片hover移动；不清零弹层或toast的定位transform。 */ @media(prefers-reduced-motion:reduce) { body[data-studio-ui="a"] .style-gallery-page :is(.style-card,.card-media img,.card-enter,.detail-back) { transition:none;animation:none; } body[data-studio-ui="a"] .style-gallery-page .style-card:hover { transform:none; } } body[data-studio-ui="a"][data-reduce-motion="true"] .style-gallery-page :is(.style-card,.card-media img,.card-enter,.detail-back) { transition:none;animation:none; } body[data-studio-ui="a"][data-reduce-motion="true"] .style-gallery-page .style-card:hover { transform:none; }