.designer-workspace { max-width:1240px; margin:0 auto; padding:32px 32px 60px; }
.designer-heading { display:flex; justify-content:space-between; align-items:center; gap:24px; margin-bottom:24px; }
.designer-heading .eyebrow { margin-bottom:10px; }.designer-heading h1 { font-size:clamp(26px,3vw,36px); margin-bottom:8px; }.designer-heading h1 span { color:var(--blue); }.designer-heading p { margin-bottom:0; font-size:13px; }
.designer-toolbar { position:sticky; top:0; z-index:5; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 0; margin-bottom:18px; background:color-mix(in srgb,var(--page) 94%,transparent); backdrop-filter:blur(16px); border-bottom:1px solid var(--line); }
.draft-indicator { display:flex; align-items:center; gap:9px; }.draft-indicator>span { height:7px; width:7px; border-radius:50%; background:#64958a; }.draft-indicator p { margin:0; font-size:12px; }
.designer-actions { display:flex; align-items:center; gap:8px; }.designer-actions .button { min-height:42px; padding:9px 14px; }.designer-actions .icon-button { font-size:23px; }
.designer-grid { display:grid; grid-template-columns:minmax(290px,360px) minmax(0,1fr); gap:28px; align-items:start; }.designer-controls { min-width:0; border:1px solid var(--line); border-radius:20px; background:#fff; box-shadow:var(--shadow-card); overflow:hidden; }.designer-controls form { margin:0; }
.designer-tabs { display:grid; grid-template-columns:repeat(4,1fr); padding:8px; border-bottom:1px solid var(--line); gap:4px; background:#fafbfe; }.designer-tabs button { border:0; border-radius:8px; background:transparent; min-height:42px; padding:6px; font-size:12px; color:var(--muted); }.designer-tabs button[aria-pressed=true] { color:var(--ink); background:#fff; box-shadow:0 2px 6px #243b6110; }
.designer-panel { padding:24px; }.designer-panel+.designer-panel { border-top:1px solid var(--line); }.designer-panel-heading h2 { font-size:21px; margin-bottom:8px; }.designer-panel-heading p { font-size:12px; line-height:1.7; margin-bottom:24px; }.designer-panel label { font-size:12px; }.designer-panel :is(input,textarea,select) { font-size:16px; }.designer-panel h3 { font-size:15px; margin-top:26px; }.designer-panel .notice { margin-bottom:0; }
.designer-bottom-actions { display:flex; flex-direction:column; padding:14px 24px 20px; border-top:1px solid var(--line); }.designer-bottom-actions .text-button { font-size:12px; justify-content:flex-start; }
.theme-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:24px; }.theme-tile { padding:7px; text-align:left; border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--ink); }.theme-tile[aria-pressed=true] { border:2px solid var(--blue); padding:6px; }.theme-tile strong,.theme-tile small { display:block; padding:0 5px; }.theme-tile strong { font-size:12px; margin:8px 0 2px; }.theme-tile small { font-size:9px; color:var(--muted); margin-bottom:5px; }
.theme-art { height:80px; display:flex; flex-direction:column; gap:7px; align-items:center; justify-content:center; border-radius:7px; background:#eef3fa; }.theme-art i { width:19px; height:19px; border-radius:50%; background:#d2def0; }.theme-art b { width:43px; height:5px; border-radius:3px; background:#566a8c; }.theme-art em { width:54px; height:13px; border-radius:4px; background:#326dde; }.theme-warm .theme-art { background:#f8eee6; }.theme-warm .theme-art em { background:#9a4d2e; }.theme-warm .theme-art i { background:#e0bb9e; }.theme-bold .theme-art { background:#eee9fc; }.theme-bold .theme-art em { background:#6d3fd2; }.theme-bold .theme-art i { background:#cdb7ef; }.theme-night .theme-art { background:#172032; }.theme-night .theme-art b { background:#bac9e3; }.theme-night .theme-art em { background:#a8c7ff; }.theme-night .theme-art i { background:#465b7b; }
.colour-pair { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.colour-pair input[type=color] { height:44px; padding:5px; cursor:pointer; }
.block-order { margin:12px 0 0; padding:0; list-style:none; }.block-order li { display:flex; align-items:center; gap:8px; margin:7px 0; padding:8px 10px; border:1px solid var(--line); border-radius:10px; font-size:12px; background:var(--page); }.block-order strong { flex:1; font-weight:500; }.drag-handle { color:var(--muted); font-size:20px; cursor:grab; }.block-order button { width:32px; height:34px; padding:0; border:0; background:#fff; border-radius:6px; color:var(--ink); }
.designer-amounts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }.designer-amounts label { font-size:10px; }.money-input { display:flex; align-items:center; gap:3px; padding:0 8px; margin-top:8px; background:#fff; border:1px solid var(--control-line); border-radius:10px; }.money-input input { padding:10px 0!important; border:0!important; background:transparent!important; margin:0!important; font-size:16px!important; box-shadow:none; }.designer-switch { padding:12px 0; line-height:1.8; }
.designer-preview { position:sticky; top:88px; min-width:0; }.preview-toolbar { display:flex; align-items:center; justify-content:space-between; margin:0 auto 14px; gap:16px; max-width:680px; }.preview-toolbar strong { font-size:12px; }.preview-toolbar span { display:block; font-size:10px; color:var(--muted); }.preview-sizes { display:flex; background:var(--surface-soft); border-radius:8px; padding:3px; }.preview-sizes button { width:36px; height:32px; border:0; border-radius:6px; background:transparent; font-size:23px; color:var(--muted); }.preview-sizes button[aria-pressed=true] { background:#fff; color:var(--blue); box-shadow:var(--shadow-control); }
.preview-device { width:380px; max-width:100%; margin:auto; border:7px solid #fff; border-radius:30px; box-shadow:0 18px 70px #233b6112,0 0 0 1px var(--line); overflow:hidden; background:#fafbfe; }.preview-device[data-device=desktop] { width:720px; border-radius:18px; }.preview-device .tip-page { min-height:650px; padding:26px 16px; }.preview-device .tipping-card { padding:25px 20px; border-radius:var(--tp-radius); }.preview-device .tip-cover { margin:-25px -20px 20px; }.preview-device .tip-page h1 { font-size:26px; }.preview-device [data-edit] { cursor:pointer; border-radius:8px; outline:1px dashed transparent; outline-offset:5px; }.preview-device [data-edit]:hover { outline-color:var(--tp-accent); }.preview-hint { text-align:center; font-size:11px; margin:18px 0; }.preview-only-note { font-size:12px; padding:12px; background:var(--surface-soft); border-radius:10px; }
.photo-heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; gap:8px; }.photo-heading strong { font-size:13px; }.photo-heading .micro { font-size:10px; margin:0; }.photo-drop { border:1px dashed #a9b8ce; border-radius:13px; background:var(--page); padding:22px 15px; text-align:center; }.photo-drop>span { display:block; font-size:11px; color:var(--muted); margin-bottom:12px; }.photo-picker { margin:0 0 8px; font-size:12px; }.photo-picker input { font-size:16px; padding:6px!important; min-height:36px!important; border:0!important; background:transparent!important; }.photo-control { margin-bottom:24px; }.photo-tools { display:flex; gap:16px; }.photo-tools .text-button { font-size:11px; }.photo-drop.drag-over { border-color:var(--blue); background:var(--blue-soft); }
.crop-dialog { border:1px solid var(--line); border-radius:22px; padding:24px; width:min(460px,calc(100% - 32px)); max-height:calc(100dvh - 32px); overflow:auto; box-shadow:0 25px 100px #182c3d40; }.crop-dialog::backdrop { background:#17233566; backdrop-filter:blur(4px); }.crop-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }.crop-heading h2 { font-size:22px; margin:0; }.crop-dialog>p { font-size:12px; margin:12px 0 18px; }.crop-dialog canvas { display:block; width:100%; height:auto; border-radius:12px; touch-action:none; background:#eef1f7; cursor:grab; }.crop-dialog input[type=range] { width:100%; accent-color:var(--blue); }.crop-dialog label { font-size:12px; margin:20px 0; }
.designer-mobile-tabs { display:none; }
.designer-enhanced .no-js-order,.designer-enhanced .no-js-photo-remove,.designer-enhanced .upload-fallback { display:none; }
.designer-enhanced .designer-panel[data-controls=style] label:has(select[name=theme]) { display:none; }
@media(max-width:1000px) { .designer-workspace { padding:24px 20px 50px; }.designer-grid { grid-template-columns:minmax(270px,320px) minmax(0,1fr); gap:18px; }.designer-panel { padding:20px; } }
@media(max-width:760px) { .designer-heading { align-items:flex-start; }.designer-heading>.text-button { font-size:11px; white-space:nowrap; }.designer-workspace { padding:22px 16px 90px; }.designer-toolbar { position:static; flex-direction:column; align-items:stretch; }.designer-actions { justify-content:flex-end; }.designer-actions .button { flex:1; padding:9px 8px; font-size:12px; }.designer-grid { display:block; }.designer-preview { position:static; margin-top:28px; }.designer-mobile-tabs:not([hidden]) { display:grid; grid-template-columns:1fr 1fr; background:var(--surface-soft); border-radius:10px; padding:4px; margin-bottom:20px; }.designer-mobile-tabs button { border:0; border-radius:8px; background:transparent; min-height:40px; font-size:12px; }.designer-mobile-tabs button[aria-pressed=true] { background:#fff; box-shadow:var(--shadow-control); }.designer-enhanced[data-mobile-view=edit] .designer-preview { display:none; }.designer-enhanced[data-mobile-view=preview] .designer-controls { display:none; }.designer-enhanced[data-mobile-view=preview] .designer-preview { margin-top:0; }.preview-device { width:375px; }.designer-heading h1 { font-size:26px; }.designer-heading .eyebrow { font-size:8px; } }
@media(prefers-reduced-motion:no-preference) { .theme-tile,.preview-device { transition:border-color .16s,width .22s,box-shadow .16s; } }

.photo-picker input::file-selector-button { background:#fff; color:var(--ink); border:1px solid var(--control-line); border-radius:8px; padding:8px 12px; margin-right:8px; font:inherit; font-size:12px; cursor:pointer; }
