:root { --studio-shell: #101a2c; --studio-shell-2: #13243a; --studio-hover: #192f4a; --studio-active: #1f4268; --studio-accent: #2bb7aa; --studio-bg: #f3f7f7; --studio-text: #17212b; --studio-muted: #66737f; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin: 0; min-height: 100%; }
body { font-family: Arial, "Microsoft YaHei", "PingFang SC", sans-serif; color: var(--studio-text); background: var(--studio-bg); }
button, input { font: inherit; }
.login-view { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: #e9eeee; }
.login-panel { width: min(420px, 100%); padding: 36px; border: 1px solid #d4dfdf; border-radius: 8px; background: #fff; box-shadow: 0 16px 40px rgba(16, 34, 40, .1); }
.login-kicker { margin: 0 0 14px; color: #0f766e; font-size: 12px; font-weight: 800; letter-spacing: 0; }
.login-panel h1 { margin: 0; font-size: 28px; line-height: 1.25; }
.login-subtitle { margin: 8px 0 28px; color: var(--studio-muted); font-size: 14px; }
.field { display: grid; gap: 7px; margin-top: 16px; }
.field label { font-size: 13px; font-weight: 700; }
.field input { width: 100%; min-height: 40px; border: 1px solid #cbd7d9; border-radius: 6px; padding: 9px 11px; color: var(--studio-text); background: #fff; }
.field input:focus { outline: 0; border-color: #0f766e; box-shadow: 0 0 0 3px rgba(15,118,110,.15); }
.form-error { margin: 14px 0 0; color: #b42318; font-size: 13px; line-height: 1.5; }
.field-error { margin: 6px 0 0; color: #b42318; font-size: 12px; line-height: 1.4; }
.required-mark { color: #b42318; font-weight: 700; }
.login-button { width: 100%; margin-top: 24px; min-height: 42px; }
.shell { display: flex; min-height: 100vh; }
.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 10; display: flex; width: 240px; min-height: 100vh; flex-direction: column; padding: 20px 14px 16px; color: #f8fafc; background: var(--studio-shell); overflow-y: auto; }
.brand { display: flex; align-items: center; gap: 11px; flex: 0 0 auto; padding: 0 8px 20px; border-bottom: 1px solid rgba(255,255,255,.09); }
.brand-mark { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid rgba(43,183,170,.7); border-radius: 6px; color: #b7fff7; font-size: 11px; font-weight: 800; }
.brand strong, .brand small, .operator-card strong, .operator-card small { display: block; }
.brand strong { font-size: 14px; line-height: 1.35; }.brand small { margin-top: 2px; color: #8fa2b5; font-size: 11px; }
.primary-nav { display: grid; gap: 14px; margin-top: 16px; padding-bottom: 16px; }.nav-group { display:grid; gap:3px; }.nav-group--divided { padding-top: 14px; border-top: 1px solid rgba(255,255,255,.09); }.nav-group-title { margin:0 10px 6px; color:#8fa2b5; font-size:11px; font-weight:700; }.nav-item { display: flex; align-items: center; gap: 11px; min-height: 38px; width: 100%; padding: 0 10px; border: 0; border-left: 3px solid transparent; border-radius: 5px; color: #bdc9d6; background: transparent; text-align: left; cursor: pointer; }.nav-item:hover { background: var(--studio-hover); color: #fff; }.nav-item.active { border-left-color: var(--studio-accent); color: #fff; background: var(--studio-active); font-weight: 700; }.nav-item-icon { width: 17px; height: 17px; flex: 0 0 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }.nav-item-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; line-height: 1.4; }
.sidebar-footer { margin-top: auto; padding-top: 8px; border-top: 1px solid rgba(255,255,255,.09); }.operator-card { padding: 13px 10px 12px; }.operator-label { display: block; margin-bottom: 7px; color: #8fa2b5; font-size: 11px; }.operator-card strong { font-size: 13px; }.operator-card small { margin-top: 4px; color: #bdc9d6; font-size: 11px; }.logout-button { width: 100%; min-height: 36px; border: 1px solid rgba(255,255,255,.18); border-radius: 5px; color: #f8fafc; background: transparent; cursor: pointer; }.logout-button:hover, .logout-button:focus-visible { border-color: var(--studio-accent); outline: none; }
.workspace { width: calc(100% - 240px); min-width: 0; margin-left: 240px; }.topbar { display: flex; align-items: center; min-height: 56px; padding: 0 28px; color: #fff; background: var(--studio-shell); }.topbar-copy { display:flex; min-width:0; align-items:baseline; }.topbar-title { font-size: 15px; font-weight: 700; }.topbar-context { margin-left: 12px; color: #bdc9d6; font-size: 12px; }.topbar-operator { margin-left:auto; color:#bdc9d6; font-size:12px; }.nav-toggle, .nav-close { display: none; margin-right: 12px; border: 0; color: #fff; background: transparent; font-size: 20px; cursor: pointer; }.content { width: min(1480px, calc(100% - 48px)); margin: 0 auto; padding: 24px 0 48px; }.content-header { display: flex; justify-content: space-between; gap: 20px; align-items: end; margin-bottom: 24px; }.eyebrow { margin: 0 0 7px; color: #0f766e; font-size: 12px; font-weight: 800; }.content h1 { margin: 0; font-size: 24px; line-height: 1.25; }.content-intro { margin: 8px 0 0; color: var(--studio-muted); font-size: 14px; }.module-state { padding: 28px; border: 1px solid #d9e3e5; border-radius: 8px; background: #fff; }.module-state strong { display: block; margin-top:12px; font-size: 18px; }.module-state p { margin: 10px 0 0; color: var(--studio-muted); }.module-state-badge { display:inline-flex; min-height:24px; align-items:center; padding:3px 8px; border-radius:999px; color:#8a4b08; background:#fff3df; font-size:12px; font-weight:700; }
.operations-page { display:grid; gap:20px; }.operations-intro { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }.operations-intro h1 { margin:0; font-size:24px; line-height:1.25; }.operations-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }.operations-card { display:grid; grid-template-columns:56px minmax(0,1fr); gap:14px; min-width:0; padding:18px; border:1px solid #d9e3e5; border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.04); }.operations-card-mark { display:flex; width:56px; height:56px; align-items:center; justify-content:center; border-radius:12px; color:#155e59; background:#e5f5f2; font-size:14px; font-weight:800; text-align:center; }.operations-card-copy { min-width:0; }.operations-card h2 { margin:2px 0 6px; font-size:16px; }.operations-card p { min-height:40px; margin:0; color:var(--studio-muted); font-size:13px; line-height:1.55; }.operations-card-meta { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:16px; }.operations-card-meta > span { color:var(--studio-muted); font-size:11px; }.operations-card .ax-admin-button { min-height:34px; padding:0 10px; white-space:nowrap; }.operations-external-mark { margin-left:4px; }.operations-unavailable { color:var(--studio-muted); font-size:12px; }
.operations-group { display:grid; gap:12px; }.operations-group > h2 { margin:0; padding-bottom:8px; border-bottom:1px solid #d9e3e5; font-size:17px; }.operations-pinned-mark { margin-left:8px; color:#0f766e; font-size:10px; font-weight:700; }.operations-pin-button { margin-top:10px; padding:0; border:0; color:#52626b; background:transparent; font:inherit; font-size:11px; cursor:pointer; }.operations-pin-button:hover { color:#0f766e; }.operations-manager { display:grid; gap:14px; padding:16px; border:1px solid #d9e3e5; border-radius:8px; background:#fff; }.operations-manager-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }.operations-manager-heading h2, .operations-manager-form h3 { margin:0; font-size:15px; }.operations-manager-close, .operations-manager-actions button { min-height:30px; padding:4px 8px; border:1px solid #d9e3e5; border-radius:4px; color:#34434b; background:#fff; font:inherit; font-size:12px; cursor:pointer; }.operations-manager-bank, .operations-manager-form { display:flex; align-items:end; flex-wrap:wrap; gap:10px; padding:12px; border:1px solid #e2ebeb; border-radius:6px; background:#f8fafa; }.operations-manager-form { align-items:stretch; }.operations-manager-form h3 { flex:0 0 100%; }.operations-manager-bank label, .operations-manager-form label { display:grid; flex:1 1 180px; gap:5px; color:#52626b; font-size:12px; }.operations-manager-bank input, .operations-manager-form input, .operations-manager-form select { width:100%; min-height:36px; padding:7px 9px; border:1px solid #cbd7d9; border-radius:4px; color:var(--studio-text); background:#fff; font:inherit; font-size:13px; }.operations-manager-form > div { display:flex; align-items:center; gap:8px; }.operations-manager-list { display:grid; gap:6px; max-height:420px; overflow:auto; margin:0; padding:0; list-style:none; }.operations-manager-list li { display:flex; align-items:center; justify-content:space-between; gap:12px; min-width:0; padding:8px 0; border-bottom:1px solid #edf2f2; }.operations-manager-list li > span:first-child { display:grid; min-width:0; gap:3px; }.operations-manager-list strong { overflow-wrap:anywhere; font-size:12px; }.operations-manager-list small { color:var(--studio-muted); font-size:11px; }.operations-manager-actions { display:flex; flex:0 0 auto; flex-wrap:wrap; justify-content:flex-end; gap:4px; }
.overview-intro { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:20px; }.overview-greeting { margin:0 0 7px; color:#0f766e; font-size:13px; font-weight:700; }.overview-intro h1 { font-size:24px; }.quick-actions { display:flex; gap:10px; flex-wrap:wrap; }.overview-layout { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr); grid-template-areas:"projects status" "customers status"; gap:16px; align-items:start; }.overview-section { min-width:0; overflow:hidden; border:1px solid #d9e3e5; border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.04); }.overview-section--projects { grid-area:projects; }.overview-section--status { grid-area:status; }.overview-section--customers { grid-area:customers; }.section-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:17px 18px; border-bottom:1px solid #e6eeee; }.section-heading h2 { margin:0; font-size:16px; }.section-heading p { margin:4px 0 0; color:var(--studio-muted); font-size:12px; }.overview-list { display:grid; }.overview-list-row { display:grid; grid-template-columns:minmax(0,1fr) auto 150px; gap:14px; align-items:center; width:100%; min-height:64px; padding:10px 18px; border:0; border-bottom:1px solid #edf2f2; color:var(--studio-text); background:#fff; text-align:left; cursor:pointer; }.overview-list-row:last-child { border-bottom:0; }.overview-list-row:hover { background:#f8fafa; }.overview-list-row--customer { grid-template-columns:minmax(0,1fr) 150px; }.overview-list-main { min-width:0; }.overview-list-main strong, .overview-list-main small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.overview-list-main strong { font-size:13px; }.overview-list-main small { margin-top:5px; color:var(--studio-muted); font-size:12px; }.overview-list-row time { color:var(--studio-muted); font-size:11px; text-align:right; }.status-overview { display:grid; grid-template-columns:1fr 1fr; margin:0; padding:0; list-style:none; }.status-overview li { display:flex; align-items:center; justify-content:space-between; min-height:54px; padding:10px 16px; border-right:1px solid #edf2f2; border-bottom:1px solid #edf2f2; }.status-overview li:nth-child(2n) { border-right:0; }.status-overview span { color:var(--studio-muted); font-size:12px; }.status-overview strong { font-size:18px; }.overview-empty, .overview-state { padding:36px 20px; text-align:center; }.overview-empty strong, .overview-state strong { display:block; font-size:15px; }.overview-empty p, .overview-state p { margin:8px 0 0; color:var(--studio-muted); font-size:13px; }.overview-state { border:1px solid #d9e3e5; border-radius:8px; background:#fff; }.overview-state .ax-admin-button { margin-top:16px; }.overview-state--error strong, .overview-state--error p { color:#b42318; }
.scrim { display: none; }
.operations-grid { container-type: inline-size; }
.template-design-page { display:grid; gap:20px; }
.template-design-header { margin-bottom:0; }
.template-design-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.template-design-card { display:grid; grid-template-columns:52px minmax(0,1fr); gap:14px; min-width:0; padding:18px; border:1px solid #d9e3e5; border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.04); }
.template-design-card-icon { display:flex; width:52px; height:52px; align-items:center; justify-content:center; border-radius:8px; color:#155e59; background:#e5f5f2; font-size:18px; font-weight:800; }
.template-design-card h2 { margin:1px 0 6px; font-size:17px; }
.template-design-card p { margin:0; color:var(--studio-muted); font-size:13px; line-height:1.55; }
.template-design-tags { display:block; margin-top:10px; color:#155e59; font-size:12px; font-weight:700; line-height:1.5; }
.template-design-note { display:block; margin-top:8px; color:#8a4b08; font-size:12px; line-height:1.5; }
.template-design-card .ax-admin-button { grid-column:2; justify-self:start; margin-top:2px; text-decoration:none; }
.template-design-scenarios { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(260px,.8fr); gap:24px; align-items:start; padding:20px; border:1px solid #d9e3e5; border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.04); }
.template-design-scenarios h2 { margin:0; font-size:18px; line-height:1.35; }
.template-design-scenarios p:not(.eyebrow) { margin:8px 0 0; color:var(--studio-muted); font-size:13px; line-height:1.6; }
.template-design-scenarios ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:0; padding:0; list-style:none; }
.template-design-scenarios li { display:flex; align-items:center; gap:8px; min-height:38px; padding:8px 10px; border:1px solid #e2ebeb; border-radius:6px; color:#155e59; background:#f8fbfb; font-size:13px; font-weight:700; }
.template-design-scenario-mark { display:inline-flex; width:20px; height:20px; align-items:center; justify-content:center; border-radius:50%; color:#fff; background:#0f766e; font-size:12px; }
@media (max-width:1100px) { .operations-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) { .operations-intro { align-items:stretch; flex-direction:column; }.operations-intro > .ax-admin-button { width:100%; }.operations-grid { grid-template-columns:1fr; }.operations-card { grid-template-columns:48px minmax(0,1fr); padding:16px; }.operations-card-mark { width:48px; height:48px; }.operations-card-meta { align-items:stretch; flex-direction:column; }.operations-card .ax-admin-button { width:100%; }.operations-manager { padding:12px; }.operations-manager-bank, .operations-manager-form { align-items:stretch; flex-direction:column; }.operations-manager-bank > .ax-admin-button, .operations-manager-form > div > .ax-admin-button { width:100%; }.operations-manager-list li { align-items:flex-start; flex-direction:column; }.operations-manager-actions { justify-content:flex-start; } }
@media (max-width:900px) { .template-design-grid { grid-template-columns:1fr; }.template-design-scenarios { grid-template-columns:1fr; } }
@media (max-width:600px) { .template-design-card { grid-template-columns:44px minmax(0,1fr); padding:16px; }.template-design-card-icon { width:44px; height:44px; }.template-design-card .ax-admin-button { grid-column:1 / -1; width:100%; }.template-design-scenarios { padding:16px; }.template-design-scenarios ul { grid-template-columns:1fr; } }
.customer-toolbar { display:flex; justify-content:space-between; align-items:end; gap:16px; margin-bottom:16px; padding:16px; border:1px solid #d9e3e5; border-radius:8px; background:#fff; }
.search-form { display:flex; align-items:end; flex-wrap:wrap; gap:10px; min-width:0; }
.search-form label { width:100%; color:var(--studio-muted); font-size:12px; font-weight:700; }
.search-form input, .search-form select, .field select { width:min(360px, 52vw); min-height:40px; padding:9px 11px; border:1px solid #cbd7d9; border-radius:6px; color:var(--studio-text); background:#fff; }
.field select { width:100%; }
.project-customer-picker { display:flex; align-items:center; gap:12px; }
.project-customer-picker select { flex:1 1 auto; min-width:0; }
.project-customer-create { flex:0 0 auto; white-space:nowrap; }
.field-help { color:var(--studio-muted); font-size:12px; line-height:1.5; }
.customer-panel { border:1px solid #d9e3e5; border-radius:8px; background:#fff; overflow:hidden; }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; min-width:760px; }
th, td { padding:13px 16px; border-bottom:1px solid #e6eeee; text-align:left; font-size:13px; white-space:nowrap; }
th { color:var(--studio-muted); background:#f8fafa; font-size:12px; }
tbody tr:last-child td { border-bottom:0; }
.row-actions { display:flex; gap:12px; }
.status-badge { display:inline-flex; align-items:center; min-height:24px; padding:3px 8px; border-radius:999px; color:#155e59; background:#e0f2ef; font-size:12px; font-weight:700; }
.text-button { padding:4px 0; border:0; color:#0f766e; background:transparent; cursor:pointer; font-size:13px; font-weight:700; }
.text-button:hover { color:#0b5f59; text-decoration:underline; }
.text-button--danger { color:#b42318; }
.ax-admin-button--danger { border-color:#b42318; color:#fff; background:#b42318; }
.ax-admin-button--danger:hover { border-color:#8f1d14; background:#8f1d14; }
.state-panel { padding:48px 24px; text-align:center; }
.state-panel strong { display:block; font-size:16px; }
.state-panel p { margin:10px 0 18px; color:var(--studio-muted); font-size:13px; }
.state-panel--error strong, .state-panel--error p { color:#b42318; }
.overlay { position:fixed; inset:0; z-index:20; display:flex; justify-content:flex-end; padding:20px; background:rgba(16,26,44,.45); }
.dialog, .drawer { width:min(600px, 100%); max-height:calc(100vh - 40px); overflow:auto; padding:24px; border-radius:8px; background:#fff; box-shadow:0 20px 56px rgba(17,31,38,.2); }
.drawer { width:min(520px, 100%); }
.dialog-header { display:flex; justify-content:space-between; gap:16px; align-items:start; margin-bottom:22px; }
.dialog-header h2 { margin:0; font-size:20px; }
.dialog-header p { margin:6px 0 0; color:var(--studio-muted); font-size:13px; }
.icon-button { width:32px; height:32px; border:1px solid #cbd7d9; border-radius:6px; color:var(--studio-text); background:#fff; cursor:pointer; font-size:20px; line-height:1; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 16px; align-items:start; }
.field--full { grid-column:1 / -1; }
.field textarea { width:100%; resize:vertical; padding:9px 11px; border:1px solid #cbd7d9; border-radius:6px; color:var(--studio-text); }
.dialog-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:22px; }
.detail-list { display:grid; grid-template-columns:110px minmax(0,1fr); gap:0; margin:0; }
.detail-list dt, .detail-list dd { padding:12px 0; border-bottom:1px solid #e6eeee; font-size:14px; }
.detail-list dt { color:var(--studio-muted); }.detail-list dd { margin:0; }.detail-notes { white-space:pre-wrap; line-height:1.6; }
.project-photos { margin-top:24px; padding-top:20px; border-top:1px solid #e6eeee; }
.project-photos-heading { display:flex; align-items:start; justify-content:space-between; gap:16px; margin-bottom:14px; }.project-photos-heading h3 { margin:0; font-size:16px; }.project-photos-heading p { margin:5px 0 0; color:var(--studio-muted); font-size:12px; }.project-photos-actions { position:relative; flex:0 0 auto; }.project-photo-input { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; }
.project-upload-panel { display:grid; gap:12px; margin:0 0 16px; padding:14px; border:1px solid #cfe3e1; border-radius:8px; background:#f2faf8; }.project-upload-copy { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }.project-upload-copy strong { font-size:13px; }.project-upload-copy span, .project-upload-footer span { color:var(--studio-muted); font-size:12px; }.project-upload-list { display:grid; gap:6px; margin:0; padding:0; list-style:none; }.project-upload-item { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(76px,auto); align-items:center; gap:10px; min-width:0; padding:8px 10px; border:1px solid #dcebea; border-radius:6px; background:#fff; }.project-upload-name { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; }.project-upload-size { color:var(--studio-muted); font-size:11px; white-space:nowrap; }.project-upload-status { color:#53656c; font-size:12px; text-align:right; white-space:nowrap; }.project-upload-item--uploading .project-upload-status { color:#2563eb; }.project-upload-item--success .project-upload-status { color:#15803d; }.project-upload-item--error .project-upload-status { color:#b42318; }.project-upload-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; }.project-upload-footer .ax-admin-button { flex:0 0 auto; }
.project-photos-state { padding:28px 18px; border:1px dashed #cbd7d9; border-radius:8px; color:var(--studio-text); background:#f8fafa; text-align:center; }.project-photos-state strong { display:block; font-size:14px; }.project-photos-state p { margin:8px 0 0; color:var(--studio-muted); font-size:13px; }.project-photos-state .ax-admin-button { margin-top:14px; }.project-photos-state--error { border-color:#efc5c1; background:#fff8f7; }.project-photos-state--error strong, .project-photos-state--error p { color:#b42318; }
.project-photo-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.project-photo-card { min-width:0; overflow:hidden; border:1px solid #d9e3e5; border-radius:8px; background:#fff; }.project-photo-visual { position:relative; aspect-ratio:4 / 3; overflow:hidden; background:#edf3f3; }.project-photo-image { display:block; width:100%; height:100%; object-fit:cover; }.project-photo-placeholder { display:flex; width:100%; height:100%; padding:16px; flex-direction:column; align-items:center; justify-content:center; gap:6px; color:#50606c; background:linear-gradient(135deg,#eef5f4,#e4eeee); text-align:center; }.project-photo-placeholder strong { font-size:13px; }.project-photo-placeholder span { color:var(--studio-muted); font-size:12px; }.project-photo-meta { display:grid; gap:5px; padding:12px; }.project-photo-meta strong { overflow:hidden; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }.project-photo-meta span { color:var(--studio-muted); font-size:12px; }.project-photo-meta small { color:#155e59; font-size:12px; font-weight:700; }.project-photos-bounded { margin:12px 0 0; color:var(--studio-muted); font-size:12px; }
.toast-region { position:fixed; top:80px; right:24px; z-index:30; display:grid; gap:8px; width:min(360px, calc(100vw - 48px)); max-height:calc(100vh - 96px); overflow:auto; pointer-events:none; }
.toast { min-width:0; margin:0; padding:12px 16px; border-radius:6px; color:#fff; background:#15803d; box-shadow:0 8px 20px rgba(18,42,48,.18); font-size:13px; overflow-wrap:anywhere; pointer-events:auto; }
@media (max-width: 1100px) { .overview-layout { grid-template-columns:1fr; grid-template-areas:"projects" "status" "customers"; }.status-overview { grid-template-columns:repeat(4,minmax(0,1fr)); }.status-overview li:nth-child(2n) { border-right:1px solid #edf2f2; }.status-overview li:nth-child(4n) { border-right:0; } }
@media (max-width: 900px) { .sidebar { transform: translateX(-100%); transition: transform .18s ease-out; }.shell.nav-open .sidebar { transform: translateX(0); }.workspace { width: 100%; margin-left: 0; }.nav-toggle, .nav-close { display: inline-block; }.nav-close { margin:0 0 0 auto; }.scrim { position: fixed; inset: 0; z-index: 9; display: block; background: rgba(16,26,44,.48); }.shell:not(.nav-open) .scrim { display: none; }.content { width: calc(100% - 32px); padding-top: 24px; }.content-header { align-items: start; flex-direction: column; } }
.module-state-badge--ready { color:#155e59; background:#e5f5f2; }.route-shell-state { max-width:720px; }
@media (max-width: 600px) { .topbar { padding:0 12px; }.topbar-copy { display:block; }.topbar-title, .topbar-context { display:block; }.topbar-context { max-width:210px; margin:2px 0 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.topbar-operator { display:none; }.content { width:calc(100% - 24px); }.overview-intro { align-items:stretch; flex-direction:column; }.overview-intro h1 { font-size:20px; }.quick-actions { display:grid; grid-template-columns:1fr; }.overview-list-row, .overview-list-row--customer { grid-template-columns:minmax(0,1fr) auto; }.overview-list-row time { display:none; }.status-overview { grid-template-columns:1fr 1fr; }.status-overview li:nth-child(4n) { border-right:1px solid #edf2f2; }.status-overview li:nth-child(2n) { border-right:0; }.customer-toolbar { align-items:stretch; flex-direction:column; }.search-form input, .search-form select { width:100%; flex:1 1 100%; }.search-form { display:grid; grid-template-columns:minmax(0,1fr) auto; }.search-form label { grid-column:1 / -1; }.customer-toolbar > .ax-admin-button { width:100%; }.form-grid { grid-template-columns:1fr; }.field--full { grid-column:auto; }.project-customer-picker { align-items:stretch; flex-direction:column; }.project-customer-create { align-self:flex-start; }.project-photo-grid { grid-template-columns:1fr; }.project-photos-heading { align-items:stretch; flex-direction:column; }.project-photos-actions .ax-admin-button { width:100%; }.project-upload-copy, .project-upload-footer { align-items:stretch; flex-direction:column; }.project-upload-item { grid-template-columns:minmax(0,1fr) auto; }.project-upload-status { grid-column:1 / -1; text-align:left; }.form-grid { grid-template-columns:1fr; }.field--full { grid-column:auto; }.overlay { padding:0; }.dialog, .drawer { width:100%; max-height:100vh; min-height:100vh; border-radius:0; }.toast-region { top:72px; right:12px; width:calc(100vw - 24px); max-height:calc(100vh - 84px); } }
@media (prefers-reduced-motion: reduce) { .sidebar { transition: none; } }
.selection-toolbar, .selection-summary, .selection-catalog, .selection-state, .selection-switch-confirm, .selection-metrics, .selection-download-policy { border:1px solid var(--studio-border,#d9e3e5); border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.06); }.selection-download-policy { margin-top:16px; padding:18px 20px; }.selection-download-policy-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:14px; }.selection-download-policy-heading h2 { margin:0; font-size:16px; }.selection-download-policy-heading p { margin:5px 0 0; color:var(--studio-muted); font-size:12px; }.selection-download-toggle, .selection-download-option { display:flex; align-items:flex-start; gap:10px; padding:10px 0; color:var(--studio-text); }.selection-download-toggle input, .selection-download-option input { width:16px; height:16px; margin-top:2px; accent-color:#0f766e; }.selection-download-toggle strong, .selection-download-option strong { display:block; font-size:13px; }.selection-download-toggle small, .selection-download-option small { display:block; margin-top:4px; color:var(--studio-muted); font-size:12px; }.selection-download-fields { margin:4px 0 0 26px; padding:12px 14px; border-left:2px solid #d6e8e5; background:#f7fbfa; }.selection-download-label { display:block; margin-bottom:2px; color:var(--studio-muted); font-size:12px; font-weight:700; }.selection-download-option--disabled { color:#7a878c; }.selection-download-option--disabled small { color:#7a878c; }
.selection-catalog { min-width:0; overflow:hidden; }
.selection-catalog-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:18px 20px; border-bottom:1px solid #e6eeee; }
.selection-catalog-heading h2 { margin:0; font-size:16px; }
.selection-catalog-heading p { margin:5px 0 0; color:var(--studio-muted); font-size:12px; }
.selection-photo-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; min-width:0; padding:16px 20px 20px; }
.selection-photo-card { min-width:0; overflow:hidden; border:1px solid #d9e3e5; border-radius:8px; background:#fff; }
.selection-photo-card--selected { border-color:#0f766e; box-shadow:inset 0 0 0 1px #0f766e; }
.selection-photo-card--disabled { opacity:.78; }
.selection-photo-visual { width:100%; aspect-ratio:4 / 3; overflow:hidden; background:#edf3f3; }
.selection-preview-image { display:block; width:100%; height:100%; max-width:100%; object-fit:cover; }
.selection-preview-placeholder { display:flex; width:100%; height:100%; padding:16px; flex-direction:column; align-items:center; justify-content:center; gap:6px; color:#50606c; background:#eef5f4; text-align:center; }
.selection-preview-placeholder strong { font-size:13px; }
.selection-preview-placeholder span { color:var(--studio-muted); font-size:12px; }
.selection-photo-meta { display:grid; min-width:0; gap:5px; padding:12px; }
.selection-photo-meta label { display:flex; min-width:0; align-items:center; gap:7px; color:#155e59; font-size:12px; font-weight:700; }
.selection-photo-meta label span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.selection-item-check { flex:0 0 auto; width:16px; height:16px; margin:0; accent-color:#0f766e; }
.selection-photo-meta strong { min-width:0; overflow:hidden; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.selection-photo-meta > span { color:var(--studio-muted); font-size:12px; }
.selection-photo-meta small { color:#155e59; font-size:12px; font-weight:700; }
@media (max-width:1180px) { .selection-photo-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width: 900px) { .selection-photo-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width: 600px) { .selection-toolbar, .selection-summary, .selection-switch-confirm { align-items:stretch; flex-direction:column; }.selection-download-policy-heading { align-items:stretch; flex-direction:column; }.selection-download-policy-heading .ax-admin-button { width:100%; }.selection-toolbar select { width:100%; flex-basis:auto; }.selection-project-count { white-space:normal; }.selection-actions { justify-content:flex-start; }.selection-actions .ax-admin-button { flex:1 1 130px; }.selection-switch-confirm > div:last-child { display:grid; grid-template-columns:1fr; }.selection-metrics { grid-template-columns:1fr; }.selection-metrics > div { border-right:0; border-bottom:1px solid var(--studio-border,#d9e3e5); }.selection-metrics > div:last-child { border-bottom:0; }.selection-photo-grid { grid-template-columns:1fr; } }
.daily-wallpaper-page { display:grid; gap:16px; min-width:0; }
.daily-wallpaper-section { min-width:0; overflow:hidden; border:1px solid var(--studio-border,#d9e3e5); border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.06); }
.daily-wallpaper-channel { display:flex; align-items:center; gap:12px; padding:16px 20px; }
.daily-wallpaper-channel > div { min-width:0; flex:1; }
.daily-wallpaper-channel h2, .daily-wallpaper-heading h2 { margin:0; font-size:16px; }
.daily-wallpaper-channel p, .daily-wallpaper-heading p, .daily-wallpaper-form-note, .daily-wallpaper-note { margin:5px 0 0; color:var(--studio-muted); font-size:12px; line-height:1.55; }
.daily-wallpaper-channel select { min-width:200px; height:38px; padding:0 10px; border:1px solid var(--studio-border,#d9e3e5); border-radius:6px; background:#fff; color:var(--studio-text); font:inherit; }
.daily-wallpaper-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:16px 20px; border-bottom:1px solid #e6eeee; }
.daily-wallpaper-list { display:grid; }
.daily-wallpaper-row { display:grid; grid-template-columns:minmax(0,1fr) 150px 100px; gap:14px; align-items:center; width:100%; min-height:54px; padding:10px 20px; border:0; border-bottom:1px solid #edf2f2; color:var(--studio-text); background:#fff; text-align:left; font:inherit; cursor:pointer; }
.daily-wallpaper-row:last-child { border-bottom:0; }
.daily-wallpaper-row:hover, .daily-wallpaper-row.is-selected { background:#f3fbf9; }
.daily-wallpaper-row strong, .daily-wallpaper-row small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.daily-wallpaper-row small { margin-top:3px; color:var(--studio-muted); font-size:11px; }
.daily-wallpaper-status, .daily-wallpaper-version { color:var(--studio-muted); font-size:12px; }
.daily-wallpaper-status { font-weight:700; }
.daily-wallpaper-detail { padding-bottom:16px; }
.daily-wallpaper-detail .detail-list { margin:16px 20px 0; }
.daily-wallpaper-form { padding:16px 20px 20px; }
.daily-wallpaper-form .form-grid { gap:12px; }
.daily-wallpaper-form-note { padding:10px 12px; border-left:3px solid #d8a24b; background:#fffaf1; color:#76500f; }
.daily-wallpaper-state { margin:16px; padding:30px 20px; border:1px dashed #cbd7d9; border-radius:8px; color:var(--studio-text); background:#f8fafa; text-align:center; }
.daily-wallpaper-state strong { display:block; font-size:15px; }
.daily-wallpaper-state p { margin:8px 0 0; color:var(--studio-muted); font-size:13px; }
.daily-wallpaper-state .ax-admin-button { margin-top:16px; }
.daily-wallpaper-state--error { border-color:#efc5c1; background:#fff8f7; }
.daily-wallpaper-state--error strong, .daily-wallpaper-state--error p { color:#b42318; }
@media (max-width: 900px) { .daily-wallpaper-channel { align-items:stretch; flex-wrap:wrap; }.daily-wallpaper-channel select { flex:1 1 220px; }.daily-wallpaper-channel .ax-admin-button { flex:0 0 auto; } }
@media (max-width: 600px) { .daily-wallpaper-channel { flex-direction:column; padding:14px 12px; }.daily-wallpaper-channel select, .daily-wallpaper-channel .ax-admin-button { width:100%; }.daily-wallpaper-heading { padding:14px 12px; }.daily-wallpaper-form { padding:14px 12px 16px; }.daily-wallpaper-row { grid-template-columns:minmax(0,1fr) auto; gap:6px 10px; padding:10px 12px; }.daily-wallpaper-row .daily-wallpaper-version { grid-column:2; grid-row:1 / span 2; text-align:right; }.daily-wallpaper-status { grid-column:1; }.daily-wallpaper-detail .detail-list { margin-left:12px; margin-right:12px; } }
.home-section { margin-bottom:24px; border:1px solid var(--studio-border,#d9e3e5); border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.06); }.home-section-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 20px; border-bottom:1px solid #e6eeee; }.home-section-heading h2 { margin:0; font-size:17px; }.home-section-heading p { margin:5px 0 0; color:var(--studio-muted); font-size:12px; }.home-state { margin:16px; padding:30px 20px; border:1px dashed #cbd7d9; border-radius:8px; color:var(--studio-text); background:#f8fafa; text-align:center; }.home-state strong { display:block; font-size:15px; }.home-state p { margin:8px 0 0; color:var(--studio-muted); font-size:13px; }.home-state .ax-admin-button { margin-top:16px; }.home-state--error { border-color:#efc5c1; background:#fff8f7; }.home-state--error strong, .home-state--error p { color:#b42318; }.home-hero-list, .home-featured-grid { display:grid; gap:14px; padding:16px; }.home-featured-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.home-card { display:grid; grid-template-columns:minmax(170px,28%) minmax(0,1fr); min-width:0; overflow:hidden; border:1px solid #d9e3e5; border-radius:8px; background:#fff; }.home-preview-visual { position:relative; min-height:150px; overflow:hidden; background:#edf3f3; }.home-preview-image { display:block; width:100%; height:100%; min-height:150px; object-fit:cover; }.home-preview-placeholder { display:flex; min-height:150px; padding:18px; flex-direction:column; align-items:center; justify-content:center; gap:7px; color:#50606c; background:#eef5f4; text-align:center; }.home-preview-placeholder strong { font-size:13px; }.home-preview-placeholder span { color:var(--studio-muted); font-size:12px; }.home-card-copy { min-width:0; padding:16px; }.home-card-topline, .home-state-row, .home-card-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }.home-card-topline { justify-content:space-between; }.home-type, .home-status, .home-eligibility, .home-readonly { display:inline-flex; align-items:center; min-height:22px; padding:2px 8px; border-radius:999px; font-size:11px; font-weight:700; }.home-type { color:#52626b; background:#edf3f3; }.home-status--draft { color:#9a6100; background:#fff3dc; }.home-status--published, .home-eligibility--granted { color:#155e59; background:#e5f5f2; }.home-status--archived { color:#66737f; background:#edf1f2; }.home-eligibility--pending { color:#9a6100; background:#fff3dc; }.home-readonly { color:#66737f; background:#edf1f2; }.home-card h3 { margin:11px 0 4px; overflow:hidden; font-size:17px; text-overflow:ellipsis; white-space:nowrap; }.home-card-eyebrow { margin:0 0 6px; color:#0f766e; font-size:12px; font-weight:700; }.home-card-description { margin:0 0 12px; color:var(--studio-muted); font-size:13px; line-height:1.55; }.home-state-row { margin-top:12px; color:#52626b; font-size:12px; }.home-card-meta { margin:10px 0 0; color:var(--studio-muted); font-size:11px; }.home-inline-warning { margin:12px 0 0; padding:9px 10px; border:1px solid #edcf9b; border-radius:6px; color:#8a4b08; background:#fffaf1; font-size:12px; }.home-card-actions { margin-top:14px; }.text-button--danger { color:#b42318; }.home-dialog { max-width:640px; }.home-picker { width:min(820px,calc(100% - 48px)); max-height:min(760px,calc(100vh - 48px)); overflow:auto; }.home-picker-label { display:block; margin:18px 20px 6px; color:var(--studio-muted); font-size:12px; font-weight:700; }.home-picker select { width:calc(100% - 40px); height:38px; margin:0 20px; padding:0 10px; border:1px solid var(--studio-border,#d9e3e5); border-radius:6px; background:#fff; color:var(--studio-text); }.home-picker-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:20px; }.home-picker-state { grid-column:1 / -1; padding:28px 18px; border:1px dashed #cbd7d9; border-radius:8px; color:var(--studio-muted); background:#f8fafa; text-align:center; font-size:13px; }.home-picker-state strong { display:block; color:var(--studio-text); font-size:14px; }.home-picker-state p { margin:8px 0 0; }.home-picker-state--error { border-color:#efc5c1; color:#b42318; background:#fff8f7; }.home-picker-card { min-width:0; overflow:hidden; border:1px solid #d9e3e5; border-radius:8px; background:#fff; }.home-picker-card > div:last-child { display:grid; gap:7px; padding:12px; }.home-picker-card strong { color:#155e59; font-size:12px; }.home-picker-card span { overflow:hidden; color:var(--studio-muted); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.home-picker-card .ax-admin-button { width:100%; margin-top:3px; }
.home-document-status, .home-document-section { margin-bottom:20px; border:1px solid var(--studio-border,#d9e3e5); border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.06); }
.home-document-status { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 20px; }.home-document-status p { margin:8px 0 0; color:var(--studio-muted); font-size:12px; }.home-document-actions { display:flex; flex-wrap:wrap; gap:8px; }
.home-document-state { display:inline-flex; min-height:24px; align-items:center; padding:2px 9px; border-radius:999px; font-size:12px; font-weight:700; }.home-document-state--published { color:#155e59; background:#e5f5f2; }.home-document-state--draft, .home-document-state--unsaved { color:#9a6100; background:#fff3dc; }
.home-document-feedback { margin:0 0 12px; padding:10px 12px; border:1px solid #b7dfd8; border-radius:6px; color:#155e59; background:#f3fbf9; font-size:13px; }.home-document-feedback--error { border-color:#efc5c1; color:#b42318; background:#fff8f7; }
.home-document-editor { display:grid; grid-template-columns:minmax(0,1fr) minmax(220px,.55fr); gap:20px; padding:20px; }.home-document-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; min-width:0; }.home-document-form .field { min-width:0; }.home-document-form input, .home-document-form textarea { box-sizing:border-box; width:100%; }.home-document-check { display:flex; align-items:center; gap:8px; min-height:38px; color:var(--studio-text); font-size:13px; font-weight:700; }.home-document-check input { width:16px; height:16px; accent-color:#0f766e; }
.home-document-preview { display:grid; grid-template-rows:minmax(150px,1fr) auto; min-height:220px; overflow:hidden; border:1px solid #d9e3e5; border-radius:6px; background:#f8fafa; }.home-document-preview img { width:100%; height:100%; min-height:150px; object-fit:cover; background:#edf3f3; }.home-document-preview div { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px; }.home-document-preview strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }.home-document-preview span { color:var(--studio-muted); font-size:12px; white-space:nowrap; }
.home-featured-document-list { display:grid; gap:14px; padding:16px; }.home-featured-editor { overflow:hidden; border:1px solid #d9e3e5; border-radius:6px; background:#fff; }.home-featured-editor-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; border-bottom:1px solid #e6eeee; }.home-featured-editor-heading strong { font-size:14px; }.home-document-empty { margin:0; padding:18px; color:var(--studio-muted); text-align:center; }
@media (max-width: 900px) { .home-document-editor { grid-template-columns:1fr; }.home-document-preview { grid-template-rows:minmax(190px,1fr) auto; }.home-featured-grid { grid-template-columns:1fr; }.home-card { grid-template-columns:180px minmax(0,1fr); } }
@media (max-width: 600px) { .home-section-heading { align-items:stretch; flex-direction:column; }.home-section-heading .ax-admin-button { width:100%; }.home-featured-grid, .home-hero-list { padding:12px; }.home-card { grid-template-columns:1fr; }.home-preview-visual, .home-preview-image, .home-preview-placeholder { min-height:180px; }.home-picker { width:100%; max-height:100vh; min-height:100vh; border-radius:0; }.home-picker-grid { grid-template-columns:1fr; }.home-card-actions .text-button { min-height:32px; }.home-state-row { align-items:flex-start; flex-direction:column; }.home-document-status { align-items:stretch; flex-direction:column; }.home-document-actions { display:grid; grid-template-columns:1fr; }.home-document-actions .ax-admin-button { width:100%; }.home-document-form { grid-template-columns:1fr; }.home-document-editor { padding:16px 12px; gap:16px; }.home-featured-document-list { padding:12px; }.home-document-status p { line-height:1.7; } }
.home-media-upload { display:flex; align-items:center; gap:8px; min-height:38px; flex-wrap:wrap; }.home-media-upload-input { position:absolute !important; left:-9999px; width:1px !important; min-width:1px !important; height:1px !important; min-height:1px !important; padding:0 !important; overflow:hidden; clip:rect(0 0 0 0); }.home-media-upload span { color:var(--studio-muted); font-size:12px; }

/* P0B1 compact document editor overrides: preserve the document/API contract while reducing scroll distance. */
.home-document-status { position:sticky; top:8px; z-index:5; margin-bottom:12px; padding:9px 12px; gap:12px; }
.home-document-status-copy { display:flex; min-width:0; align-items:center; flex-wrap:wrap; gap:8px; }
.home-document-meta { color:var(--studio-muted); font-size:11px; white-space:nowrap; }
.home-document-status p { display:none; }
.home-document-actions { flex-wrap:nowrap; }
.home-document-actions .ax-admin-button { min-height:32px; padding:0 12px; white-space:nowrap; }
.home-document-section { margin-bottom:12px; }
.home-section-heading { padding:10px 14px; }
.home-section-heading h2 { font-size:16px; }
.home-section-heading p { margin-top:2px; }
.home-document-editor { grid-template-columns:minmax(0,1fr) 160px; gap:14px; padding:14px; align-items:start; }
.home-document-form { gap:8px; }
.home-document-form .field > span { margin-bottom:3px; font-size:11px; }
.home-document-form input, .home-document-form textarea { min-height:32px; padding:6px 8px; font-size:12px; }
.home-document-form textarea { min-height:58px; }
.home-document-check { min-height:32px; font-size:12px; }
.home-document-preview { display:grid; grid-template-rows:90px auto; width:160px; min-height:0; align-self:start; }
.home-document-preview img, .home-document-preview-placeholder { width:160px; height:90px; min-height:90px; object-fit:cover; }
.home-document-preview-placeholder { display:flex; align-items:center; justify-content:center; color:var(--studio-muted); background:#eef5f4; font-size:11px; }
.home-document-preview div { min-width:0; padding:7px 8px; }
.home-document-preview strong { font-size:11px; }
.home-document-preview span { font-size:10px; }
.home-advanced { grid-column:1 / -1; margin-top:2px; border-top:1px solid #e6eeee; }
.home-advanced summary { padding:6px 0; color:#155e59; cursor:pointer; font-size:11px; font-weight:700; }
.home-advanced-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding-top:2px; }
.home-advanced-grid .field--full { grid-column:1 / -1; }
.home-featured-document-list { gap:8px; padding:10px 14px 14px; }
.home-featured-editor { border-radius:6px; }
.home-featured-editor-heading { padding:8px 10px; border-bottom:0; }
.home-featured-summary { display:flex; min-width:0; align-items:center; gap:10px; }
.home-featured-thumb .home-document-preview { grid-template-rows:52px; width:92px; }
.home-featured-thumb .home-document-preview img, .home-featured-thumb .home-document-preview-placeholder { width:92px; height:52px; min-height:52px; }
.home-featured-thumb .home-document-preview > div { display:none; }
.home-featured-summary-copy { display:grid; min-width:0; gap:2px; }
.home-featured-summary-copy strong, .home-featured-summary-copy span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.home-featured-summary-copy strong { font-size:13px; }
.home-featured-summary-copy span { max-width:420px; color:var(--studio-muted); font-size:11px; }
.home-featured-summary-copy small { color:#52626b; font-size:10px; }
.home-featured-quick-controls { display:flex; align-items:center; gap:10px; color:#52626b; font-size:10px; }
.home-featured-quick-controls label { display:inline-flex; align-items:center; gap:4px; white-space:nowrap; }
.home-featured-quick-controls input[type="number"] { width:52px; height:24px; padding:2px 5px; border:1px solid var(--studio-border,#d9e3e5); border-radius:4px; font-size:11px; }
.home-featured-quick-controls input[type="checkbox"] { width:14px; height:14px; accent-color:#0f766e; }
.home-featured-editor-actions { display:flex; align-items:center; gap:8px; margin-left:auto; }
.home-featured-editor-actions .ax-admin-button { min-height:30px; padding:0 10px; font-size:12px; }
.home-featured-expanded { border-top:1px solid #e6eeee; padding:12px; }
.home-featured-expanded .home-document-preview { display:none; }
@media (max-width: 900px) { .home-document-status { top:4px; }.home-document-editor { grid-template-columns:minmax(0,1fr) 160px; }.home-document-preview { grid-template-rows:90px auto; }.home-featured-summary-copy span { max-width:280px; } }
@media (max-width: 600px) { .home-document-status { position:static; align-items:center; }.home-document-status-copy { align-items:flex-start; flex-direction:column; gap:3px; }.home-document-meta { white-space:normal; }.home-document-actions { display:flex; width:100%; }.home-document-actions .ax-admin-button { flex:1 1 0; }.home-document-editor { grid-template-columns:1fr; padding:12px; }.home-document-preview { width:160px; }.home-advanced-grid { grid-template-columns:1fr; }.home-advanced-grid .field--full { grid-column:auto; }.home-featured-summary-copy span { max-width:180px; }.home-featured-editor-actions { gap:4px; }.home-featured-editor-actions .text-button { min-height:30px; } }
.store-profile-page { max-width: 1120px; }
.store-profile-form { margin-top: 20px; background: var(--ax-ui-surface); border: 1px solid var(--ax-ui-border); border-radius: 8px; padding: 24px; box-shadow: var(--ax-ui-shadow-card); }
.store-profile-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.store-profile-grid .field--full { grid-column: 1 / -1; }
.store-profile-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--ax-ui-border); }
.store-profile-version { color: var(--ax-ui-text-muted); font-size: 12px; }
.store-profile-feedback { margin: 16px 0 0; color: var(--ax-ui-success); font-size: 13px; }
.store-profile-feedback--error { color: var(--ax-ui-danger); }
@media (max-width: 700px) { .store-profile-grid { grid-template-columns: 1fr; } .store-profile-grid .field--full { grid-column: auto; } .store-profile-actions { align-items: stretch; flex-direction: column; } .store-profile-actions .ax-admin-button { width: 100%; } }
.portfolio-tabs { display:flex; gap:4px; margin-bottom:16px; border-bottom:1px solid var(--studio-border,#d9e3e5); }
.portfolio-tabs button { min-height:38px; padding:0 14px; border:0; border-bottom:2px solid transparent; color:var(--studio-muted); background:transparent; cursor:pointer; font-weight:700; }
.portfolio-tabs button.is-active { border-bottom-color:#0f766e; color:#0f766e; }
.portfolio-section { overflow:hidden; border:1px solid var(--studio-border,#d9e3e5); border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.06); }
.portfolio-table { width:100%; border-collapse:collapse; font-size:13px; }
.portfolio-table th,.portfolio-table td { padding:12px 14px; border-bottom:1px solid #edf2f2; text-align:left; vertical-align:middle; }
.portfolio-table th { color:var(--studio-muted); background:#f8fafa; font-size:12px; }
.portfolio-table td strong,.portfolio-table td small { display:block; }
.portfolio-table td small { margin-top:4px; color:var(--studio-muted); font-size:11px; font-family:Consolas,"Courier New",monospace; }
.portfolio-status { display:inline-flex; min-height:22px; align-items:center; padding:2px 8px; border-radius:999px; color:#66737f; background:#edf1f2; font-size:11px; font-weight:700; }
.portfolio-status.is-visible { color:#155e59; background:#e5f5f2; }
.portfolio-empty { padding:36px 20px !important; color:var(--studio-muted); text-align:center !important; }
.portfolio-dialog { width:min(920px,100%); max-width:920px; }
.portfolio-advanced { margin-top: 2px; border-top: 1px solid #e6eeee; }
.portfolio-advanced summary { padding: 8px 0; color: #155e59; cursor: pointer; font-size: 12px; font-weight: 700; }
.portfolio-advanced .field { margin-top: 8px; }
.portfolio-advanced small { color: var(--studio-muted); font-size: 11px; line-height: 1.5; }
.portfolio-media-section { margin-top:20px; padding-top:18px; border-top:1px solid #e6eeee; }
.portfolio-media-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:12px; }
.portfolio-media-heading h3 { margin:0; font-size:16px; }
.portfolio-media-heading p { margin:5px 0 0; color:var(--studio-muted); font-size:12px; }
.portfolio-media-add { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.portfolio-media-list { display:grid; gap:10px; }
.portfolio-media-row { display:grid; grid-template-columns:112px minmax(0,1fr); gap:14px; padding:12px; border:1px solid #d9e3e5; border-radius:8px; background:#fbfdfd; }
.portfolio-media-visual { min-height:92px; }
.portfolio-media-preview { display:block; width:112px; height:92px; object-fit:cover; border-radius:6px; background:#edf3f3; }
.portfolio-media-preview--empty { display:flex; align-items:center; justify-content:center; color:var(--studio-muted); font-size:12px; }
.portfolio-media-copy { min-width:0; }
.portfolio-media-copy strong,.portfolio-media-copy small { display:block; }
.portfolio-media-copy small { margin-top:4px; color:var(--studio-muted); font-size:11px; }
.portfolio-media-fields { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px; }
.portfolio-media-fields label { display:grid; gap:4px; color:var(--studio-muted); font-size:11px; }
.portfolio-media-fields input,.portfolio-media-fields textarea { width:100%; padding:7px 8px; border:1px solid var(--studio-border,#d9e3e5); border-radius:5px; color:var(--studio-text); background:#fff; font:inherit; box-sizing:border-box; }
.portfolio-media-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.portfolio-media-state { padding:20px; border:1px dashed #cbd7d9; border-radius:7px; color:var(--studio-muted); background:#f8fafa; text-align:center; font-size:13px; }.portfolio-media-state strong { display:block; color:var(--studio-text); font-size:14px; }.portfolio-media-state p { margin:8px 0 0; }.portfolio-media-state--error { border-color:#efc5c1; color:#b42318; background:#fff8f7; }.portfolio-media-state--error strong { color:#b42318; }.portfolio-media-loading { margin:0 0 12px; color:var(--studio-muted); font-size:12px; }
.portfolio-source-picker { display:grid; gap:14px; margin:0 0 16px; padding:16px; border:1px solid #cfe3e1; border-radius:8px; background:#f6fbfa; }.portfolio-source-picker h4 { margin:0; font-size:15px; }.portfolio-source-picker-heading p { margin:5px 0 0; color:var(--studio-muted); font-size:12px; }.portfolio-source-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }.portfolio-source-card { min-width:0; overflow:hidden; border:1px solid #d9e3e5; border-radius:8px; background:#fff; cursor:pointer; }.portfolio-source-card.is-selected { border-color:#0f766e; box-shadow:0 0 0 2px #d6f1ec; }.portfolio-source-card.is-attached { cursor:default; background:#f8fafa; }.portfolio-source-visual { aspect-ratio:4 / 3; overflow:hidden; background:#edf3f3; }.portfolio-source-visual img { display:block; width:100%; height:100%; object-fit:cover; }.portfolio-picker-placeholder { display:flex; width:100%; height:100%; align-items:center; justify-content:center; padding:12px; box-sizing:border-box; color:var(--studio-muted); font-size:12px; text-align:center; }.portfolio-source-meta { display:grid; gap:6px; padding:11px; }.portfolio-source-meta strong { overflow:hidden; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }.portfolio-source-meta > span { color:var(--studio-muted); font-size:12px; }.portfolio-source-check { display:flex; align-items:center; gap:6px; color:#155e59 !important; font-weight:700; }.portfolio-source-check input { width:16px; height:16px; accent-color:#0f766e; }.portfolio-source-picker-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:8px; }
@media (max-width:900px) { .portfolio-table { min-width:780px; } .portfolio-section .table-wrap { overflow-x:auto; } }
@media (max-width:900px) { .portfolio-source-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) { .portfolio-tabs { margin-bottom:12px; } .portfolio-tabs button { flex:1; padding:0 8px; } .portfolio-media-heading { flex-direction:column; } .portfolio-media-add { width:100%; align-items:stretch; flex-direction:column; } .portfolio-media-add .ax-admin-button { width:100%; } .portfolio-media-row { grid-template-columns:1fr; } .portfolio-media-preview { width:100%; height:160px; } .portfolio-media-fields { grid-template-columns:1fr; } .portfolio-source-grid { grid-template-columns:1fr; } .portfolio-source-picker-actions { display:grid; grid-template-columns:1fr; } }
.portfolio-story-section { margin-top:20px; padding-top:18px; border-top:1px solid #e6eeee; }
.portfolio-story-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:12px; }
.portfolio-story-heading h3 { margin:0; font-size:16px; }
.portfolio-story-heading p { margin:5px 0 0; color:var(--studio-muted); font-size:12px; }
.portfolio-story-add-menu { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; }
.portfolio-story-list { display:grid; gap:10px; }
.portfolio-story-empty { padding:20px; border:1px dashed #cbd7d9; border-radius:7px; color:var(--studio-muted); background:#f8fafa; text-align:center; font-size:13px; }
.portfolio-story-block { display:grid; gap:12px; padding:14px; border:1px solid #d9e3e5; border-radius:8px; background:#fbfdfd; }
.portfolio-story-block--unsupported { border-color:#ead5b5; background:#fffaf1; }
.portfolio-story-block-heading,.portfolio-story-grid-item-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.portfolio-story-block-heading strong { font-size:14px; }
.portfolio-story-index { display:inline-flex; min-width:28px; margin-right:7px; color:#0f766e; font:700 12px/20px Consolas,"Courier New",monospace; }
.portfolio-story-block-actions,.portfolio-story-grid-item-head > div { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; }
.portfolio-story-block-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.portfolio-story-block-fields .field:first-child:nth-last-child(1),.portfolio-story-block-fields .portfolio-story-preview-wrap,.portfolio-story-block-fields .portfolio-story-grid-items,.portfolio-story-block-fields .portfolio-story-divider-note { grid-column:1 / -1; }
.portfolio-story-grid-items { display:grid; gap:10px; }
.portfolio-story-grid-item { display:grid; gap:10px; padding:12px; border:1px solid #e2ebeb; border-radius:7px; background:#fff; }
.portfolio-story-grid-item-head strong { font-size:13px; }
.portfolio-story-asset-preview { display:block; width:180px; height:120px; object-fit:cover; border-radius:6px; background:#edf3f3; }
.portfolio-story-asset-preview--empty { display:flex; align-items:center; justify-content:center; color:var(--studio-muted); font-size:12px; }
.portfolio-story-preview-wrap { padding-top:2px; }
.portfolio-story-unsupported { margin:0; color:#8a5500; font-size:12px; }
.portfolio-story-block pre { max-height:180px; overflow:auto; margin:0; padding:10px; border:1px solid #eadfcf; border-radius:6px; background:#fffdf8; color:#6b5a3b; font:11px/1.45 Consolas,"Courier New",monospace; white-space:pre-wrap; word-break:break-word; }
.portfolio-story-divider-note { margin:0; padding:10px 12px; color:var(--studio-muted); background:#f8fafa; font-size:12px; }
@media (max-width:700px) { .portfolio-story-heading { align-items:stretch; flex-direction:column; } .portfolio-story-add-menu { justify-content:flex-start; } .portfolio-story-block-fields { grid-template-columns:1fr; } .portfolio-story-block-actions,.portfolio-story-grid-item-head > div { justify-content:flex-start; } .portfolio-story-asset-preview { width:100%; height:160px; } }

/* P1C Home CMS: one draft, five operator tabs, reference-only module lists. */
.home-tabs { display:flex; gap:2px; margin:0 0 14px; overflow-x:auto; border-bottom:1px solid var(--studio-border,#d9e3e5); scrollbar-width:thin; }
.home-tab { flex:0 0 auto; min-height:40px; padding:0 16px; border:0; border-bottom:2px solid transparent; color:var(--studio-muted); background:transparent; cursor:pointer; font:inherit; font-size:13px; font-weight:700; white-space:nowrap; }
.home-tab:hover,.home-tab.is-active { border-bottom-color:#0f766e; color:#0f766e; }
.home-tab-panel { min-width:0; }
.home-document-list { display:grid; gap:12px; padding:14px; }
.home-hero-media { margin-top:16px; padding-top:16px; border-top:1px solid #e6eeee; }.home-hero-media h3 { margin:0 0 10px; font-size:15px; }.home-hero-slide-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:12px; margin-top:14px; }.home-hero-slide { overflow:hidden; border:1px solid #d9e3e5; border-radius:7px; background:#fff; }.home-hero-slide img { display:block; width:100%; height:108px; object-fit:cover; background:#f3f7f7; }.home-hero-slide-actions { display:flex; flex-wrap:wrap; gap:4px 8px; align-items:center; padding:8px; }.home-hero-slide-actions span { flex:1 0 100%; color:var(--studio-muted); font-size:12px; }
.home-media-upload { display:grid; gap:8px; align-content:start; }.home-media-upload > span { color:var(--studio-muted); font-size:12px; }.home-media-upload-preview { display:grid; grid-template-columns:96px minmax(0,1fr) auto; gap:10px; align-items:center; padding:8px; border:1px solid #cfe3e1; border-radius:7px; background:#f6fbfa; }.home-media-upload-preview img { display:block; width:96px; height:68px; object-fit:cover; border-radius:5px; background:#edf3f3; }.home-media-upload-preview-copy { display:grid; gap:3px; min-width:0; }.home-media-upload-preview-copy strong { color:#0f766e; font-size:13px; }.home-media-upload-preview-copy span { overflow:hidden; color:var(--studio-muted); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }.home-media-upload-preview .text-button { white-space:nowrap; }
.home-document-card { overflow:hidden; border:1px solid #d9e3e5; border-radius:7px; background:#fff; }
.home-document-card-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 14px; border-bottom:1px solid #e6eeee; }
.home-document-card-head strong { color:#155e59; font-size:13px; }
.home-document-card .home-document-editor { padding:14px; }
.home-document-card .home-document-preview { width:160px; }
.home-document-card .home-document-preview img,.home-document-card .home-document-preview-placeholder { width:160px; height:90px; min-height:90px; }
.home-reference-list { display:grid; gap:8px; padding:14px; }
.home-reference-row { display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding:11px 12px; border:1px solid #d9e3e5; border-radius:6px; background:#fbfdfd; }
.home-reference-row--warning { border-color:#edcf9b; background:#fffaf1; }
.home-reference-cover { display:flex; width:72px; min-width:72px; height:52px; align-items:center; justify-content:center; border:1px solid #d9e3e5; border-radius:4px; color:#52626b; background:#eef5f4; font-size:11px; font-weight:700; }
.home-reference-row--warning .home-reference-cover { border-color:#edcf9b; color:#8a4b08; background:#fff3dc; }
.home-reference-copy { display:grid; min-width:0; flex:1 1 220px; gap:3px; }
.home-reference-copy strong, .home-reference-copy span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.home-reference-copy strong { font-size:14px; }
.home-reference-copy span, .home-reference-copy small { color:var(--studio-muted); font-size:12px; }
.home-reference-row--warning .home-reference-copy span { color:#8a4b08; white-space:normal; }
.home-reference-row .home-card-actions { margin:0 0 0 auto; }
.home-reference-row > strong { min-width:180px; flex:1 1 220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.home-reference-row > span { color:var(--studio-muted); font-size:12px; }
.home-picker-row { display:flex; align-items:center; gap:8px; padding:14px 14px 0; }
.home-picker-row select { min-width:260px; height:36px; padding:0 9px; border:1px solid var(--studio-border,#d9e3e5); border-radius:5px; background:#fff; color:var(--studio-text); }
.home-adapter-pending { margin:14px 14px 0; padding:12px; border:1px dashed #edcf9b; border-radius:6px; color:#8a4b08; background:#fffaf1; font-size:12px; }
.home-adapter-pending strong { display:block; margin-bottom:4px; font-size:13px; }
.home-portfolio-search { box-sizing:border-box; width:calc(100% - 40px); height:38px; margin:0 20px; padding:0 10px; border:1px solid var(--studio-border,#d9e3e5); border-radius:6px; color:var(--studio-text); background:#fff; }
.home-portfolio-picker .home-picker-card { display:grid; grid-template-columns:72px minmax(0,1fr); }
.home-portfolio-picker .home-picker-card > div:last-child { min-width:0; }
.home-portfolio-picker .home-picker-card small { color:var(--studio-muted); font-size:11px; }
.home-compatibility { margin:0 14px 14px; padding:10px 12px; border-top:1px solid #e6eeee; }
.home-compatibility summary { color:#52626b; cursor:pointer; font-size:12px; font-weight:700; }
.home-compatibility-description,.home-advanced-note,.home-settings-note { margin:8px 0 0; color:var(--studio-muted); font-size:12px; line-height:1.6; }
.home-legacy-editor { margin-top:10px; padding:0; }
.home-readonly-note { margin:14px 0 0; color:var(--studio-muted); font-size:12px; }
.home-settings-groups { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:14px; }
.home-settings-group { min-width:0; padding:14px; border:1px solid #d9e3e5; border-radius:7px; background:#fbfdfd; }
.home-settings-group h3 { margin:0 0 10px; color:#155e59; font-size:14px; }
.home-settings-group .home-document-form { grid-template-columns:1fr; gap:8px; }
.home-settings-group .home-document-check { padding:5px 0; }
@media (max-width:900px) { .home-document-card .home-document-editor { grid-template-columns:minmax(0,1fr) 160px; } }
@media (max-width:600px) { .home-tabs { margin-right:-12px; margin-left:-12px; padding:0 12px; } .home-document-card-head { align-items:flex-start; flex-direction:column; } .home-document-card .home-document-editor { grid-template-columns:1fr; } .home-document-card .home-document-preview { width:160px; } .home-picker-row { align-items:stretch; flex-direction:column; } .home-picker-row select { min-width:0; width:100%; } .home-settings-groups { grid-template-columns:1fr; padding:12px; } .home-reference-row { align-items:flex-start; flex-direction:column; } .home-reference-row .home-card-actions { width:100%; margin-left:0; } .home-reference-row .home-card-actions .text-button { flex:1 1 auto; } }
@media (max-width:600px) { .home-media-upload-preview { grid-template-columns:80px minmax(0,1fr); } .home-media-upload-preview img { width:80px; height:58px; } .home-media-upload-preview .text-button { grid-column:1 / -1; justify-self:start; } }
.service-package-toolbar { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:20px; }
.service-package-toolbar h1 { margin:4px 0; font-size:24px; }
.service-package-toolbar p { margin:0; color:var(--studio-muted); font-size:13px; }
.service-package-toolbar .eyebrow { color:#0f766e; font-size:11px; font-weight:700; text-transform:uppercase; }
.service-package-layout { display:grid; grid-template-columns:minmax(260px,30%) minmax(0,1fr); gap:16px; align-items:start; }
.service-package-services, .service-package-detail, .service-package-empty { border:1px solid var(--studio-border,#d9e3e5); border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.06); }
.service-package-services .section-heading, .service-package-detail > .section-heading { padding:18px 20px; border-bottom:1px solid #e6eeee; }
.service-package-service-list { display:grid; gap:1px; padding:8px; background:#edf3f3; }
.service-package-service-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:center; width:100%; padding:8px; border-radius:6px; background:#fff; color:var(--studio-text); }
.service-package-service-row:hover, .service-package-service-row.is-selected { background:#e5f5f2; }
.service-package-service-select { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:8px; align-items:center; min-width:0; width:100%; padding:4px; border:0; background:transparent; color:inherit; text-align:left; cursor:pointer; }
.service-package-service-row span { min-width:0; display:grid; gap:4px; }
.service-package-service-row strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.service-package-service-row small { overflow:hidden; color:var(--studio-muted); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.service-package-service-row em, .service-package-service-row i { color:#66737f; font-size:11px; font-style:normal; white-space:nowrap; }
.service-package-service-row .row-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; }
.service-package-detail { min-width:0; }
.service-package-detail > .section-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.service-package-detail h2, .service-package-detail h3 { margin:0; }
.service-package-detail .section-heading p { margin:5px 0 0; color:var(--studio-muted); font-size:13px; }
.service-package-meta { display:flex; flex-wrap:wrap; gap:8px; padding:12px 20px; border-bottom:1px solid #edf3f3; color:#52626b; font-size:12px; }
.service-package-meta span { padding:4px 8px; border-radius:999px; background:#edf3f3; }
.service-package-package-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; padding:18px 20px 12px; }
.service-package-package-heading p { margin:5px 0 0; color:var(--studio-muted); font-size:12px; }
.service-package-package-list { display:grid; gap:10px; padding:0 20px 20px; }
.service-package-package-row { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:14px; border:1px solid #d9e3e5; border-radius:7px; background:#fbfdfd; }
.service-package-package-row p { margin:5px 0; color:var(--studio-muted); font-size:13px; }
.service-package-package-row small { color:#52626b; font-size:12px; }
.service-package-package-row .row-actions { flex:0 0 auto; display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.service-package-list-empty, .service-package-empty { padding:36px 20px; color:var(--studio-muted); text-align:center; }
.service-package-empty { margin-top:12px; }
.service-package-empty strong { display:block; color:var(--studio-text); font-size:17px; }
.service-package-empty p { margin:8px 0 18px; font-size:13px; }
.service-package-page-error { margin-top:12px; }
.service-package-dialog { width:min(760px,100%); max-width:760px; }
.service-package-form-section { margin:0 0 18px; padding:16px; border:1px solid #e2ebeb; border-radius:8px; background:#fbfdfd; }
.service-package-form-section h3 { margin:0 0 14px; font-size:15px; }
.service-package-media-field { margin:0 0 18px; padding:16px; border:1px solid #cfe3e1; border-radius:8px; background:#f6fbfa; }
.service-package-media-heading, .service-package-media-cover-row { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.service-package-media-heading > div { display:grid; gap:4px; }
.service-package-media-heading span { font-weight:700; }
.service-package-media-heading small, .service-package-media-current-copy small, .service-package-gallery-meta small { color:var(--studio-muted); font-size:12px; }
.service-package-media-cover-row { align-items:center; margin-top:12px; }
.service-package-media-current { display:flex; min-width:0; align-items:center; gap:12px; }
.service-package-media-current-visual { flex:0 0 auto; }
.service-package-media-current-copy { display:grid; min-width:0; gap:5px; }
.service-package-media-current-copy strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.service-package-media-cover-actions, .service-package-gallery-actions, .service-package-media-picker-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.service-package-media-thumb { display:block; width:112px; height:78px; object-fit:cover; border-radius:6px; background:#eaf2f1; }
.service-package-media-thumb--empty { display:flex; align-items:center; justify-content:center; color:var(--studio-muted); font-size:12px; }
.service-package-media-empty { padding:18px; color:var(--studio-muted); font-size:13px; text-align:center; }
.service-package-gallery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:14px; }
.service-package-gallery-card { min-width:0; overflow:hidden; border:1px solid #d9e3e5; border-radius:8px; background:#fff; }
.service-package-gallery-visual { aspect-ratio:4 / 3; overflow:hidden; background:#edf3f3; }
.service-package-gallery-visual .service-package-media-thumb { width:100%; height:100%; border-radius:0; }
.service-package-gallery-meta { display:grid; gap:6px; padding:10px; }
.service-package-gallery-meta strong { font-size:12px; }
.service-package-media-picker { width:min(900px,calc(100% - 48px)); max-width:900px; max-height:min(780px,calc(100vh - 48px)); }
.service-package-media-tabs { display:flex; gap:8px; padding:0 20px 14px; border-bottom:1px solid #e6eeee; }
.service-package-media-tab { border:0; border-radius:6px; padding:8px 12px; color:var(--studio-muted); background:#f1f6f6; font:inherit; font-size:13px; font-weight:700; cursor:pointer; }
.service-package-media-tab.is-active { color:#fff; background:#0f766e; }
.service-package-media-project-select { grid-column:1 / -1; margin:0; }
.service-package-media-upload { justify-self:start; position:relative; overflow:hidden; }
.service-package-media-upload input { position:absolute; inset:0; opacity:0; cursor:pointer; }
.service-package-media-picker-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding:0 20px 20px; overflow:auto; }
.service-package-media-picker-card { min-width:0; overflow:hidden; border:1px solid #d9e3e5; border-radius:8px; background:#fff; }
.service-package-media-picker-visual { aspect-ratio:4 / 3; overflow:hidden; background:#edf3f3; }
.service-package-media-picker-visual img { display:block; width:100%; height:100%; object-fit:cover; }
.service-package-media-picker-copy { display:grid; gap:6px; padding:12px; }
.service-package-media-picker-copy strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.service-package-media-picker-copy span, .service-package-media-picker-copy small { color:var(--studio-muted); font-size:12px; }
.service-package-media-picker-check { display:flex; align-items:center; gap:6px; color:#155e59; font-size:12px; font-weight:700; }
.service-package-media-picker-check input { width:16px; height:16px; accent-color:#0f766e; }
.service-package-media-picker-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 20px 20px; border-top:1px solid #e6eeee; }
.service-package-media-picker-state { grid-column:1 / -1; padding:28px 18px; border:1px dashed #cbd7d9; border-radius:8px; color:var(--studio-muted); background:#f8fafa; text-align:center; font-size:13px; }
.service-package-media-picker-state strong { display:block; color:var(--studio-text); font-size:14px; }
.service-package-media-picker-state p { margin:8px 0 0; }
.service-package-media-picker-state--error { border-color:#efc5c1; color:#b42318; background:#fff8f7; }
.service-package-categories { margin-bottom:16px; border:1px solid var(--studio-border,#d9e3e5); border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.06); }
.service-package-categories .section-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:18px 20px; border-bottom:1px solid #e6eeee; }
.service-package-category-list { display:grid; gap:1px; padding:8px; background:#edf3f3; }
.service-package-category-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:center; padding:8px; border-radius:6px; background:#fff; }
.service-package-category-row.is-selected, .service-package-category-row:hover { background:#e5f5f2; }
.service-package-category-select { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:8px; align-items:center; min-width:0; padding:4px; border:0; background:transparent; color:inherit; text-align:left; cursor:pointer; }
.service-package-category-select span { display:grid; gap:4px; min-width:0; }
.service-package-category-select strong, .service-package-category-select small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.service-package-category-select small { color:var(--studio-muted); font-size:12px; }
.service-package-category-select em, .service-package-category-select i { color:#66737f; font-size:11px; font-style:normal; white-space:nowrap; }
.service-package-category-row .row-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; }
@media (max-width:900px) { .service-package-layout { grid-template-columns:1fr; } }
@media (max-width:900px) { .service-package-media-picker-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .service-package-gallery-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) { .service-package-toolbar, .service-package-detail > .section-heading, .service-package-package-heading { align-items:stretch; flex-direction:column; } .service-package-toolbar .ax-admin-button, .service-package-package-heading .ax-admin-button { width:100%; } .service-package-package-row { flex-direction:column; } .service-package-package-row .row-actions { justify-content:flex-start; } .service-package-media-cover-row, .service-package-media-heading, .service-package-media-picker-footer { align-items:stretch; flex-direction:column; } .service-package-media-cover-actions .ax-admin-button { width:100%; } .service-package-gallery-grid, .service-package-media-picker-grid { grid-template-columns:1fr; } .service-package-media-picker { width:100%; max-height:100vh; border-radius:0; } }

.service-package-before-after-section { background:#f8fafa; }
.service-package-before-after-title, .service-package-before-after-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.service-package-before-after-title h3 { margin:0; }
.service-package-before-after-title p { margin:5px 0 0; color:var(--studio-muted); font-size:12px; }
.service-package-before-after-card { display:grid; gap:14px; margin-top:14px; padding:14px; border:1px solid #d9e3e5; border-radius:7px; background:#fff; }
.service-package-before-after-heading strong { font-size:14px; }
.service-package-before-after-actions { display:flex; flex-wrap:wrap; gap:8px; }
.service-package-before-after-media-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.service-package-before-after-slot { display:grid; gap:8px; min-width:0; }
.service-package-before-after-slot > span { color:var(--studio-text); font-size:13px; font-weight:700; }
.service-package-before-after-thumb { display:block; width:100%; aspect-ratio:4 / 3; object-fit:cover; border-radius:6px; background:#edf3f3; }
.service-package-before-after-thumb--empty { display:flex; align-items:center; justify-content:center; color:var(--studio-muted); font-size:12px; }
.service-package-before-after-empty { padding:14px 0 2px; color:var(--studio-muted); font-size:13px; }
@media (max-width:600px) { .service-package-before-after-title, .service-package-before-after-heading { align-items:stretch; flex-direction:column; } .service-package-before-after-media-grid { grid-template-columns:1fr; } }

/* Service package master/detail workflow. */
.service-package-category-tabs { display:flex; align-items:center; gap:12px; margin-bottom:16px; padding:14px 16px; border:1px solid var(--studio-border,#d9e3e5); border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.06); }
.service-package-category-tabs-copy { flex:0 0 auto; display:grid; gap:3px; }
.service-package-category-tabs-copy > span { color:var(--studio-text); font-size:13px; font-weight:700; }
.service-package-category-tabs-copy small, .service-package-tabs-empty { color:var(--studio-muted); font-size:12px; }
.service-package-category-tab-list { display:flex; min-width:0; flex:1 1 auto; flex-wrap:wrap; gap:8px; }
.service-package-category-tab { min-height:32px; padding:6px 12px; border:1px solid #cddcdc; border-radius:999px; color:#52626b; background:#fff; font:inherit; font-size:13px; font-weight:700; cursor:pointer; }
.service-package-category-tab:hover { border-color:#7bbab2; color:#0f766e; background:#f4fbfa; }
.service-package-category-tab.is-selected { border-color:#0f766e; color:#155e59; background:#e5f5f2; box-shadow:inset 0 0 0 1px #0f766e; }
.service-package-status-badges { display:flex; flex-wrap:wrap; gap:6px; }
.service-package-status-badge { display:inline-flex; align-items:center; min-height:22px; padding:2px 8px; border-radius:999px; color:#66737f; background:#edf1f2; font-size:11px; font-weight:700; white-space:nowrap; }
.service-package-status-badge--enabled, .service-package-status-badge--public { color:#155e59; background:#e5f5f2; }
.service-package-service-select { grid-template-columns:minmax(0,1fr); }
.service-package-service-row span .service-package-status-badges { margin-top:2px; }
.service-package-service-row { position:relative; padding:10px; }
.service-package-overflow { position:relative; flex:0 0 auto; }
.service-package-overflow summary { display:flex; width:30px; height:30px; align-items:center; justify-content:center; border:1px solid #d9e3e5; border-radius:6px; color:#52626b; background:#fff; cursor:pointer; font-size:16px; font-weight:700; list-style:none; }
.service-package-overflow summary::-webkit-details-marker { display:none; }
.service-package-overflow[open] summary { border-color:#0f766e; color:#0f766e; background:#e5f5f2; }
.service-package-overflow-menu { position:absolute; z-index:3; top:36px; right:0; display:grid; min-width:108px; padding:6px; border:1px solid #d9e3e5; border-radius:8px; background:#fff; box-shadow:0 12px 28px rgba(18,42,48,.16); }
.service-package-overflow-menu .text-button { padding:7px 8px; text-align:left; white-space:nowrap; }
.service-package-overflow-divider { margin:4px 0; border-top:1px solid #e6eeee; }
.service-package-delete-confirm-copy { margin:0; color:var(--studio-text); line-height:1.6; }
.service-package-meta { align-items:center; }
.service-package-detail-media { padding:16px 20px; border-bottom:1px solid #edf3f3; }
.service-package-detail-media-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; font-size:13px; font-weight:700; }
.service-package-detail-cover { display:flex; align-items:center; gap:12px; min-width:0; }
.service-package-detail-cover .service-package-media-thumb { width:132px; height:88px; }
.service-package-detail-cover > div:last-child { display:grid; gap:4px; min-width:0; }
.service-package-detail-cover small { color:var(--studio-muted); font-size:12px; }
.service-package-detail-media-empty { padding:16px; border:1px dashed #cbd7d9; border-radius:6px; color:var(--studio-muted); background:#f8fafa; font-size:13px; }
.service-package-detail-gallery { display:flex; gap:8px; margin-top:12px; overflow:auto; }
.service-package-detail-gallery-item { flex:0 0 auto; overflow:hidden; border:1px solid #d9e3e5; border-radius:6px; }
.service-package-detail-gallery-item .service-package-media-thumb { width:76px; height:56px; border-radius:0; }
.service-package-package-row { align-items:stretch; }
.service-package-package-copy { display:grid; min-width:0; gap:6px; }
.service-package-package-copy > strong { font-size:15px; }
.service-package-package-badge { justify-self:start; display:inline-flex; padding:3px 7px; border-radius:999px; color:#8a5500; background:#fff3dc; font-size:11px; font-weight:700; }
.service-package-package-actions { display:flex; flex:0 0 auto; align-items:flex-start; justify-content:flex-end; flex-wrap:wrap; gap:8px; }
.service-package-package-price { min-width:72px; color:#17212b; font-size:18px; line-height:30px; text-align:right; white-space:nowrap; }
.service-package-category-management { width:min(640px,calc(100% - 48px)); max-width:640px; }
.service-package-category-admin-body { padding:0 20px 20px; }
.service-package-category-admin-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 0; border-bottom:1px solid #e6eeee; font-size:13px; font-weight:700; }
.service-package-category-admin-list { display:grid; gap:8px; padding-top:12px; }
.service-package-category-admin-row { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:14px; border:1px solid #d9e3e5; border-radius:8px; background:#fbfdfd; }
.service-package-category-admin-row > div:first-child { display:grid; min-width:0; gap:6px; }
.service-package-category-admin-row p { margin:0; color:var(--studio-muted); font-size:12px; }
.service-package-category-admin-actions { display:flex; flex:0 0 auto; flex-wrap:wrap; justify-content:flex-end; gap:6px; }
@media (max-width:900px) { .service-package-category-tabs { align-items:flex-start; flex-wrap:wrap; } .service-package-category-tab-list { order:3; flex-basis:100%; } }
@media (max-width:600px) { .service-package-category-tabs { align-items:stretch; flex-direction:column; } .service-package-category-tabs .ax-admin-button { width:100%; } .service-package-category-tab-list { flex-wrap:nowrap; overflow:auto; padding-bottom:2px; } .service-package-category-tab { flex:0 0 auto; } .service-package-detail-cover { align-items:flex-start; flex-direction:column; } .service-package-package-actions { justify-content:flex-start; } .service-package-package-price { text-align:left; } .service-package-category-management { width:100%; max-height:100vh; border-radius:0; } .service-package-category-admin-row { align-items:stretch; flex-direction:column; } .service-package-category-admin-actions { justify-content:flex-start; } }
.order-status-note { display:flex; align-items:center; gap:10px; margin-bottom:16px; padding:12px 14px; border:1px solid #cfe4e0; border-radius:8px; background:#f2fbf9; color:#155e59; font-size:13px; }
.order-status-note span { color:var(--studio-muted); }
.order-table { min-width:980px; }
.order-table td small { display:block; margin-top:4px; color:var(--studio-muted); font-size:11px; }
.order-status-stack { display:grid; justify-items:start; gap:4px; }
.order-combined-status { color:#155e59; font-size:12px; line-height:1.35; white-space:nowrap; }
.order-payment-badge { color:#475569; background:#eef2f4; }
.order-id { font-family:Consolas,"Courier New",monospace; font-size:12px; word-break:break-all; }
.order-detail-drawer h3 { margin:24px 0 8px; font-size:16px; }
.order-json-block { margin-top:16px; }
.order-json-block strong { display:block; margin-bottom:8px; font-size:13px; }
.order-json-block pre { max-height:240px; overflow:auto; margin:0; padding:12px; border:1px solid #e1ebea; border-radius:6px; background:#f8fafa; color:#334155; font:12px/1.5 Consolas,"Courier New",monospace; white-space:pre-wrap; word-break:break-word; }
.order-event-list { display:grid; gap:8px; margin:0; padding:0; list-style:none; }
.order-event-list li { display:flex; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid #e6eeee; font-size:13px; }
.order-event-list span,.detail-empty { color:var(--studio-muted); font-size:12px; }
.order-status-operations { margin-top:20px; padding:16px; border:1px solid #cfe4e0; border-radius:8px; background:#f8fdfc; }
.order-status-operations h3 { margin:0 0 8px; }
.order-status-operations p { margin:0 0 12px; }
.order-status-operations .dialog-actions { justify-content:flex-start; margin-top:0; }
@media (max-width:600px) { .order-status-note { align-items:flex-start; flex-direction:column; } .order-event-list li { align-items:flex-start; flex-direction:column; gap:4px; } }

.selection-photo-preview-trigger { display:block; width:100%; height:100%; margin:0; padding:0; border:0; color:inherit; background:transparent; cursor:zoom-in; }
.selection-photo-preview-trigger:focus-visible { outline:3px solid #1aa392; outline-offset:-3px; }
.selection-preview-overlay { align-items:center; justify-content:center; padding:16px; background:rgba(7,14,24,.86); }
.selection-preview-dialog { display:flex; width:min(1100px,calc(100vw - 32px)); max-width:1100px; max-height:calc(100vh - 32px); min-height:0; padding:20px; flex-direction:column; color:#f7fbfb; background:#101922; }
.selection-preview-dialog .dialog-header { flex:0 0 auto; align-items:flex-start; margin-bottom:14px; }
.selection-preview-dialog .dialog-header h2 { color:#f7fbfb; }
.selection-preview-dialog .dialog-header p { color:#b8c9ce; font-weight:700; }
.selection-preview-dialog .icon-button { border-color:#53656d; color:#f7fbfb; background:#1c2a33; }
.selection-preview-stage { display:flex; min-height:0; flex:1 1 auto; align-items:center; justify-content:center; overflow:hidden; padding:10px; background:#060b10; }
.selection-preview-lightbox-image { display:block; width:auto; height:auto; max-width:100%; max-height:min(70vh,760px); object-fit:contain; }
.selection-preview-lightbox-placeholder { display:flex; min-height:220px; padding:24px; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:#d5e2e5; text-align:center; }
.selection-preview-lightbox-placeholder span { color:#9fb1b8; font-size:12px; }
.selection-preview-info { display:flex; min-width:0; align-items:center; justify-content:space-between; gap:16px; padding:12px 2px 0; }
.selection-preview-info strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.selection-preview-info span { flex:0 0 auto; color:#b8c9ce; font-size:12px; }
.selection-preview-actions { flex:0 0 auto; margin-top:14px; }
@media (max-width:600px) { .selection-preview-overlay { padding:8px; }.selection-preview-dialog { width:100%; max-height:calc(100vh - 16px); padding:14px; border-radius:6px; }.selection-preview-stage { padding:6px; }.selection-preview-lightbox-image { max-height:62vh; }.selection-preview-info { align-items:flex-start; flex-direction:column; gap:5px; }.selection-preview-actions { display:grid; grid-template-columns:1fr 1fr; }.selection-preview-actions .ax-admin-button { width:100%; } }
.selection-production-panel { margin-top:16px; border:1px solid var(--studio-border,#d9e3e5); border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.06); }
.selection-production-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:18px 20px; border-bottom:1px solid #e6eeee; }
.selection-production-heading h2 { margin:0; font-size:17px; }
.selection-production-heading p { margin:5px 0 0; color:var(--studio-muted); font-size:12px; }
.selection-history-section { padding:0 20px 16px; }
.selection-history-section h3 { margin:0 0 9px; font-size:13px; }
.selection-history-list { display:grid; gap:8px; }
.selection-history-row { display:grid; grid-template-columns:140px 100px minmax(0,1fr) minmax(100px,auto); align-items:center; gap:10px; padding:9px 10px; border:1px solid #e6eeee; border-radius:6px; background:#f8fbfb; }
.selection-history-row strong { color:#0f766e; }
.selection-history-row span, .selection-history-row small { min-width:0; overflow-wrap:anywhere; }
.selection-history-row small { color:var(--studio-muted); font-size:11px; }
.selection-history-empty { margin:0; color:var(--studio-muted); font-size:12px; }
.selection-submission-history { overflow:hidden; }
.selection-submission-row { border-bottom:1px solid #e6eeee; }
.selection-submission-row:last-child { border-bottom:0; }
.selection-submission-row summary { display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:12px; padding:12px 20px; cursor:pointer; list-style:none; }
.selection-submission-row summary::-webkit-details-marker { display:none; }
.selection-submission-row summary span { color:#0f766e; font-size:12px; font-weight:700; }
.selection-submission-row summary small { color:var(--studio-muted); font-size:11px; }
.selection-submission-detail { display:flex; flex-wrap:wrap; gap:8px 18px; padding:0 20px 14px; color:var(--studio-muted); font-size:12px; }
.selection-photo-visual { position:relative; }
.selection-photo-pick { position:absolute; top:8px; left:8px; display:flex; align-items:center; gap:6px; min-height:36px; padding:0 10px; border:1px solid #d9e3e5; border-radius:6px; color:#17212b; background:rgba(255,255,255,.96); font-size:12px; font-weight:700; cursor:pointer; }
.selection-photo-pick:has(input:checked) { color:#155e59; background:#e5f5f2; border-color:#0f766e; }
.selection-photo-pick:has(input:disabled) { cursor:default; }
.selection-photo-pick:focus-within { outline:3px solid #1aa392; outline-offset:2px; }
.selection-photo-pick input { appearance:none; width:16px; height:16px; margin:0; border:1px solid #66737f; border-radius:50%; background:#fff; }
.selection-photo-pick input:checked { border-color:#0f766e; background:#0f766e; box-shadow:inset 0 0 0 3px #e5f5f2; }
.selection-photo-badges { position:absolute; top:8px; right:8px; display:flex; align-items:flex-end; flex-direction:column; gap:5px; pointer-events:none; }
.selection-asset-badge { display:inline-flex; align-items:center; gap:4px; min-height:24px; padding:4px 7px; border-radius:6px; font-size:11px; font-weight:700; line-height:1; }
.selection-asset-badge svg, .selection-rule-toggle svg { width:14px; height:14px; flex:none; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.selection-asset-badge--recommended { color:#7a4b00; background:#fff8e6; border:1px solid #dfc68c; }
.selection-asset-badge--locked { color:#fff; background:#0f766e; border:1px solid #0f766e; }
.selection-photo-meta { gap:6px; padding:8px; }
.selection-photo-meta strong { color:var(--studio-muted); font-size:11px; font-weight:400; }
.selection-rule-controls { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
.selection-photo-meta .selection-rule-toggle { display:flex; justify-content:center; align-items:center; gap:5px; min-width:0; min-height:36px; padding:6px; border:1px solid var(--studio-border); border-radius:6px; color:#66737f; background:#fff; font-family:inherit; font-size:12px; white-space:nowrap; cursor:pointer; }
.selection-rule-toggle--recommended[aria-pressed="true"] { color:#7a4b00; border-color:#dfc68c; background:#fff8e6; }
.selection-rule-toggle--recommended[aria-pressed="true"] svg { fill:currentColor; }
.selection-rule-toggle--required[aria-pressed="true"] { color:#fff; border-color:#0f766e; background:#0f766e; font-weight:700; }
.selection-rule-toggle:disabled { cursor:default; opacity:.65; }
.selection-rule-toggle:focus-visible { outline:3px solid #1aa392; outline-offset:2px; }
.selection-rule-help { margin:0; padding:8px 20px 0; color:var(--studio-muted); font-size:12px; line-height:1.6; }
.selection-rule-help summary { width:fit-content; min-height:32px; cursor:pointer; }
.selection-rule-help p { margin:0 0 8px; }
.selection-rule-feedback { margin:0; color:#155e59; font-size:12px; overflow-wrap:anywhere; }
.selection-rule-feedback--error { color:#b42318; }
.selection-quota-overage { margin:8px 0 0; color:#b45309; font-size:12px; }
@media (max-width:600px) { .selection-photo-pick, .selection-photo-meta .selection-rule-toggle { min-height:44px; } }
.selection-photo-control-note { color:var(--studio-muted); font-size:11px; }
@media (max-width:600px) { .selection-production-heading { align-items:stretch; flex-direction:column; }.selection-production-heading .ax-admin-button { width:100%; }.selection-history-row { grid-template-columns:58px minmax(0,1fr); }.selection-history-row small { grid-column:2; }.selection-submission-row summary { grid-template-columns:1fr auto; }.selection-submission-row summary small { grid-column:1 / -1; }.selection-rule-controls { grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* Basic package settings: inline business result, canonical ledger underneath. */
.selection-package-settings { padding:20px; }
.selection-package-settings h3 { margin:0 0 20px; font-size:15px; }
.selection-quota-field { display:grid; grid-template-columns:minmax(120px,1fr) minmax(0,2fr); gap:16px; align-items:center; }
.selection-quota-field label { font-size:14px; font-weight:600; }
.selection-quota-editor { display:flex; align-items:center; flex-wrap:wrap; gap:10px; min-width:0; }
.selection-quota-editor input { width:100px; max-width:100%; height:40px; padding:8px 12px; border:1px solid var(--studio-border); border-radius:6px; font:inherit; }
.selection-quota-editor input:focus { outline:3px solid #e5f5f2; border-color:#0f766e; }
.selection-quota-editor input[aria-invalid="true"] { border-color:#b42318; }
.selection-quota-editor input:disabled { background:#f3f7f7; color:var(--studio-muted); }
.selection-quota-feedback { margin:10px 0 0; color:var(--studio-muted); font-size:12px; }
.selection-quota-counts { margin:20px 0 0; display:grid; gap:12px; }
.selection-quota-counts > div { display:grid; grid-template-columns:minmax(120px,1fr) minmax(0,2fr); gap:16px; }
.selection-quota-counts dt { color:var(--studio-muted); font-size:13px; }
.selection-quota-counts dd { margin:0; font-size:13px; }
.selection-history-section summary { padding:4px 0; cursor:pointer; color:#0f766e; font-size:13px; }
.selection-history-section[open] summary { margin-bottom:12px; }
@media (max-width:600px) {
  .selection-package-settings { padding:16px; }
  .selection-quota-field { grid-template-columns:1fr; gap:10px; }
  .selection-quota-counts > div { grid-template-columns:minmax(0,1fr) auto; }
  .selection-history-row { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .selection-history-row span { grid-column:1 / -1; }
  .selection-history-row small { grid-column:auto; }
}

/* Selection project workspace: module-local layout, existing authorities and shell tokens. */
.selection-workspace-mode { height:100dvh; overflow:hidden; }
.selection-workspace-mode > .workspace { width:100%; margin-left:0; display:flex; flex-direction:column; min-height:0; }
.selection-workspace-mode .topbar { flex:0 0 48px; min-height:48px; padding:0 20px; border-bottom:1px solid rgba(255,255,255,.09); }
.selection-workspace-mode .nav-toggle, .selection-workspace-mode .nav-close { display:block; }
.studio-admin .selection-workspace-mode .sidebar { transform:translateX(-100%); transition:transform .18s ease-out; }
.studio-admin .selection-workspace-mode.nav-open .sidebar { transform:translateX(0); }
.selection-workspace-mode .scrim { position:fixed; inset:0; z-index:9; background:rgba(16,26,44,.48); }
.selection-workspace-mode.nav-open .scrim { display:block; }
.selection-workspace-mode .content { flex:1; width:100%; max-width:none; margin:0; padding:0; min-height:0; }
.selection-project-workspace { height:100%; min-width:0; display:flex; flex-direction:column; }
.selection-project-bar { display:flex; align-items:center; gap:20px; flex:0 0 72px; min-width:0; padding:12px 20px; color:#f8fafc; background:var(--studio-shell-2); border-bottom:1px solid rgba(255,255,255,.09); }
.selection-project-title { flex:1; min-width:0; }
.content .selection-project-title h1 { font-size:18px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.selection-project-title > span { display:block; margin-top:5px; color:#bdc9d6; font-size:12px; }
.selection-project-switch { min-width:0; max-width:260px; }
.selection-project-switch select { width:100%; min-height:34px; padding:6px 10px; border:1px solid rgba(255,255,255,.18); border-radius:4px; color:#bdc9d6; background:var(--studio-shell-2); font:inherit; font-size:12px; }
.selection-workspace-button { min-height:32px; padding:6px 10px; border:1px solid rgba(255,255,255,.2); border-radius:4px; color:#e5eaf0; background:transparent; font-size:12px; cursor:pointer; }
.selection-workspace-button:hover { border-color:var(--studio-accent); background:rgba(43,183,170,.1); }
.selection-project-workspace button:focus-visible, .selection-project-workspace select:focus-visible, .selection-wall-scroll:focus-visible { outline:2px solid var(--studio-accent); outline-offset:-2px; }
.selection-project-columns { flex:1; min-height:0; display:grid; grid-template-columns:200px minmax(0,1fr) 248px; }
.selection-project-nav { min-width:0; overflow:auto; padding:22px 12px; color:#bdc9d6; background:var(--studio-shell); border-right:1px solid rgba(255,255,255,.09); }
.selection-project-nav-group + .selection-project-nav-group { margin-top:28px; }
.selection-project-nav-group h2 { margin:0 12px 10px; color:#8fa2b5; font-size:11px; font-weight:600; }
.selection-project-nav-item { display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; min-height:38px; padding:8px 12px; border:0; border-left:3px solid transparent; border-radius:4px; color:#bdc9d6; background:transparent; text-align:left; font-size:13px; cursor:pointer; }
.selection-project-nav-item small { color:inherit; opacity:.8; font-size:11px; }
.selection-project-nav-item:hover { color:#fff; background:var(--studio-hover); }
.selection-project-nav-item[aria-current="page"] { color:#fff; background:var(--studio-active); border-left-color:var(--studio-accent); }
.selection-photo-workspace { display:flex; flex-direction:column; min-width:0; min-height:0; color:#e5e7eb; background:#202429; }
.selection-wall-toolbar { display:flex; align-items:center; gap:12px; flex:0 0 54px; padding:10px 20px; border-bottom:1px solid #343a41; }
.selection-wall-toolbar h2 { margin:0; font-size:14px; font-weight:600; }
.selection-wall-toolbar > span { margin-left:auto; color:#aab3bd; font-size:12px; }
.selection-wall-scroll { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; padding:18px 20px 28px; scrollbar-color:#58616c #202429; }
.selection-photo-wall { columns:210px; column-gap:12px; }
.selection-wall-photo { display:inline-block; vertical-align:top; break-inside:avoid; width:100%; margin:0 0 12px; }
.selection-wall-visual { position:relative; min-width:0; }
.selection-wall-preview { display:block; width:100%; padding:0; border:0; background:transparent; cursor:zoom-in; }
.selection-wall-image { display:block; width:100%; height:auto; max-width:100%; object-fit:contain; }
.selection-wall-photo figcaption { padding:7px 2px 0; overflow:hidden; color:#aab3bd; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.selection-wall-indicators { position:absolute; top:8px; right:8px; display:flex; gap:5px; pointer-events:none; }
.selection-wall-indicator { display:grid; width:26px; height:26px; place-items:center; border-radius:4px; color:#fff; background:rgba(16,26,44,.85); }
.selection-wall-indicator--selected { background:#0f766e; }.selection-wall-indicator--recommended { color:#f6cf72; }
.selection-wall-indicator svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.selection-wall-unavailable { display:grid; place-items:center; min-height:150px; padding:20px; border:1px dashed #59636f; color:#bdc9d6; font-size:12px; }
.selection-wall-state { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; min-height:280px; padding:24px; text-align:center; }
.selection-wall-state strong { font-size:16px; }.selection-wall-state p { margin:0; color:#bdc9d6; font-size:13px; line-height:1.6; }
.selection-project-context { min-width:0; overflow:auto; padding:22px 20px; background:#f3f7f7; border-left:1px solid #d9e3e5; }
.selection-context-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; }.selection-context-heading h2 { margin:0; font-size:14px; }
.selection-context-details { margin:20px 0 0; }.selection-context-details > div { margin-bottom:20px; }.selection-context-details dt { margin-bottom:6px; color:var(--studio-muted); font-size:11px; }.selection-context-details dd { margin:0; font-size:13px; line-height:1.55; overflow-wrap:anywhere; }
.selection-context-note, .selection-context-error { font-size:12px; line-height:1.6; color:var(--studio-muted); }.selection-context-error { color:#b42318; }
.selection-mobile-control, .selection-panel-close, .selection-panel-scrim { display:none; }
.selection-visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media (min-width:901px) and (max-width:1200px) { .selection-project-columns { grid-template-columns:172px minmax(0,1fr) 210px; }.selection-project-context { padding:20px 16px; }.selection-project-nav { padding:20px 8px; }.selection-photo-wall { columns:180px; } }
@media (max-width:900px) {
  .selection-workspace-mode .topbar { padding:0 12px; }
  .selection-project-bar { flex:0 0 auto; padding:12px; gap:12px; flex-wrap:wrap; }
  .selection-project-title { flex:1; }.content .selection-project-title h1 { font-size:15px; }
  .selection-project-switch { flex:1 1 100%; max-width:none; }
  .selection-project-columns { grid-template-columns:minmax(0,1fr); }
  .selection-project-nav, .selection-project-context { display:none; }
  .selection-project-nav.is-open, .selection-project-context.is-open { display:block; position:fixed; inset:48px auto 0 0; z-index:23; width:min(280px,calc(100vw - 44px)); }
  .selection-project-context.is-open { inset:48px 0 0 auto; }
  .selection-panel-close, .selection-mobile-control { display:block; }.selection-project-nav > .selection-panel-close { margin:0 0 20px auto; }
  .selection-panel-scrim { display:block; position:fixed; inset:48px 0 0; z-index:22; border:0; background:rgba(0,0,0,.5); }
  .selection-wall-toolbar { padding:10px 12px; gap:8px; }.selection-wall-toolbar > span { font-size:11px; }
  .selection-wall-scroll { padding:12px; }.selection-photo-wall { columns:150px; column-gap:10px; }
}
@media (max-width:420px) { .selection-wall-toolbar { flex-wrap:wrap; }.selection-wall-toolbar > span { display:none; } #selectionContextButton { margin-left:auto; } }
@media (prefers-reduced-motion:reduce) { .selection-workspace-mode .sidebar { transition:none; } }
.analytics-page { display:grid; gap:16px; }.analytics-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }.analytics-heading h1 { margin:0; font-size:24px; line-height:1.25; }.analytics-heading p:not(.eyebrow) { margin:8px 0 0; color:var(--studio-muted); font-size:13px; }.analytics-source-panel { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:16px 18px; border:1px solid #d9e3e5; border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.04); }.analytics-source-panel strong { font-size:14px; }.analytics-source-panel p { margin:5px 0 0; color:var(--studio-muted); font-size:12px; }.analytics-source-list { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }.analytics-source-item { display:inline-flex; align-items:center; gap:8px; min-height:26px; padding:3px 8px; border:1px solid #d9e3e5; border-radius:999px; color:#52626b; background:#f8fafa; font-size:11px; }.analytics-source-item strong { color:#52626b; font:11px Consolas,"Courier New",monospace; }.analytics-source-item em { color:#155e59; font-style:normal; font-weight:700; }.analytics-tabs { display:flex; gap:4px; overflow-x:auto; border-bottom:1px solid #d9e3e5; }.analytics-tab { min-height:40px; padding:0 14px; border:0; border-bottom:2px solid transparent; color:var(--studio-muted); background:transparent; cursor:pointer; font:inherit; font-size:13px; font-weight:700; white-space:nowrap; }.analytics-tab:hover { color:#155e59; }.analytics-tab.is-active { border-bottom-color:#0f766e; color:#0f766e; }.analytics-metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }.analytics-metric-card { min-width:0; padding:16px; border:1px solid #d9e3e5; border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.04); }.analytics-metric-card--partial, .analytics-metric-card--missing, .analytics-metric-card--unavailable, .analytics-metric-card--blocked_by_telemetry, .analytics-metric-card--blocked_by_domain_gap, .analytics-metric-card--intentionally_deferred { border-color:#ead5b5; background:#fffdf8; }.analytics-metric-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }.analytics-metric-heading h3 { margin:0; font-size:14px; line-height:1.4; }.analytics-source-badge { flex:0 0 auto; color:#66737f; font-size:10px; }.analytics-metric-value-wrap { display:flex; min-height:52px; align-items:center; margin:8px 0 6px; }.analytics-metric-value { color:#155e59; font-size:24px; font-weight:800; line-height:1.2; }.analytics-metric-value--unavailable { color:#8a5500; font-size:16px; }.analytics-metric-value--undefined { color:#66737f; font-size:16px; }.analytics-metric-value--distribution { display:grid; gap:3px; color:#155e59; font-size:13px; font-weight:700; }.analytics-metric-status { display:flex; flex-wrap:wrap; gap:8px; color:#66737f; font-size:11px; }.analytics-metric-diagnostic { margin:8px 0 0; color:#8a5500; font-size:11px; line-height:1.4; }.analytics-no-trend { padding:18px; border:1px dashed #cbd7d9; border-radius:8px; color:var(--studio-muted); background:#f8fafa; }.analytics-no-trend strong { display:block; color:#52626b; font-size:13px; }.analytics-no-trend p { margin:6px 0 0; font-size:12px; }.analytics-state { padding:40px 20px; border:1px solid #d9e3e5; border-radius:8px; background:#fff; text-align:center; }.analytics-state strong { display:block; font-size:16px; }.analytics-state p { margin:8px 0 0; color:var(--studio-muted); font-size:13px; }.analytics-state .ax-admin-button { margin-top:16px; }.analytics-state--error strong, .analytics-state--error p { color:#b42318; }
@media (max-width:1100px) { .analytics-metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) { .analytics-heading, .analytics-source-panel { align-items:stretch; flex-direction:column; }.analytics-heading .ax-admin-button { width:100%; }.analytics-source-list { justify-content:flex-start; }.analytics-metric-grid { grid-template-columns:1fr; }.analytics-metric-card { padding:14px; }.analytics-tabs { margin-right:-12px; padding-right:12px; } }
.compare-lite-page { display:grid; width:100%; max-width:1400px; gap:16px; }
.compare-lite-card, .compare-lite-result { padding:20px; border:1px solid #d9e3e5; border-radius:8px; background:#fff; box-shadow:0 6px 18px rgba(18,42,48,.04); }
.compare-lite-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:20px; }
.compare-lite-heading h1 { margin:0; font-size:24px; line-height:1.25; }
.compare-lite-heading p:not(.eyebrow) { margin:8px 0 0; color:var(--studio-muted); font-size:13px; }
.compare-lite-status { display:inline-flex; flex:0 0 auto; align-items:center; min-height:28px; padding:4px 10px; border-radius:999px; color:#66737f; background:#edf1f2; font-size:12px; font-weight:700; white-space:nowrap; }
.compare-lite-status--uploading { color:#155e59; background:#e5f5f2; }.compare-lite-status--success { color:#155e59; background:#d9f3ec; }.compare-lite-status--error { color:#b42318; background:#fff0ee; }
.compare-lite-form { display:grid; gap:16px; }.compare-lite-file-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.compare-lite-file-slot { display:grid; gap:10px; min-width:0; padding:14px; border:1px solid #d9e3e5; border-radius:7px; background:#f8fafa; }
.compare-lite-file-heading { display:grid; gap:4px; min-width:0; }.compare-lite-file-heading strong { font-size:14px; }.compare-lite-file-heading span { overflow:hidden; color:var(--studio-muted); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.compare-lite-preview { display:flex; width:100%; aspect-ratio:4 / 3; align-items:center; justify-content:center; overflow:hidden; border:1px dashed #cbd7d9; border-radius:6px; color:var(--studio-muted); background:#edf3f3; font-size:12px; }
.compare-lite-preview img { display:block; width:100%; height:100%; object-fit:contain; }.compare-lite-file-button { position:relative; justify-self:start; overflow:hidden; }.compare-lite-file-button input { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; }
.compare-lite-note, .compare-lite-feedback { margin:0; color:var(--studio-muted); font-size:12px; line-height:1.5; }.compare-lite-feedback { color:#155e59; font-weight:700; }.compare-lite-actions, .compare-lite-result-actions { display:flex; flex-wrap:wrap; gap:8px; }.compare-lite-result h2 { margin:0 0 16px; font-size:16px; }.compare-lite-result dl { display:grid; grid-template-columns:110px minmax(0,1fr); gap:10px 16px; margin:0; font-size:13px; }.compare-lite-result dt { color:var(--studio-muted); }.compare-lite-result dd { min-width:0; margin:0; overflow-wrap:anywhere; }.compare-lite-result a { color:#0f766e; }.compare-lite-result-actions { margin-top:18px; }
@media (max-width:600px) { .compare-lite-card, .compare-lite-result { padding:16px; }.compare-lite-heading { align-items:stretch; flex-direction:column; gap:12px; }.compare-lite-heading h1 { font-size:21px; }.compare-lite-status { align-self:flex-start; }.compare-lite-file-grid { grid-template-columns:1fr; }.compare-lite-file-button, .compare-lite-actions .ax-admin-button, .compare-lite-result-actions .ax-admin-button { width:100%; }.compare-lite-result dl { grid-template-columns:1fr; gap:4px; }.compare-lite-result dd { margin-bottom:8px; } }
.compare-lite-projects .compare-lite-heading h2 { margin:0; font-size:18px; line-height:1.3; }.compare-lite-project-header, .compare-lite-project-row { display:grid; grid-template-columns:minmax(180px,1.5fr) minmax(130px,1fr) minmax(130px,1fr) minmax(70px,.7fr) minmax(280px,2fr); align-items:center; gap:12px; }.compare-lite-project-header { padding:0 12px 8px; color:var(--studio-muted); font-size:11px; font-weight:700; }.compare-lite-project-list { display:grid; gap:8px; }.compare-lite-project-row { min-width:0; padding:12px; border:1px solid #d9e3e5; border-radius:7px; background:#f8fafa; font-size:12px; }.compare-lite-project-main { display:grid; min-width:0; gap:4px; }.compare-lite-project-main strong, .compare-lite-project-main small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.compare-lite-project-main strong { font-size:14px; }.compare-lite-project-main small, .compare-lite-project-row time { color:var(--studio-muted); }.compare-lite-project-status { justify-self:start; padding:3px 8px; border-radius:999px; color:#155e59; background:#e5f5f2; font-size:11px; font-weight:700; white-space:nowrap; }.compare-lite-project-status--expired { color:#9a6100; background:#fff3dc; }.compare-lite-project-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; }.compare-lite-project-actions .ax-admin-button { min-height:30px; padding:4px 9px; font-size:12px; }.compare-lite-project-unavailable { color:#9a6100; font-size:12px; }.compare-lite-project-state { padding:28px 18px; border:1px dashed #cbd7d9; border-radius:7px; color:var(--studio-muted); background:#f8fafa; text-align:center; }.compare-lite-project-state strong { display:block; color:var(--studio-text); font-size:14px; }.compare-lite-project-state p { margin:7px 0 0; }.compare-lite-project-state .ax-admin-button { margin-top:14px; }.compare-lite-project-state--error { border-color:#efc5c1; background:#fff8f7; }.compare-lite-project-state--error strong, .compare-lite-project-state--error p { color:#b42318; }
@media (max-width:900px) { .compare-lite-project-header { display:none; }.compare-lite-project-row { grid-template-columns:1fr; gap:8px; }.compare-lite-project-row time:nth-child(2)::before { content:"创建时间："; color:var(--studio-muted); }.compare-lite-project-row time:nth-child(3)::before { content:"到期时间："; color:var(--studio-muted); }.compare-lite-project-actions { justify-content:flex-start; }.compare-lite-project-actions .ax-admin-button { flex:1 1 120px; text-align:center; } }
.wallpaper-crop-dialog { width: min(680px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow: auto; padding: 20px; border: 1px solid var(--ax-ui-border, #d9e3e5); border-radius: 8px; color: var(--ax-ui-text, #17212b); background: var(--ax-ui-surface, #fff); }
.wallpaper-crop-dialog::backdrop { background: rgba(16, 26, 44, .7); }
.wallpaper-crop-dialog h2 { font-size: 18px; margin-top: 0; }
.wallpaper-crop-frame { width: min(100%, 250px, calc(42dvh * .45)); aspect-ratio: 9 / 20; margin: 12px auto; background: #101a2c; }
.wallpaper-crop-frame canvas { width: 100%; height: 100%; display: block; cursor: grab; touch-action: none; }
.wallpaper-crop-frame canvas:active { cursor: grabbing; }
.wallpaper-crop-dialog .dialog-actions { flex-wrap: wrap; gap: 12px; }
.wallpaper-crop-dialog input[type="range"] { width: 100%; }

.wallpaper-crop-success { color: var(--ax-ui-success, #15803d); background: #edf9f1; padding: 10px 12px; border-radius: 6px; }
/* AX-WP-V1-STUDIO-UI01 — module-local workspace, shared shell unchanged. */
.wallpaper-workspace { min-width: 0; width: 100%; }
.wallpaper-tabs { display:flex; gap:24px; border-bottom:1px solid #d4dfdf; }
.wallpaper-tabs button { padding:14px 4px; border:0; border-bottom:3px solid transparent; background:none; color:var(--studio-muted); cursor:pointer; font-weight:700; }
.wallpaper-tabs button[aria-pressed="true"] { color:#0f766e; border-bottom-color:#0f766e; }
.wallpaper-connection { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; padding:12px 0; font-size:13px; color:var(--studio-muted); }
.wallpaper-connection details { max-width:100%; overflow-wrap:anywhere; }
.wallpaper-steps { display:flex; flex-wrap:wrap; gap:12px 28px; list-style:none; padding:12px 0; color:var(--studio-muted); font-size:13px; }
.wallpaper-steps [aria-current="step"] { color:#0f766e; font-weight:700; }
.wallpaper-publish-layout { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(280px,1fr); gap:24px; align-items:start; }
.wallpaper-publish-layout h2, .wallpaper-gallery-detail h2 { font-size:16px; margin:0 0 16px; }
.wallpaper-composition, .wallpaper-publish-fields, .wallpaper-gallery-detail { min-width:0; padding:20px; border:1px solid #d4dfdf; border-radius:8px; background:white; }
.wallpaper-publish-fields { position:sticky; top:20px; }
.wallpaper-publish-layout .field { min-width:0; }
.wallpaper-publish-layout input, .wallpaper-publish-layout textarea, .wallpaper-publish-layout select { width:100%; max-width:100%; min-width:0; }
.wallpaper-publish-layout textarea, .wallpaper-gallery-tools select { font:inherit; border:1px solid #cbd7d9; border-radius:6px; padding:10px; }
.wallpaper-composition-previews { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:20px 0; align-items:start; }
.wallpaper-composition-previews figure { min-width:0; margin:0; text-align:center; }
.wallpaper-composition-previews img { display:block; width:100%; height:clamp(220px,35vh,420px); object-fit:contain; background:#f3f7f7; border-radius:6px; }
.wallpaper-composition-previews figcaption { margin-top:8px; color:var(--studio-muted); font-size:12px; }
.wallpaper-renditions { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.wallpaper-rendition { min-width:0; font-size:11px; text-decoration:none; color:var(--studio-text); overflow-wrap:anywhere; }
.wallpaper-rendition img { width:100%; aspect-ratio:9/20; object-fit:contain; background:#f3f7f7; border-radius:4px; }
.wallpaper-rendition span, .wallpaper-rendition small { display:block; margin-top:6px; }
.wallpaper-primary-action { margin-top:24px; }
.wallpaper-advanced { margin-top:20px; font-size:12px; color:var(--studio-muted); overflow-wrap:anywhere; }
.wallpaper-advanced summary { cursor:pointer; }
.wallpaper-advanced pre { white-space:pre-wrap; overflow-wrap:anywhere; max-height:300px; overflow:auto; }
.wallpaper-gallery-tools { display:flex; flex-wrap:wrap; align-items:end; gap:16px; margin:8px 0 24px; }
.wallpaper-gallery-tools .field { margin:0; flex:1 1 180px; }
.wallpaper-waterfall { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; align-items:start; }
.wallpaper-gallery-card { display:block; width:100%; padding:0; margin:0; border:1px solid #d4dfdf; border-radius:8px; overflow:hidden; background:white; text-align:left; color:var(--studio-text); cursor:pointer; }
.wallpaper-gallery-card img { display:block; width:100%; height:auto; aspect-ratio:1/1; object-fit:cover; background:#e9eeee; }
.wallpaper-gallery-card:focus-visible, .wallpaper-tabs button:focus-visible { outline:3px solid var(--studio-accent); outline-offset:2px; }
.wallpaper-card-caption { display:grid; gap:8px; padding:14px; overflow-wrap:anywhere; }
.wallpaper-card-caption small, .wallpaper-gallery-note { color:var(--studio-muted); font-size:12px; }
.wallpaper-image-empty { display:grid; place-items:center; width:100%; aspect-ratio:1/1; padding:20px; color:var(--studio-muted); background:#e9eeee; }
.wallpaper-gallery-note { display:block; margin:16px 0; }
.wallpaper-gallery-detail { margin-bottom:24px; overflow-wrap:anywhere; }
@media (min-width:1800px) { .wallpaper-publish-layout { grid-template-columns:minmax(0,2fr) minmax(360px,1fr); gap:32px; } }
@media (max-width:1000px) { .wallpaper-publish-layout { grid-template-columns:minmax(0,1fr); } .wallpaper-publish-fields { position:static; } }
@media (min-width:1600px) { .wallpaper-waterfall { grid-template-columns:repeat(5,minmax(0,1fr)); } }
@media (max-width:900px) { .wallpaper-waterfall { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:600px) { .wallpaper-waterfall { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .wallpaper-card-caption { padding:10px; } .wallpaper-composition, .wallpaper-publish-fields { padding:14px; } .wallpaper-renditions { grid-template-columns:repeat(2,minmax(0,1fr)); } .wallpaper-composition-previews { gap:10px; } .wallpaper-composition-previews img { height:240px; } .wallpaper-steps { display:grid; gap:8px; } }
@media (max-width:360px) { .wallpaper-waterfall { grid-template-columns:minmax(0,1fr); } }
.wallpaper-gallery-entry { min-width:0; width:100%; }
.wallpaper-gallery-check { display:flex; align-items:center; gap:8px; padding:8px; overflow-wrap:anywhere; }
.wallpaper-gallery-check input { flex:none; width:20px; height:20px; }