/* ===== Designer styles (scoped under #bcd-overlay) ===== */
/* Hide the theme's "scroll to top" button while the designer is open
   (Astra + common plugins). The designer is a full-screen overlay, so the
   button would otherwise float on top of it, especially on mobile. */
body.bcd-designer-active #ast-scroll-top,
body.bcd-designer-active .ast-scroll-top-icon,
body.bcd-designer-active #scroll-to-top,
body.bcd-designer-active .scroll-to-top,
body.bcd-designer-active .to-top,
body.bcd-designer-active .back-to-top,
body.bcd-designer-active a[href="#"][class*="top"] { display:none !important; }
/* Hide the Tawk.to chat widget while the designer is open — it floats over
   the canvas/toolbar and gets in the way. Covers the common Tawk containers. */
body.bcd-designer-active #tawkchat-container,
body.bcd-designer-active #tawkchat-minified-wrapper,
body.bcd-designer-active .tawk-min-container,
body.bcd-designer-active div[class*="tawk"],
body.bcd-designer-active iframe[title*="chat" i],
body.bcd-designer-active iframe[id*="tawk"] { display:none !important; visibility:hidden !important; }
#bcd-overlay { position: fixed; inset: 0; z-index: 999999; background: #fff; display: none; }
#bcd-overlay.bcd-open { display: flex; flex-direction: column; }
#bcd-overlay #bcd-close {
    position:absolute; top:14px; right:16px; z-index:14;
    width: 38px; height: 38px; border-radius: 50%;
    border: 1px solid #d8dadf; background: #fff; color: #333;
    font-size: 22px; line-height: 1; cursor: pointer; box-shadow:var(--shadow-sm);
}
#bcd-overlay #bcd-close:hover { background: #f4f5f7; }
/* ===== Top bar ===== */
#bc-topbar { height:56px; flex:0 0 56px; display:flex; align-items:center; justify-content:space-between; padding:0 32px !important; border-bottom:1px solid var(--line); background:#fff; z-index:20; }
#bc-topbar .bc-tb-left, #bc-topbar .bc-tb-right { display:flex; align-items:center; gap:14px; }
#bc-topbar .bc-tb-logo { display:flex; align-items:center; height:36px; }
#bc-topbar .bc-tb-logo img { height:26px; width:auto; display:block; }
#bc-topbar .bc-tb-divider { width:1px; height:24px; background:var(--line); }
#bc-topbar .bc-tb-product { font-size:15px; font-weight:600; color:#16181d; }
#bc-topbar .bc-tb-history { display:flex; align-items:center; gap:0; margin-left:2px; }
#bc-topbar .bc-tb-history button { width:32px; height:32px; border:0; background:none; border-radius:8px; color:#5a6473; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .12s,color .12s; }
#bc-topbar .bc-tb-history button:hover { background:#f3f4f7; color:#16181d; }
#bc-topbar .bc-tb-history button:disabled { opacity:.35; cursor:default; }
#bc-topbar .bc-tb-price { display:flex; align-items:center; gap:6px; font-size:16px; font-weight:700; color:#16181d; white-space:nowrap; border:1px solid var(--line); background:#fff; border-radius:24px; padding:8px 14px; cursor:pointer; font-family:inherit; transition:background .12s,border-color .12s; }
  #bc-topbar .bc-tb-price:hover { background:#f3f6ff; border-color:var(--accent); }
  #bc-topbar .bc-tb-price svg { color:#5a6473; align-self:center; }
  #bc-topbar .bc-tb-price-arrow { color:var(--accent); }
  #bc-topbar .bc-tb-price-qty { font-size:12px; font-weight:500; color:#8a909c; }
@media (max-width:700px){ #bc-topbar .bc-tb-product{ display:none; } #bc-topbar .bc-tb-logo img{ height:26px; } }


/* "Browse our templates" launch button — Vistaprint style */
#bcd-launch {
    display: flex; align-items: center; justify-content: center; gap: 4px;
    width: 100%; margin: 14px 0; padding: 16px 28px;
    background: #4dbbe8; color: #ffffff; border: 0; border-radius: 0;
    font-size: 17px; font-weight: 700; letter-spacing: .2px; cursor: pointer;
    transition: background .15s; text-align: center; line-height: 1.2;
}
#bcd-launch:hover { background: #3aa9d6; }
#bcd-launch svg { flex: 0 0 auto; }
#bcd-upload-btn {
    display: flex; align-items: center; justify-content: center; gap: 4px;
    width: 100%; margin: 14px 0; padding: 14px 28px;
    background: #fff; color: #16325c; border: 2px solid #16325c; border-radius: 0;
    font-size: 17px; font-weight: 700; letter-spacing: .2px; line-height: 1.2;
    cursor: pointer; transition: all .12s; text-align: center;
}
#bcd-upload-btn:hover { background: #16325c; color: #fff; }
#bcd-upload-btn svg { flex: 0 0 auto; }


  /* ===== Non-Google Korean fonts via jsdelivr (눈누 인기). 
     ⚠️ artifact/preview 환경은 jsdelivr 차단 → 여기선 fallback 폰트로 보임.
     실제 WordPress 사이트에 이식하면 정상 작동함. ===== */
  @import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.css");
  @font-face { font-family:'GmarketSans'; font-weight:300; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff'); font-display:swap; }
  @font-face { font-family:'GmarketSans'; font-weight:500; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff'); font-display:swap; }
  @font-face { font-family:'GmarketSans'; font-weight:700; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff'); font-display:swap; }
  @font-face { font-family:'SCDream'; font-weight:400; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-4Regular.woff') format('woff'); font-display:swap; }
  @font-face { font-family:'SCDream'; font-weight:700; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-6Bold.woff') format('woff'); font-display:swap; }
  @font-face { font-family:'TheJamsil'; font-weight:400; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2206-02@1.0/TheJamsil4Medium.woff2') format('woff2'); font-display:swap; }
  @font-face { font-family:'TheJamsil'; font-weight:700; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2206-02@1.0/TheJamsil6Bold.woff2') format('woff2'); font-display:swap; }
  @font-face { font-family:'Cafe24Ssurround'; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/Cafe24Ssurround.woff') format('woff'); font-display:swap; }
  @font-face { font-family:'BMHANNA'; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/BMHANNAPro.woff') format('woff'); font-display:swap; }
  @font-face { font-family:'BMDOHYEON'; src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/BMDOHYEON.woff') format('woff'); font-display:swap; }
  #bcd-overlay {
    --bg: #f4f5f7; --panel: #ffffff; --ink: #16181d; --muted: #8a909c; --line: #e9eaee;
    --rail-ink: #5a6473; --rail-active-bg: #e6f4fb; --rail-active-ink: #3ba9d8;
    --accent: #3ba9d8; --accent-soft: #e6f4fb; --safety: #2e9e6b; --bleed: #3ba9d8;
    --shadow: 0 1px 2px rgba(16,24,40,.05), 0 6px 20px rgba(16,24,40,.07);
    --shadow-sm: 0 1px 3px rgba(16,24,40,.10);
  }
  #bcd-overlay * { box-sizing: border-box; margin: 0; padding: 0; }
  #bcd-overlay button { box-shadow: none; }
  #bcd-overlay #bc-rail button, #bcd-overlay #bc-panel button, #bcd-overlay .bc-legend button { box-shadow: none !important; -webkit-appearance: none; appearance: none; }
  #bcd-overlay { font-family: 'Poppins', system-ui, sans-serif; background: var(--bg); color: var(--ink); -webkit-font-smoothing: antialiased; }
  #bc-app { display: grid; grid-template-columns: 100px 320px 1fr; flex:1; min-height:0; }
  #bc-error { position:fixed; inset:0; background:#fff; z-index:9999; display:none; align-items:center; justify-content:center; padding:40px; text-align:center; font-size:15px; color:#c0392b; }

  #bc-rail { background: var(--panel); border-right: 1px solid var(--line); display: flex; flex-direction: column; align-items: center; padding: 16px 6px; gap: 20px; overflow-y: auto; }
  .bc-rail-btn { width: 84px; padding: 10px 0; border: 0; background: transparent; box-shadow: none !important; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 7px; color: var(--rail-ink); border-radius: 12px; transition: background .15s, color .15s, transform .1s; }
  .bc-rail-btn:hover { background: #eef1f6; color: var(--rail-active-ink); }
  .bc-rail-btn:hover svg { transform: scale(1.08); }
  .bc-rail-btn:active { transform: scale(.96); }
  .bc-rail-btn.active { color: var(--rail-active-ink); background: var(--rail-active-bg); }
  .bc-rail-btn.active svg { stroke-width: 2.1; }
  .bc-rail-btn svg { width: 24px; height: 24px; stroke-width: 1.7; transition: transform .12s, stroke-width .12s; }
  .bc-rail-btn span { font-size: 11px; font-weight: 500; line-height: 1.15; text-align:center; }

  #bc-panel { background: var(--panel); border-right: 1px solid var(--line); overflow-y: auto; padding: 22px 20px 40px; }
  .bc-panel-view { display: none; }
  .bc-panel-view.active { display: block; animation: fade .18s ease; }
  @keyframes fade { from {opacity:0; transform:translateY(4px);} to {opacity:1; transform:none;} }
  .bc-panel-head { display:flex; align-items:center; justify-content:space-between; margin-bottom: 18px; }
  .bc-panel-title { font-size: 18px; font-weight: 600; letter-spacing: -.2px; }
  .bc-collapse { border:0; background:transparent; cursor:pointer; color:var(--muted); font-size:18px; }
  .bc-search { width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: 11px 13px; font-family: inherit; font-size: 13px; margin-bottom: 16px; background: #f7f8fa; }
  .bc-search:focus { outline: 2px solid var(--accent-soft); border-color: var(--accent); }

  .bc-tpl-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
  #bc-shape-grid { grid-template-columns: repeat(4, 1fr); gap: 8px; }
  #bc-shape-grid .bc-tpl { aspect-ratio: 1; border-radius: 8px; padding: 4px; }
  #bc-shape-grid .bc-tpl svg { width: 100%; height: 100%; }
  #bc-shape-grid .fontgroup-label { grid-column: 1 / -1; }
  .bc-gfx-search { position: relative; display:flex; align-items:center; margin-top:12px; }
  .bc-gfx-search svg { position:absolute; left:13px; top:50%; transform:translateY(-50%); pointer-events:none; }
  .bc-gfx-search input { width:100%; box-sizing:border-box; padding:11px 38px 11px 40px; border:1px solid var(--line); border-radius:10px; font-size:14px; color:#16181d; outline:none; background:#fff; }
  .bc-gfx-search input:focus { border-color: var(--accent); }
  #bc-gfx-search-clear { position:absolute; right:8px; top:50%; transform:translateY(-50%); border:none; background:none; font-size:20px; line-height:1; color:#8a909c; cursor:pointer; padding:4px 8px; display:none; }
  #bc-gfx-search-clear.show { display:block; }
  .bc-tpl.bc-gfx-hidden, .fontgroup-label.bc-gfx-hidden { display:none !important; }
  .bc-tpl.bc-gfx-collapsed, .fontgroup-label.bc-gfx-collapsed { display:none !important; }
  #bc-gfx-viewmore { grid-column:1 / -1; margin-top:6px; padding:11px 0; border:1px solid var(--line); border-radius:10px; background:#fff; color:#16181d; font-size:14px; font-weight:600; cursor:pointer; }
  #bc-gfx-viewmore:hover { background:#f3f4f7; }
  .bc-gfx-viewmore-grp { grid-column:1 / -1; margin:2px 0 10px; padding:9px 0; border:1px solid var(--line); border-radius:10px; background:#fff; color:#16181d; font-size:13px; font-weight:600; cursor:pointer; }
  .bc-gfx-viewmore-grp:hover { background:#f3f4f7; }
  .bc-tpl { aspect-ratio: 7/4; border-radius: 9px; cursor: pointer; border: 1px solid var(--line); overflow: hidden; background: #fff; transition: transform .12s, box-shadow .12s; }
  body.bcd-square .bc-panel-view[data-view="templates"] .bc-tpl { aspect-ratio: 1; }
  .bc-tpl:hover { transform: translateY(-2px); box-shadow: var(--shadow); border-color: var(--accent); }
  .bc-tpl svg { width: 100%; height: 100%; display: block; }

  .bc-text-btn { width: 100%; text-align: left; border: 1px solid var(--line); background: #fff; border-radius: 10px; padding: 15px 22px !important; cursor: pointer; margin-bottom: 16px !important; transition: all .12s; color: var(--ink); }
  .bc-text-btn:hover { border-color: var(--accent); background: var(--accent-soft); }
  .bc-text-btn.h1 { font-size: 23px; font-weight: 700; }
  .bc-text-btn.h2 { font-size: 16px; font-weight: 600; }
  .bc-text-btn.h3 { font-size: 13px; font-weight: 400; color: var(--muted); }

  .bc-upload-zone { border: 2px dashed #cfd3da; border-radius: 12px; padding: 32px 16px; text-align: center; cursor: pointer; transition: all .15s; background: #fafbfc; }
  .bc-upload-zone:hover { border-color: var(--accent); background: var(--accent-soft); }
  .bc-upload-zone svg { width: 34px; height: 34px; color: var(--accent); margin-bottom: 8px; }
  .bc-upload-zone p { font-size: 13px; color: var(--muted); font-weight: 500; }
  .bc-uploads-list { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 16px; }
  .bc-uploads-list img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 8px; cursor: pointer; border: 1px solid var(--line); }

  .bc-cp-area { width: 100%; height: 150px; border-radius: 10px; position: relative; cursor: crosshair; margin-bottom: 12px; border:1px solid rgba(0,0,0,.06); }
  .bc-cp-handle { position:absolute; width:16px; height:16px; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px rgba(0,0,0,.25); transform:translate(-50%,-50%); pointer-events:none; }
  .bc-hue { width:100%; height:14px; border-radius:8px; margin-bottom:14px; cursor:pointer; position:relative; background: linear-gradient(90deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00); }
  .bc-hue-handle { position:absolute; top:50%; width:16px; height:16px; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px rgba(0,0,0,.3); transform:translate(-50%,-50%); pointer-events:none; }
  .bc-hex-row { display:flex; align-items:center; gap:8px; margin-bottom:18px; }
  .bc-hex-row input { flex:1; border:1px solid var(--line); border-radius:9px; padding:10px 12px; font-family:inherit; font-size:13px; text-transform:uppercase; }
  .bc-eyedrop, .bc-nofill { width:38px; height:38px; border:1px solid var(--line); border-radius:9px; background:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; }
  .bc-nofill { position:relative; }
  .bc-nofill::after { content:''; position:absolute; inset:8px; border-bottom:2px solid #d33; transform:rotate(45deg); }
  .bc-cp-tabs { display:flex; gap:18px; border-bottom:1px solid var(--line); margin-bottom:16px; }
  .bc-cp-tab { padding:8px 0; font-size:13px; font-weight:600; color:var(--muted); cursor:pointer; border-bottom:2px solid transparent; }
  .bc-cp-tab.active { color:var(--ink); border-bottom-color:var(--accent); }
  .bc-cmyk-row { display:flex; align-items:center; gap:12px; margin-bottom:22px; }
  .bc-cmyk-label { font-size:13px; font-weight:700; color:var(--ink); width:14px; flex:0 0 auto; }
  .bc-cmyk-val { font-size:13px; font-weight:600; color:var(--muted); width:42px; text-align:right; flex:0 0 auto; }
  .bc-cmyk-range { flex:1; -webkit-appearance:none; appearance:none; height:6px; border-radius:6px; outline:none; cursor:pointer; }
  .bc-cmyk-range::-webkit-slider-thumb { -webkit-appearance:none; appearance:none; width:22px; height:22px; border-radius:50%; background:#1a1a1a; border:2px solid #fff; box-shadow:0 1px 4px rgba(0,0,0,.3); cursor:pointer; }
  .bc-cmyk-range::-moz-range-thumb { width:22px; height:22px; border-radius:50%; background:#1a1a1a; border:2px solid #fff; box-shadow:0 1px 4px rgba(0,0,0,.3); cursor:pointer; }
  #bc-cmyk-c { background:linear-gradient(90deg,#fff,#00b8d4); }
  #bc-cmyk-m { background:linear-gradient(90deg,#fff,#e6007e); }
  #bc-cmyk-y { background:linear-gradient(90deg,#fff,#ffe600); }
  #bc-cmyk-k { background:linear-gradient(90deg,#fff,#1a1a1a); }
  .bc-color-section-label { font-size:13px; font-weight:600; color:var(--muted); margin:6px 0 10px; }
  .bc-swatches { display: grid; grid-template-columns: repeat(6, 1fr); gap: 11px; margin-bottom:18px; }
  .bc-swatch { aspect-ratio: 1; border-radius: 50%; cursor: pointer; border: 1px solid rgba(0,0,0,.08); transition: transform .1s; }
  .bc-swatch:hover { transform: scale(1.12); }

  #bc-stage { position: relative; display: flex; flex-direction: column; overflow: hidden; }
  #bc-addcart { background:var(--accent); color:#fff; border:0; border-radius:10px; padding:11px 28px; font-family:inherit; font-size:14px; font-weight:700; cursor:pointer; box-shadow:var(--shadow-sm); transition:background .12s; }
  #bc-addcart:hover { background:#2f5cc0; }
  #bc-addcart:disabled { opacity:.6; cursor:wait; }
  #bc-download-pdf { background:#fff; color:var(--ink); border:1px solid var(--line); border-radius:10px; padding:11px 18px; font-family:inherit; font-size:14px; font-weight:600; cursor:pointer; transition:background .12s; }
  #bc-download-pdf:hover { background:#f3f4f7; }
  .bc-bottom-actions { display:flex; align-items:center; gap:10px; position:absolute; right:18px; }
  #bc-download-pdf:hover { background:#2f5cc0; }
  #bc-download-pdf:disabled { opacity:.6; cursor:wait; }
  #bc-text-toolbar { position:absolute; top:16px; left:50%; transform:translateX(-50%); background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow); display:none; align-items:center; gap:4px; padding:9px 12px; z-index:12; flex-wrap:nowrap; }
  #bc-text-toolbar .tbtn { width:38px; height:38px; border:0; background:#fff; border-radius:9px; cursor:pointer; display:flex; align-items:center; justify-content:center; flex-direction:column; color:var(--ink); flex:0 0 auto; }
  #bc-text-toolbar #bc-size-dn, #bc-text-toolbar #bc-size-up { font-size:24px; font-weight:500; line-height:1; }
  #bc-text-toolbar.show { display:flex; }
  #bc-text-toolbar .sizebox { border:1px solid var(--line); border-radius:9px; padding:0 28px 0 12px !important; margin:0 8px; font-family:inherit; font-size:14px; font-weight:600; line-height:38px; color:var(--ink); background:#fff; cursor:pointer; height:38px; min-width:62px; box-sizing:border-box; text-align:left;
    background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238a909c' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat; background-position:right 10px center; }
  .sizepicker { position:relative; flex:0 0 auto; }
  .sizepanel { position:absolute; top:46px; left:0; width:96px; max-height:280px; overflow-y:auto; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); z-index:18; display:none; padding:6px; }
  .sizepanel.show { display:block; }
  .sizeitem { padding:10px 14px; border-radius:8px; cursor:pointer; font-size:16px; font-weight:600; color:var(--ink); text-align:center; }
  .sizeitem:hover { background:var(--accent-soft); }
  .sizeitem.sel { background:var(--accent-soft); color:var(--accent); }
  .bc-tb-row1, .bc-tb-row2 { display:contents; }
  #bc-text-toolbar .fontbox { border:1px solid var(--line); border-radius:8px; padding:8px 12px; font-family:inherit; font-size:13px; font-weight:500; min-width:130px; background:#fff; cursor:pointer; }
  .fontpicker { position:relative; flex:0 0 auto; margin-right:6px; }
  #bc-font-btn { display:flex; align-items:center; justify-content:flex-start; min-width:150px; height:38px; padding:8px 14px; }
  .fontpanel { position:absolute; top:44px; left:0; width:280px; max-height:420px; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); z-index:16; display:none; flex-direction:column; overflow:hidden; }
  .fontpanel.show { display:flex; }
  .fontsearch { margin:12px 12px 8px; padding:9px 12px; border:1px solid var(--line); border-radius:9px; font-family:inherit; font-size:13px; }
  .fontsearch:focus { outline:2px solid var(--accent-soft); border-color:var(--accent); }
  .fontlist { overflow-y:auto; padding:4px 6px 10px; }
  .fontgroup-label { font-size:13px !important; font-weight:700; color:var(--accent); text-transform:uppercase; letter-spacing:.5px; padding:14px 12px 6px 14px !important; }
  .fontitem { display:flex; align-items:center; justify-content:space-between; padding:13px 12px !important; margin-bottom:3px !important; border-radius:8px; cursor:pointer; font-size:19px; line-height:1.3; color:var(--ink); }
  .fontitem:hover { background:var(--accent-soft); }
  .fontitem.sel { background:var(--accent-soft); color:var(--accent); }
  .fontitem .check { font-size:14px; color:var(--accent); }
  #bc-text-toolbar .stepper { display:flex; align-items:center; border:1px solid var(--line); border-radius:8px; overflow:hidden; }
  #bc-text-toolbar .stepper button { border:0; background:#fff; width:30px; height:34px; cursor:pointer; font-size:16px; color:var(--ink); }
  #bc-text-toolbar .stepper button:hover { background:#f3f4f7; }
  #bc-text-toolbar .stepper input { width:42px; height:34px; border:0; border-left:1px solid var(--line); border-right:1px solid var(--line); text-align:center; font-family:inherit; font-size:13px; font-weight:600; }
  #bc-text-toolbar .tbtn:hover { background:#f3f4f7; }
  #bc-text-toolbar .tbtn.on { background:var(--accent-soft); color:var(--accent); }
  #bc-text-toolbar .tbtn svg { width:22px; height:22px; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; shape-rendering:geometricPrecision; }
  #bc-text-toolbar .tbtn[data-tip], #bc-text-toolbar .txt[data-tip] { position:relative; }
  #bc-text-toolbar [data-tip]::after { content:attr(data-tip); position:absolute; top:calc(100% + 8px); left:50%; transform:translateX(-50%); background:#2b2f38; color:#fff; font-size:12px; font-weight:600; padding:6px 10px; border-radius:7px; white-space:nowrap; opacity:0; pointer-events:none; transition:opacity .12s; z-index:20; }
  #bc-text-toolbar [data-tip]:hover::after { opacity:1; }
  #bc-text-toolbar .colordot { width:24px; height:24px; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px var(--line); cursor:pointer; }
  #bc-text-toolbar .txt { border:0; background:#fff; border-radius:8px; cursor:pointer; font-family:inherit; font-size:13px; font-weight:600; padding:0 12px; height:38px; line-height:38px; color:var(--ink); display:flex; align-items:center; }
  #bc-text-toolbar .txt:hover { background:#f3f4f7; }
  #bc-text-toolbar .sep { width:1px; height:22px; background:var(--line); margin:0 5px; flex:0 0 auto; }
  .bc-popover { position:absolute; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); padding:14px 16px; z-index:14; display:none; }
  .bc-popover.show { display:block; }
  .bc-pop-align { display:flex; gap:6px; padding:8px; }
  .bc-pop-align button { width:42px; height:42px; border:1px solid var(--line); background:#fff; border-radius:9px; cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--ink); }
  .bc-pop-align button:hover { background:#f3f4f7; }
  .bc-pop-align button.on { background:var(--accent-soft); border-color:var(--accent); color:var(--accent); }
  .bc-pop-align button svg { width:20px; height:20px; stroke-width:1.8; }
  .bc-pop-spacing { width:280px; }
  .bc-pop-row { margin-bottom:16px; }
  .bc-pop-row:last-child { margin-bottom:0; }
  .bc-pop-row label { display:block; font-size:13px; font-weight:600; color:var(--ink); margin-bottom:8px; }
  .bc-pop-slider-line { display:flex; align-items:center; gap:10px; }
  .bc-pop-slider-line input[type=range] { flex:1; accent-color:var(--accent); }
  .bc-pop-val { width:54px; border:1px solid var(--line); border-radius:7px; padding:6px 8px; font-family:inherit; font-size:13px; text-align:center; }
  .bc-pop-reset { border:0; background:transparent; cursor:pointer; color:var(--muted); font-size:15px; }
  .bc-posbtn { width:100%; box-sizing:border-box; border:1px solid var(--line); background:#fff; border-radius:9px; padding:12px 14px; cursor:pointer; font-family:inherit; font-size:13px; font-weight:600; color:var(--ink); text-align:center; transition:all .12s; }
  .bc-posbtn:hover { border-color:var(--accent); background:var(--accent-soft); color:var(--accent); }
  #bc-hidden-color, #bc-hidden-fill { position:absolute; width:0; height:0; opacity:0; }

  #bc-stage-scroll { flex: 1; display: flex; align-items: center; justify-content: center; overflow: auto; padding: 60px 40px 40px; }
  #bc-canvas-host { position: relative; }
  .bc-legend { position: absolute; top: -44px; right: 0; display: flex; gap: 10px; z-index: 5; }
  .bc-legend button { border: 1px solid var(--line); background: #fff; cursor: pointer; font-family: inherit; font-size: 11px; font-weight: 600; padding: 6px 16px !important; border-radius: 20px; display: flex; align-items: center; gap: 8px; color: var(--ink); transition: all .12s; white-space: nowrap; }
  .bc-legend button .dot { width: 9px; height: 9px; border-radius: 50%; }
  .bc-legend button.off { opacity: .4; }
  .bc-legend .dot.safety { background: var(--safety); }
  .bc-legend .dot.bleed { background: var(--bleed); }
  .bc-dim { position: absolute; font-size: 11px; color: var(--muted); font-weight: 500; letter-spacing: .3px; }
  /* WIDTH: label above, ruler line below */
  .bc-dim.w { bottom: -36px; left: 0; width: 100%; display:flex; flex-direction:column; align-items:center; gap:5px; }
  .bc-dim-line-h { position:relative; width:100%; height:8px; border-left:1px solid var(--muted); border-right:1px solid var(--muted); }
  .bc-dim-line-h::before { content:''; position:absolute; top:50%; left:0; width:100%; height:1px; background:var(--muted); }
  /* HEIGHT: label left, ruler line right */
  .bc-dim.h { left: -42px; top: 0; height: 100%; display:flex; flex-direction:row; align-items:center; gap:5px; }
  .bc-dim.h .bc-dim-label { transform: rotate(-90deg); white-space:nowrap; }
  .bc-dim-line-v { position:relative; width:8px; height:100%; border-top:1px solid var(--muted); border-bottom:1px solid var(--muted); }
  .bc-dim-line-v::before { content:''; position:absolute; left:50%; top:0; height:100%; width:1px; background:var(--muted); }
  .bc-dim-line-h, .bc-dim-line-v { opacity:.6; }
  .bc-dim-mobile { display:none; position:absolute; top:-40px; left:2px; height:30px; line-height:30px; text-align:left; font-size:12px; font-weight:600; color:var(--muted); letter-spacing:.3px; }

  #bc-obj-toolbar { position:absolute; top:16px; left:20px; background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:none; padding:5px; gap:2px; display:none; align-items:center; z-index:8; }
  #bc-obj-toolbar.show { display:flex; }
  #bc-obj-toolbar button { width:32px; height:32px; border:0; background:#fff; border-radius:7px; cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--ink); }
  #bc-obj-toolbar button:hover { background:#f3f4f7; }
  #bc-obj-toolbar button svg { width:17px; height:17px; stroke-width:1.7; }

  #bc-bottombar { position:relative; height: 60px; border-top: 1px solid var(--line); background: var(--panel); display: flex; align-items: center; justify-content:center; padding: 0 18px; z-index: 10; }
  .bc-zoom { position:relative; display: flex; align-items: center; gap: 8px; background:#fff; border:1px solid var(--line); border-radius:24px; padding:6px 14px; box-shadow:var(--shadow-sm); }
  .bc-zoom button { width: 30px; height: 30px; border: 0; background: transparent; border-radius: 7px; cursor: pointer; font-size: 19px; color: var(--ink); line-height: 1; }
  .bc-zoom button:hover { background:#f3f4f7; }
  .bc-zoom span { font-size: 13px; font-weight: 600; min-width: 48px; text-align: center; color: var(--ink); }
  .bc-zoom .gear { font-size:15px; color:var(--muted); }
  #bc-zoom-label { width:auto !important; min-width:50px; font-size:13px !important; font-weight:600; color:var(--ink); padding:4px 8px !important; border-radius:7px; }
  #bc-zoom-label:hover { background:#f3f4f7; }
  #bc-zoom-slider { -webkit-appearance:none; appearance:none; width:140px; height:6px; border-radius:4px; background:#e3e5ea; outline:none; cursor:pointer; margin:0 4px 0 8px; align-self:center; display:block; }
  .bc-zoom { padding:6px 16px 6px 18px; }  /* overflow:hidden 금지 — 줌 프리셋 메뉴가 잘림 */
  @media (max-width:760px){ #bc-zoom-slider { width:min(140px, 32vw); } }
  #bc-zoom-slider::-webkit-slider-thumb { -webkit-appearance:none; appearance:none; width:18px; height:18px; border-radius:50%; background:#fff; border:1px solid #c8ccd4; box-shadow:0 1px 3px rgba(0,0,0,.18); cursor:pointer; }
  #bc-zoom-slider::-moz-range-thumb { width:18px; height:18px; border-radius:50%; background:#fff; border:1px solid #c8ccd4; box-shadow:0 1px 3px rgba(0,0,0,.18); cursor:pointer; }
  #bc-zoom-slider::-moz-range-track { height:6px; border-radius:4px; background:#e3e5ea; }
  #bc-zoom-menu { position:absolute; bottom:calc(100% + 10px); left:140px; min-width:150px; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:0 8px 28px rgba(0,0,0,.16); padding:6px; display:none; flex-direction:column; z-index:30; }
  #bc-zoom-menu.open { display:flex; }
  #bc-zoom-menu button { width:100% !important; height:auto !important; text-align:left; font-size:14px !important; font-weight:500; color:var(--ink); padding:9px 14px !important; border-radius:8px; display:flex; align-items:center; justify-content:space-between; }
  #bc-zoom-menu button:hover { background:#f3f4f7; }
  #bc-zoom-menu button.active::after { content:'\2713'; color:var(--ink); font-size:13px; }
  .bc-zoom-menu-sep { height:1px; background:var(--line); margin:5px 4px; }

  #bc-faces { position:relative; background: var(--panel); border-top: 1px solid var(--line); display:flex; flex-direction:row; align-items:center; justify-content:center; padding: 12px 18px; gap: 8px; }
  #bc-faces .bc-faces-toggle { display:flex; flex-direction:row; align-items:center; gap:10px; }
  .bc-face-thumb { width: 72px; cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:6px; }
  .bc-face-card { width: 72px; height: 41px; border:2px solid var(--line); border-radius:6px; background:#fff; box-shadow:var(--shadow-sm); transition:border-color .12s; overflow:hidden; background-size:cover; background-position:center; }
  body.bcd-square .bc-face-card { width: 56px; height: 56px; }  /* square BC: 정사각 썸네일 */
  .bc-face-thumb.active .bc-face-card { border-color: var(--accent); }
  .bc-face-thumb span { font-size:11px; font-weight:600; color:var(--muted); }
  .bc-face-thumb.active span { color: var(--accent); }

  /* ===== Template Gallery overlay (Moo-style, v4) ===== */
  #bcg-overlay { position: fixed; inset: 0; z-index: 999998; background: #fff; display: none; overflow-y: auto; font-family: 'Poppins', system-ui, sans-serif; color: #16181d; -webkit-font-smoothing: antialiased; }
  #bcg-overlay.bcg-open { display: block; }
  #bcg-overlay * { box-sizing: border-box; }
  #bcg-overlay .bcg-topbar { position: sticky; top: 0; z-index: 10; background: #fff; border-bottom: 1px solid #e8eaed; padding: 14px 28px; display: flex; align-items: center; gap: 14px; }
  #bcg-overlay .bcg-back { width: 38px; height: 38px; border: 1px solid #d8dadf; border-radius: 50%; background: #fff; cursor: pointer; font-size: 18px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; color:#16181d; padding:0; }
  #bcg-overlay .bcg-back:hover { background: #f4f5f7; }
  #bcg-overlay .bcg-title { font-size: 20px; font-weight: 600; color:#16181d; letter-spacing:-.2px; }
  #bcg-overlay .bcg-count { margin-left: auto; font-family: 'Roboto Condensed', 'Poppins', sans-serif; font-size: 14px; font-weight: 600; letter-spacing: .4px; text-transform: uppercase; color: #5a6473; white-space: nowrap; }
  #bcg-overlay .bcg-body { display: flex; gap: 0; align-items: flex-start; padding: 0 28px; }
  #bcg-overlay .bcg-main { flex: 1; min-width: 0; }
  #bcg-overlay .bcg-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; padding: 24px 0 60px; }
  @media (min-width: 760px) { #bcg-overlay .bcg-grid { grid-template-columns: repeat(3, 1fr); } }
  @media (min-width: 1100px) { #bcg-overlay .bcg-grid { grid-template-columns: repeat(4, 1fr); } }
  #bcg-overlay .bcg-card { background: #fff; border: 1px solid #e8eaed; border-radius: 12px; overflow: hidden; cursor: pointer; display: flex; flex-direction: column; transition: box-shadow .15s, transform .15s, border-color .15s; }
  #bcg-overlay .bcg-card:hover { box-shadow: 0 8px 24px rgba(16,24,40,.10); transform: translateY(-2px); border-color: #d8dadf; }
  /* 3D stacked-card mockup (front canvas + tinted back card) */
  #bcg-overlay .bcg-mock { position: relative; aspect-ratio: 4/3; background: #f1f2f4; display: flex; align-items: center; justify-content: center; overflow: hidden; }
  #bcg-overlay .bcg-stack { position: relative; width: 64%; transform: rotate(-8deg) translate(2%, 4%); transition: transform .25s ease; }
  #bcg-overlay .bcg-card:hover .bcg-stack { transform: rotate(-8deg) translate(2%, 1%) scale(1.03); }
  #bcg-overlay .bcg-stack-portrait { width: 38%; transform: rotate(-8deg) translate(4%, 2%); }
  #bcg-overlay .bcg-card:hover .bcg-stack-portrait { transform: rotate(-8deg) translate(4%, 0) scale(1.03); }
  #bcg-overlay .bcg-stack-square { width: 50%; }
  #bcg-overlay .bcg-stack-back { position: absolute; inset: 0; border-radius: 5px; transform: translate(16%, -18%) rotate(10deg); box-shadow: 0 6px 18px rgba(16,24,40,.14); background: #fff; }
  #bcg-overlay .bcg-thumb { position: relative; width: 100%; background: #fff; display: block; overflow: hidden; font-size: 0; border-radius: 5px; box-shadow: 0 12px 26px rgba(16,24,40,.22); }
  #bcg-overlay .bcg-thumb canvas { width: 100% !important; height: auto !important; display: block; }
  #bcg-overlay .bcg-rounded .bcg-thumb, #bcg-overlay .bcg-rounded .bcg-stack-back { border-radius: 9px; }
  #bcg-overlay .bcg-foot { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 8px; }
  #bcg-overlay .bcg-foot-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
  #bcg-overlay .bcg-name { font-size: 14px; font-weight: 600; color:#16181d; line-height: 1.3; }
  #bcg-overlay .bcg-info { position: relative; width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid #b8bcc4; color: #5a6473; background: #fff; font-size: 12px; font-weight: 700; line-height: 1; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; cursor: help; padding: 0; font-family: 'Poppins', sans-serif; box-shadow: none; }
  #bcg-overlay .bcg-info:hover { border-color: #3ba9d8; color: #3ba9d8; }
  #bcg-overlay .bcg-info .bcg-tip { display: none; position: absolute; right: 0; bottom: calc(100% + 8px); width: 220px; background: #16181d; color: #fff; font-size: 12px; font-weight: 400; line-height: 1.45; padding: 10px 12px; border-radius: 8px; text-align: left; z-index: 5; pointer-events: none; }
  #bcg-overlay .bcg-info:hover .bcg-tip, #bcg-overlay .bcg-info:focus .bcg-tip { display: block; }
  #bcg-overlay .bcg-colorways { display: flex; gap: 6px; flex-wrap: wrap; }
  #bcg-overlay .bcg-swatch { width: 18px; height: 18px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px #d0d3d9; cursor: pointer; padding: 0; transition: box-shadow .12s; }
  #bcg-overlay .bcg-swatch:hover { box-shadow: 0 0 0 1px #8a909c; }
  #bcg-overlay .bcg-swatch-sel { box-shadow: 0 0 0 2px #3ba9d8; }
  /* Lead cards: upload a full design / start blank */
  #bcg-overlay .bcg-lead { background: #fff; border: 1.5px dashed #c9cdd3; align-items: flex-start; justify-content: flex-start; text-align: left; padding: 26px 22px 22px; min-height: 200px; }
  #bcg-overlay .bcg-lead:hover { border-color: #3ba9d8; border-style: solid; }
  #bcg-overlay .bcg-lead-icon { width: 44px; height: 44px; border-radius: 50%; background: #e6f4fb; color: #3ba9d8; display: flex; align-items: center; justify-content: center; margin-bottom: 14px; }
  #bcg-overlay .bcg-lead-icon svg { width: 22px; height: 22px; }
  #bcg-overlay .bcg-lead-title { font-size: 17px; font-weight: 600; color:#16181d; line-height: 1.25; margin-bottom: 6px; }
  #bcg-overlay .bcg-lead-sub { font-size: 13.5px; color: #5a6473; line-height: 1.45; margin: 0 0 12px; }
  #bcg-overlay .bcg-lead-badges { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
  #bcg-overlay .bcg-lead-badges span { font-family: 'Roboto Condensed', 'Poppins', sans-serif; font-size: 11.5px; font-weight: 700; letter-spacing: .5px; color: #5a6473; background: #f1f2f4; border-radius: 4px; padding: 3px 7px; }
  #bcg-overlay .bcg-lead-link { font-size: 13px; color: #3ba9d8; text-decoration: underline; cursor: pointer; background: none; border: 0; padding: 0; font-family: inherit; margin-bottom: 14px; display: inline-block; box-shadow: none; }
  #bcg-overlay .bcg-lead-cta { margin-top: auto; background: none; border: 0; padding: 0; font-family: inherit; font-size: 14px; font-weight: 600; color: #16181d; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; box-shadow: none; }
  #bcg-overlay .bcg-lead-cta:after { content: '\203A'; font-size: 20px; line-height: 1; color: #3ba9d8; transition: transform .15s; }
  #bcg-overlay .bcg-lead:hover .bcg-lead-cta:after { transform: translateX(3px); }
  /* Filter sidebar */
  #bcg-overlay .bcg-filters { width: 240px; flex: 0 0 240px; padding: 18px 28px 40px 0; }
  #bcg-overlay .bcg-filter-group { border-bottom: 1px solid #e8eaed; }
  #bcg-overlay .bcg-filter-head { width: 100%; background: none; border: 0; padding: 16px 0; font-family: 'Roboto Condensed', 'Poppins', sans-serif; font-size: 14px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; color: #16181d; cursor: pointer; display: flex; justify-content: space-between; align-items: center; box-shadow: none; }
  #bcg-overlay .bcg-chev { color: #8a909c; font-size: 11px; transition: transform .15s; }
  #bcg-overlay .bcg-filter-group.collapsed .bcg-chev { transform: rotate(-90deg); }
  #bcg-overlay .bcg-filter-opts { padding-bottom: 16px; display: flex; flex-direction: column; gap: 2px; }
  #bcg-overlay .bcg-filter-group.collapsed .bcg-filter-opts { display: none; }
  #bcg-overlay .bcg-opt { display: flex; align-items: center; gap: 10px; font-size: 13.5px; color: #3c4453; cursor: pointer; padding: 6px 0; line-height: 1.3; transition: color .12s; user-select: none; }
  #bcg-overlay .bcg-opt:before { content: ''; width: 16px; height: 16px; border-radius: 4px; border: 1.5px solid #b8bcc4; background: #fff; flex: 0 0 auto; transition: all .12s; }
  #bcg-overlay .bcg-opt:hover { color: #16181d; }
  #bcg-overlay .bcg-opt:hover:before { border-color: #3ba9d8; }
  #bcg-overlay .bcg-opt.bcg-opt-sel { color: #16181d; font-weight: 600; }
  #bcg-overlay .bcg-opt.bcg-opt-sel:before { background: #3ba9d8 url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path d='M2.5 6.5l2.5 2.5 4.5-5.5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/10px 10px no-repeat; border-color: #3ba9d8; }
  #bcg-overlay .bcg-opt-radio:before { border-radius: 50%; }
  #bcg-overlay .bcg-opt-radio.bcg-opt-sel:before { background: #fff; border: 5px solid #3ba9d8; }
  #bcg-overlay .bcg-opt-l { flex: 1; min-width: 0; }
  #bcg-overlay .bcg-opt-n { color: #8a909c; font-size: 12.5px; font-weight: 400; }
  #bcg-overlay .bcg-opt-static { cursor: default; color: #16181d; font-weight: 600; }
  #bcg-overlay .bcg-opt-static:before { display: none; }
  #bcg-overlay .bcg-filter-note { font-size: 12.5px; color: #8a909c; line-height: 1.45; padding: 2px 0 6px; }
  #bcg-overlay .bcg-filter-clear { margin-top: 16px; background: none; border: 0; color: #3ba9d8; font-size: 13px; font-weight: 600; cursor: pointer; padding: 6px 0; font-family: inherit; box-shadow: none; }
  #bcg-overlay .bcg-show-more { background: none; border: 0; color: #3ba9d8; font-size: 13px; font-weight: 600; cursor: pointer; padding: 10px 0 2px; text-align: left; font-family: inherit; box-shadow: none; }
  #bcg-overlay .bcg-more-wrap { flex-direction: column; gap: 2px; }
  #bcg-overlay .bcg-color-pal { display: flex; flex-wrap: wrap; gap: 10px; padding: 6px 0; }
  #bcg-overlay .bcg-color-dot { width: 26px; height: 26px; border-radius: 50%; border: 0; cursor: pointer; padding: 0; position: relative; transition: box-shadow .12s; box-shadow: none; }
  #bcg-overlay .bcg-color-dot:hover { box-shadow: 0 0 0 2px #b8bcc4; }
  #bcg-overlay .bcg-color-dot.bcg-color-sel { box-shadow: 0 0 0 2px #fff, 0 0 0 4px #3ba9d8; }
  #bcg-overlay .bcg-color-dot.bcg-color-sel::after { content:'\2713'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff; font-size:13px; text-shadow:0 0 2px rgba(0,0,0,.6); }
  #bcg-overlay .bcg-filter-toggle { display: none; }
  #bcg-overlay .bcg-empty { grid-column: 1 / -1; text-align: center; color: #8a909c; padding: 40px 0; font-size: 14px; }
  @media (max-width: 760px) {
    #bcg-overlay .bcg-topbar { padding: 12px 16px; }
    #bcg-overlay .bcg-title { font-size: 16px; }
    #bcg-overlay .bcg-count { font-size: 12px; }
    #bcg-overlay .bcg-body { flex-direction: column; padding: 0 16px; }
    #bcg-overlay .bcg-filter-toggle { display: inline-block; width:auto; margin: 12px 16px 0; padding: 10px 16px; background: #fff; border: 1px solid #d8dadf; border-radius: 8px; font-size: 14px; font-weight: 600; font-family: inherit; cursor: pointer; box-shadow: none; }
    #bcg-overlay .bcg-filters { width: 100%; flex: none; display: none; border-bottom: 1px solid #e8eaed; padding: 0 0 16px; }
    #bcg-overlay .bcg-filters.bcg-filters-open { display: block; }
    #bcg-overlay .bcg-grid { gap: 12px; padding: 16px 0 40px; }
    #bcg-overlay .bcg-lead { padding: 18px 16px; min-height: 0; }
    #bcg-overlay .bcg-lead-title { font-size: 15px; }
    /* Center the Safety/Bleed legend on narrow screens so it clears the X. */
    #bcd-overlay .bc-legend { right:auto; left:50%; transform:translateX(-50%); }
  }
  /* ===== Proof / Review overlay ===== */
  /* ===== Login gate modal ===== */
  #bc-loginmodal { position:fixed; inset:0; z-index:1000003; background:rgba(16,24,40,.45); display:none; align-items:center; justify-content:center; padding:20px; }
  #bc-loginmodal.show { display:flex; }
  #bc-loginmodal .bc-lm-card { position:relative; background:#fff; border-radius:16px; box-shadow:0 20px 60px rgba(16,24,40,.3); width:100%; max-width:440px; padding:40px 36px 32px; text-align:center; }
  #bc-loginmodal h2 { font-size:26px; font-weight:700; letter-spacing:-.4px; color:#16181d; margin-bottom:12px; }
  #bc-loginmodal p { font-size:15px; color:#5a6473; margin-bottom:26px; line-height:1.5; }
  #bc-loginmodal .bc-lm-signin { width:100%; background:var(--accent); color:#fff; border:0; border-radius:10px; padding:15px; font-family:inherit; font-size:16px; font-weight:700; cursor:pointer; margin-bottom:12px; transition:background .12s; }
  #bc-loginmodal .bc-lm-signin:hover { background:#2f5cc0; }
  #bc-loginmodal .bc-lm-guest { width:100%; background:#fff; color:#16181d; border:1px solid var(--line); border-radius:10px; padding:14px; font-family:inherit; font-size:15px; font-weight:600; cursor:pointer; transition:background .12s; }
  #bc-loginmodal .bc-lm-guest:hover { background:#f4f5f7; }
  #bc-loginmodal #bc-lm-x { position:absolute; top:14px; right:16px; width:34px; height:34px; border:0; background:#f0f1f4; border-radius:50%; font-size:20px; line-height:1; color:#5a6473; cursor:pointer; }
  #bc-proof { position:fixed; inset:0; z-index:1000002; background:#fff; display:none; }
  #bc-proof.show { display:flex; }
  #bc-proof .bc-proof-left { flex:1; background:#eef0f3; display:flex; flex-direction:column; align-items:center; justify-content:center; position:relative; padding:40px; }
  #bc-proof .bc-proof-hint { position:absolute; top:40px; left:50%; transform:translateX(-50%); font-size:13px; color:#8a909c; }
  #bc-proof .bc-proof-card-wrap { width:min(560px,80%); }
  #bc-proof #bc-proof-img { width:100%; border-radius:6px; box-shadow:0 8px 40px rgba(16,24,40,.16); background:#fff; display:block; }
  /* Portrait proof: size by height so the tall card fits the viewport. */
  #bc-proof .bc-proof-card-wrap.bc-proof-portrait { width:auto; height:min(72vh,760px); display:flex; align-items:center; justify-content:center; }
  #bc-proof .bc-proof-card-wrap.bc-proof-portrait #bc-proof-img { width:auto; height:100%; }
  #bc-proof .bc-proof-faces { position:absolute; bottom:44px; left:50%; transform:translateX(-50%); display:flex; border:1px solid #d8dadf; border-radius:10px; overflow:hidden; background:#fff; }
  #bc-proof .bc-proof-face { border:0; background:#fff; padding:10px 22px; font-family:inherit; font-size:14px; font-weight:600; cursor:pointer; color:#5a6473; }
  #bc-proof .bc-proof-face.active { background:#e6f4fb; color:#3ba9d8; }
  #bc-proof .bc-proof-right { width:min(620px,46%); padding:48px 56px; overflow-y:auto; position:relative; display:flex; flex-direction:column; }
  #bc-proof .bc-proof-right h2 { font-size:34px; font-weight:700; letter-spacing:-.5px; margin-bottom:14px; color:#16181d; }
  #bc-proof .bc-proof-sub { font-size:15px; color:#5a6473; margin-bottom:22px; }
  #bc-proof .bc-proof-check { list-style:disc; padding-left:20px; margin-bottom:24px; }
  #bc-proof .bc-proof-check li { font-size:15px; color:#16181d; margin-bottom:10px; }
  #bc-proof .bc-proof-foot { margin-top:auto; padding-top:20px; }
  #bc-proof .bc-proof-approve { display:flex; align-items:center; gap:10px; font-size:15px; color:#16181d; margin-bottom:16px; cursor:pointer; }
  #bc-proof .bc-proof-approve input { width:18px; height:18px; cursor:pointer; accent-color:#3ba9d8; }
  #bc-proof .bc-proof-continue { width:100%; background:#4dbbe8; color:#fff; border:0; border-radius:10px; padding:15px; font-family:inherit; font-size:16px; font-weight:700; cursor:pointer; margin-bottom:12px; transition:opacity .12s,background .12s; }
  #bc-proof .bc-proof-continue:disabled { opacity:.45; cursor:not-allowed; }
  #bc-proof .bc-proof-continue:not(:disabled):hover { background:#3aa9d6; }
  #bc-proof .bc-proof-edit { width:100%; background:#fff; color:#16181d; border:1px solid #d8dadf; border-radius:10px; padding:14px; font-family:inherit; font-size:15px; font-weight:600; cursor:pointer; }
  #bc-proof .bc-proof-edit:hover { background:#f4f5f7; }
  #bc-proof #bc-proof-x { position:absolute; top:24px; right:32px; width:44px; height:44px; border-radius:12px; border:1px solid #3ba9d8; background:#fff; color:#16181d; font-size:24px; line-height:1; cursor:pointer; }
  #bc-proof #bc-proof-close { display:none; }
  @media (max-width:900px){ #bc-proof.show{ flex-direction:column; } #bc-proof .bc-proof-right{ width:100%; padding:28px 24px; } #bc-proof .bc-proof-left{ min-height:48vh; padding-bottom:64px; } #bc-proof .bc-proof-card-wrap.bc-proof-portrait{ height:38vh; } #bc-proof .bc-proof-faces{ bottom:14px; } }

  /* ===== Options step (Uni CPO product form hosted in a modal) ===== */
  #bc-options { position:fixed; inset:0; z-index:1000002; background:#fff; display:none; }
  #bc-options.show { display:flex; }
  #bc-options .bc-opt-left { flex:1; background:#eef0f3; display:flex; flex-direction:column; align-items:center; justify-content:center; position:relative; padding:40px; }
  #bc-options .bc-opt-card-wrap { width:min(480px,80%); }
  #bc-options #bc-opt-img { width:100%; border-radius:6px; box-shadow:0 8px 40px rgba(16,24,40,.16); background:#fff; display:block; }
  /* Portrait options preview: size by height so the tall card fits. */
  #bc-options .bc-opt-card-wrap.bc-opt-portrait { width:auto; height:min(70vh,720px); display:flex; align-items:center; justify-content:center; }
  #bc-options .bc-opt-card-wrap.bc-opt-portrait #bc-opt-img { width:auto; height:100%; }
  #bc-options .bc-opt-faces { position:absolute; bottom:44px; left:50%; transform:translateX(-50%); display:flex; border:1px solid #d8dadf; border-radius:10px; overflow:hidden; background:#fff; }
  #bc-options .bc-opt-face { border:0; background:#fff; padding:10px 22px; font-family:inherit; font-size:14px; font-weight:600; cursor:pointer; color:#5a6473; }
  #bc-options .bc-opt-face.active { background:#e6f4fb; color:#3ba9d8; }
  #bc-options .bc-opt-right { width:min(620px,46%); padding:48px 56px; overflow-y:auto; position:relative; display:flex; flex-direction:column; }
  #bc-options .bc-opt-right h2 { font-size:34px; font-weight:700; letter-spacing:-.5px; margin-bottom:8px; color:#16181d; }
  #bc-options .bc-opt-sub { font-size:15px; color:#5a6473; margin-bottom:24px; }
  #bc-options #bc-opt-host { flex:1; }
  /* PO-HIDE (2026-10-24): 빈 "Product options" 레일 탭 숨김 — 옵션은 제품 페이지·리뷰 단계에서 선택 */
  #bc-rail .bc-rail-btn[data-tab="product"] { display:none !important; }
  /* Tame the injected product form so it reads as a clean option list.
     These hide elements ONLY inside the options modal (form is restored
     to the page afterwards, so the product page is unaffected).
     NOTE: the Uni CPO live price (Printing Cost / sticky cost) is KEPT. */
  #bc-options #bc-opt-host #bcd-launch,
  #bc-options #bc-opt-host #bcd-upload-btn,
  #bc-options #bc-opt-host .uni-module-file_upload,
  #bc-options #bc-opt-host [class*="file_upload"],
  #bc-options #bc-opt-host input[type=file],
  #bc-options #bc-opt-host .single_add_to_cart_button,
  #bc-options #bc-opt-host button.single_add_to_cart_button,
  #bc-options #bc-opt-host .cart .quantity,
  #bc-options #bc-opt-host .woocommerce-variation-add-to-cart { display:none !important; }
  /* Uni CPO hides the native <select> and renders .custom-uni-dropdown.
     Style THAT widget (the visible one) so text/arrow aren't flush. */
  #bc-options #bc-opt-host .custom-uni-dropdown{
    position:relative; border:1px solid #d8dadf !important; border-radius:8px !important;
    background:#fff; box-sizing:border-box;
  }
  #bc-options #bc-opt-host .custom-uni-selected{
    padding:13px 38px 13px 14px !important; font-size:15px !important; color:#16181d !important;
    line-height:1.2 !important; cursor:pointer; position:relative; white-space:nowrap;
    overflow:hidden; text-overflow:ellipsis;
  }
  /* Custom dropdown arrow */
  #bc-options #bc-opt-host .custom-uni-selected::after{
    content:""; position:absolute; right:14px; top:50%; width:12px; height:8px;
    transform:translateY(-50%);
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%235a6473' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat center;
  }
  #bc-options #bc-opt-host .custom-uni-list{
    margin:0; padding:6px 0; list-style:none; border:1px solid #d8dadf; border-top:0;
    border-radius:0 0 8px 8px; background:#fff; max-height:240px; overflow-y:auto;
    box-shadow:0 8px 24px rgba(16,24,40,.12);
  }
  #bc-options #bc-opt-host .custom-uni-list li{
    padding:11px 14px !important; font-size:15px !important; color:#16181d !important;
    cursor:pointer; line-height:1.2;
  }
  #bc-options #bc-opt-host .custom-uni-list li:hover,
  #bc-options #bc-opt-host .custom-uni-list li.selected{ background:#e6f4fb; color:#3ba9d8; }
  /* The hidden native select needs no styling, but if any theme shows it: */
  #bc-options #bc-opt-host select{ font-size:15px; }
  #bc-options .bc-opt-foot { margin-top:auto; padding-top:20px; border-top:1px solid #eceef1; }
  #bc-options .bc-opt-price { display:flex; align-items:baseline; gap:8px; margin-bottom:16px; }
  #bc-options .bc-opt-price .bc-opt-price-val { font-size:28px; font-weight:700; color:#16181d; }
  #bc-options .bc-opt-price .bc-opt-price-lbl { font-size:14px; color:#8a909c; }
  #bc-options .bc-opt-addcart { width:100%; background:#4dbbe8; color:#fff; border:0; border-radius:10px; padding:15px; font-family:inherit; font-size:16px; font-weight:700; cursor:pointer; margin-bottom:12px; transition:background .12s; }
  #bc-options .bc-opt-addcart:hover { background:#3aa9d6; }
  #bc-options .bc-opt-addcart:disabled { opacity:.5; cursor:not-allowed; }
  #bc-options .bc-opt-back { width:100%; background:#fff; color:#16181d; border:1px solid #d8dadf; border-radius:10px; padding:14px; font-family:inherit; font-size:15px; font-weight:600; cursor:pointer; }
  #bc-options .bc-opt-back:hover { background:#f4f5f7; }
  #bc-options #bc-opt-x { position:absolute; top:24px; right:32px; width:44px; height:44px; border-radius:12px; border:1px solid #3ba9d8; background:#fff; color:#16181d; font-size:24px; line-height:1; cursor:pointer; }
  @media (max-width:900px){ #bc-options.show{ flex-direction:column; } #bc-options .bc-opt-right{ width:100%; padding:28px 24px; } #bc-options .bc-opt-left{ min-height:48vh; padding-bottom:64px; } #bc-options .bc-opt-card-wrap.bc-opt-portrait{ height:40vh; } #bc-options .bc-opt-faces{ bottom:14px; } /* OPT-X-R1 (2026-10-24): 모바일에서 제목과 × 버튼 겹침 */ #bc-options .bc-opt-right h2{ font-size:26px; line-height:1.15; padding-right:60px; } #bc-options #bc-opt-x{ top:22px; right:20px; width:40px; height:40px; font-size:22px; } }

  /* ===== Mobile designer layout (bottom tab bar + slide-up panel) ===== */
  @media (max-width:760px){
    #bc-app { display:flex !important; flex-direction:column; }
    /* canvas takes the space; faces below it; rail becomes bottom tab bar */
    #bc-stage { order:1; flex:1; min-height:0; }
    #bc-stage-scroll { padding:40px 20px 24px !important; }
    /* dimension labels: rulers off, single caption above the card */
    #bc-canvas-host .bc-dim { display:none !important; }
    #bc-canvas-host .bc-dim-mobile { display:block !important; }
    /* text toolbar: pinned above the tab bar, two stacked rows — only when active */
    #bc-text-toolbar { display:none !important; }
    #bc-text-toolbar.show { position:fixed !important; top:auto !important; bottom:58px !important; left:0 !important; right:0 !important; transform:none !important; max-width:none; width:100%; border-radius:0; border-left:0; border-right:0; border-bottom:0; box-shadow:0 -4px 16px rgba(16,24,40,.10); overflow:visible !important; display:flex !important; flex-direction:column !important; align-items:stretch !important; gap:8px; padding:10px 0 !important; z-index:25; }
    #bc-text-toolbar .bc-tb-row1 { display:flex !important; align-items:center; gap:6px; padding:0 12px; flex-wrap:nowrap; }
    #bc-text-toolbar .bc-tb-row2 { display:flex !important; align-items:center; gap:6px; padding:0 12px 2px; flex-wrap:nowrap; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; }
    #bc-text-toolbar .bc-tb-row2::-webkit-scrollbar { height:0; }
    #bc-text-toolbar .bc-tb-row1 > *, #bc-text-toolbar .bc-tb-row2 > * { flex:0 0 auto; }
    /* compact font + size controls on mobile */
    #bc-text-toolbar .fontpicker { flex:1 1 auto; max-width:none; }
    #bc-text-toolbar #bc-font-btn { min-width:0; max-width:none; width:100%; }
    #bc-text-toolbar #bc-font-btn #bc-font-label { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; }
    #bc-text-toolbar .fontbox { min-width:0; }
    #bc-text-toolbar .sizebox { min-width:56px; width:56px; margin:0 4px; }
    #bc-size-panel { position:fixed !important; bottom:148px !important; left:auto !important; right:14px !important; width:120px !important; max-height:46vh; }
    /* toolbar popups become bottom sheets on mobile (they sit at top:64 on desktop) */
    #bc-stage .bc-pop-spacing { position:fixed !important; top:auto !important; bottom:130px !important; left:50% !important; transform:translateX(-50%) !important; width:calc(100vw - 24px) !important; max-width:340px; z-index:27 !important; }
    #bc-effects-pop { position:fixed !important; top:auto !important; bottom:130px !important; left:50% !important; transform:translateX(-50%) !important; z-index:27 !important; }
    /* hide the vertical separators so the two rows read cleanly */
    #bc-text-toolbar .sep, #bc-text-toolbar .bc-sg-sep { display:none !important; }
    /* font panel: fixed sheet so it isn't clipped */
    .fontpanel { position:fixed !important; top:auto !important; bottom:148px !important; left:8px !important; right:8px !important; width:auto !important; max-height:46vh; }
    #bc-faces { padding:10px 14px !important; }
    #bc-app.bc-tb-active #bc-faces { visibility:hidden; }
    #bc-rail { order:3; flex-direction:row !important; justify-content:flex-start; align-items:stretch; padding:0 !important; gap:0 !important; border-right:0 !important; border-top:1px solid var(--line); overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; flex-wrap:nowrap; position:relative; z-index:26; background:var(--panel); }
    .bc-rail-btn { width:auto !important; flex:0 0 auto !important; padding:8px 16px !important; border-radius:0 !important; font-size:11px; gap:4px !important; min-width:72px; }
    .bc-rail-btn svg { width:22px; height:22px; }
    /* panel hidden by default; slides up over the canvas when a tab is tapped */
    #bc-panel { position:fixed !important; left:0; right:0; bottom:0; z-index:30; max-height:62vh; border-right:0 !important; border-top:1px solid var(--line); border-radius:18px 18px 0 0; box-shadow:0 -8px 30px rgba(16,24,40,.18); transform:translateY(110%); transition:transform .25s ease; padding:18px 18px 28px !important; }
    #bc-app.bc-panel-open #bc-panel { transform:translateY(0); }
    /* grabber + close affordance on the mobile sheet */
    #bc-panel::before { content:""; position:absolute; top:8px; left:50%; transform:translateX(-50%); width:42px; height:4px; border-radius:2px; background:#d8dadf; }
    #bc-panel-mclose { display:flex; }
    /* dim backdrop behind the sheet */
    #bc-panel-backdrop { display:none; position:fixed; inset:0; background:rgba(16,24,40,.35); z-index:29; }
    #bc-app.bc-panel-open #bc-panel-backdrop { display:block; }
    /* bottom action bar buttons sizing */
    #bc-topbar { padding:0 14px !important; position:relative; }
    #bc-topbar .bc-tb-history { margin-left:2px; }
    #bc-topbar .bc-tb-divider, #bc-topbar .bc-tb-product { display:none; }
    /* hide zoom controls on mobile */
    #bc-bottombar .bc-zoom { display:none !important; }
    /* the bottom bar collapses; price tag in the top bar acts as Continue */
    #bc-bottombar { display:none !important; }
    /* compact price pill */
    #bc-topbar .bc-tb-price { padding:7px 12px; font-size:15px; }
    /* NEXT-R1 (2026-10-24): 모바일에선 가격 대신 "Next" 버튼 (가격은 다음 단계 제품 페이지에서 표시) */
    #bc-topbar .bc-tb-price { background:#4dbbe8 !important; border-color:#4dbbe8 !important; color:#fff !important; gap:6px; padding:9px 16px !important; box-shadow:0 2px 8px rgba(77,187,232,.35); }
    #bc-topbar .bc-tb-price > svg:first-child, #bc-topbar #bc-tb-price-val, #bc-topbar #bc-tb-price-qty { display:none !important; }
    #bc-topbar .bc-tb-price::before { content:'Next'; font-weight:700; font-size:15px; letter-spacing:.2px; }
  }
  #bc-panel-backdrop { display:none; }
  #bc-panel-mclose { display:none; position:absolute; top:10px; right:14px; width:30px; height:30px; border:0; background:#f0f1f4; border-radius:50%; font-size:18px; line-height:1; color:#5a6473; cursor:pointer; align-items:center; justify-content:center; z-index:2; }
  /* ===== Product page: breathing room above the product title ===== */
  body.single-product .product_title,
  body.single-product h1.product_title,
  body.single-product h1.entry-title,
  body.single-product .summary .product_title { margin-top: 20px !important; }