*{box-sizing:border-box;margin:0;padding:0}:root{--bg: #ffffff;--panel: #ffffff;--panel-2: #f6f6f4;--line: #e7e5e1;--text: #2b2723;--muted: #8d877d;--accent: #d8a24a;--accent-ink: #ffffff}html,body{height:100%}body{font-family:Segoe UI,system-ui,sans-serif;background:var(--bg);color:var(--text);display:flex;flex-direction:column;overflow:hidden}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 18px;background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap}.brand{display:flex;align-items:center;gap:12px}.brand-logo{height:40px;display:block}.brand em{color:var(--muted);font-style:normal;font-size:13px;border-left:1px solid var(--line);padding-left:12px}.spread-nav,.actions{display:flex;align-items:center;gap:8px}.actions select{width:140px}#fontSizeSelect{width:80px}.actions button{white-space:nowrap}.save-status{font-size:12px;color:var(--muted)}#spreadLabel{min-width:110px;text-align:center;color:var(--muted);font-size:14px}button{font:inherit;color:var(--text);background:var(--panel-2);border:1px solid var(--line);border-radius:8px;padding:7px 12px;cursor:pointer}button:hover{border-color:var(--accent)}button.primary{background:var(--accent);color:var(--accent-ink);font-weight:600;border-color:var(--accent)}button.ghost{background:transparent}.workspace{flex:1;display:flex;min-height:0}.sidebar{width:250px;flex-shrink:0;background:var(--panel);border-right:1px solid var(--line);overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:18px}.panel h3{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-bottom:8px}select,.sidebar input[type=text]{width:100%;font:inherit;color:var(--text);background:var(--panel-2);border:1px solid var(--line);border-radius:8px;padding:7px 10px}.sidebar .panel select+select,.sidebar .panel select+input{margin-top:8px}input::placeholder{color:#b3ada3}.hint{font-size:12px;color:var(--muted);margin-top:6px;line-height:1.4}.upload-btn{display:block;text-align:center;background:var(--accent);color:var(--accent-ink);font-weight:600;border-radius:8px;padding:8px;cursor:pointer}.photo-tray{margin-top:10px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.photo-tray{-webkit-user-select:none;user-select:none}.photo-tray .thumb{position:relative;cursor:pointer}.photo-tray img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px;border:2px solid transparent;opacity:.9;display:block}.photo-tray .thumb:hover img{opacity:1}.photo-tray .thumb.used img{opacity:.35;filter:grayscale(1)}.photo-tray .thumb.selected img{border-color:var(--accent);opacity:1;filter:none}.photo-tray .badge{position:absolute;top:4px;right:4px;background:var(--accent);color:#fff;font-size:11px;font-weight:700;width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center}.photo-tray .thumb-del{position:absolute;top:3px;left:3px;width:18px;height:18px;padding:0;border:none;border-radius:50%;background:#0000008c;color:#fff;font-size:14px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .12s}.photo-tray .thumb:hover .thumb-del{opacity:1}.photo-tray .thumb-del:hover{background:#c0392b}@media(hover:none){.photo-tray .thumb-del{opacity:.85}}.layout-bar{display:flex;align-items:center;gap:18px}.layout-bar .seg{display:flex;align-items:center;gap:8px}.layout-bar span{min-width:96px;text-align:center;color:var(--muted);font-size:13px}.layout-bar button{padding:4px 12px;font-size:15px;line-height:1.2}.canvas-area{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:18px;min-width:0;gap:10px}.canvas-area{background:#fafaf8}.canvas-row{display:flex;align-items:center;gap:16px;max-width:100%}.spread-arrow{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 14px;border-radius:12px;color:var(--muted);flex-shrink:0}.spread-arrow .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.5px;line-height:1.3}.spread-arrow .arrow{font-size:28px;line-height:1}.spread-arrow[hidden]{display:none}.send-order-big{background:var(--accent);border-color:var(--accent);color:#fff}.send-order-big:hover{color:#fff;filter:brightness(1.05)}.spread-arrow:hover:not(:disabled){color:var(--text);border-color:var(--accent)}.spread-arrow:disabled{opacity:.25;cursor:default;border-color:var(--line)}.canvas-wrap{box-shadow:0 8px 28px #3c321e24;border:1px solid var(--line);border-radius:4px;overflow:hidden}.canvas-help{font-size:12px;color:var(--muted);text-align:center}kbd{background:var(--panel-2);border:1px solid var(--line);border-radius:4px;padding:1px 5px;font-size:11px}.check{display:flex;align-items:center;gap:6px;margin-top:8px;cursor:pointer}.price-hint{margin-top:10px;font-size:13px;color:var(--muted)}.price-hint strong{color:var(--text);font-size:16px}body.landing-mode .topbar,body.landing-mode .workspace{display:none}body:not(.landing-mode) .landing{display:none}.landing{overflow-y:auto;height:100%}.landing h2{font-size:22px;margin-bottom:18px}.landing h3{font-size:13px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:26px 0 10px}.landing-hero{text-align:center;padding:64px 20px 30px}.landing-logo{width:min(420px,80vw);margin:0 auto 18px;display:block}.landing-claim{font-family:Oswald,Segoe UI,sans-serif;font-weight:500;font-size:clamp(28px,4.5vw,44px);text-transform:uppercase;letter-spacing:3px;color:var(--text);margin:18px 0 14px;line-height:1.2}.landing-sub{max-width:560px;margin:0 auto;color:var(--muted);line-height:1.6;font-size:14px}.landing-config,.landing-gallery{max-width:860px;margin:0 auto;padding:26px 20px}.cover-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}.cover-card{padding:0;overflow:hidden;text-align:left;border-radius:12px;display:flex;flex-direction:column;gap:0;background:var(--panel)}.cover-card img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}.cover-card strong{padding:10px 14px 2px;font-size:15px}.cover-card span{padding:0 14px 12px;font-size:12px;color:var(--muted)}.cover-card.active{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}.size-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}.size-card{padding:14px;border-radius:12px;text-align:center}.size-card .shape{margin:0 auto 10px;background:var(--panel-2);border:1px solid var(--line)}.size-card strong{display:block;font-size:15px}.size-card span{font-size:12px;color:var(--muted)}.size-card.active{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}.pages-row{display:flex;gap:12px;flex-wrap:wrap}.pages-row button{padding:12px 22px;border-radius:10px;font-size:15px}.pages-row button.active{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}.box-option{margin-top:26px;display:flex;align-items:center;gap:14px;cursor:pointer;border:1px solid var(--line);border-radius:12px;padding:10px 14px;background:var(--panel)}.box-option img{width:92px;aspect-ratio:16/10;object-fit:cover;border-radius:8px}.box-option em{font-style:normal;color:var(--muted);font-size:13px}.price-bar{position:sticky;bottom:0;margin-top:26px;padding:14px 18px;background:var(--panel);border:1px solid var(--line);border-radius:14px;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;box-shadow:0 -6px 24px #3c321e14}.price-bar>div{display:flex;flex-direction:column}.price-bar span{font-size:13px;color:var(--muted)}.price-bar strong{font-size:24px}.price-bar .primary{font-size:16px;padding:12px 22px}.model-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.model-card{padding:0;overflow:hidden;border-radius:12px;text-align:left;background:var(--panel)}.model-card img{width:100%;aspect-ratio:16/11;object-fit:cover;display:block}.model-card span{display:block;padding:8px 12px;font-size:13px}.model-card.active{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}.cover-text{width:100%;max-width:420px;font:inherit;padding:11px 14px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text)}.landing-footer{text-align:center;padding:34px 20px 46px;color:var(--muted);font-size:13px;line-height:1.8}.landing-footer a{color:var(--accent);text-decoration:none}.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#1e1a1473;display:flex;align-items:center;justify-content:center;padding:20px}.modal[hidden]{display:none}.modal-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:26px;width:min(420px,100%);display:flex;flex-direction:column;gap:12px;box-shadow:0 18px 60px #1e1a1440}.modal-card h3{font-size:20px}.pay-summary{color:var(--muted);font-size:14px}.pay-total{font-size:26px;font-weight:700}.modal-card .primary{padding:12px;font-size:15px}.modal-card .primary.mp{background:#009ee3;border-color:#009ee3;color:#fff}.modal-card .primary.pp{background:#003087;border-color:#003087;color:#fff}.pay-form{display:flex;flex-direction:column;gap:8px}.pay-form label{font-size:12px;color:var(--muted);display:flex;flex-direction:column;gap:3px}.pay-form input,.pay-form textarea{font:inherit;font-size:14px;color:var(--text);background:var(--panel-2);border:1px solid var(--line);border-radius:8px;padding:8px 10px;resize:vertical}