@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css");
:root { --form-green:#276b50; --form-line:#e5e9e7; --form-muted:#748078; }
* { box-sizing:border-box; }
.product-form-body { margin:0; background:#f3f5f4; color:#202723; font-family:"Pretendard Variable","Pretendard","Apple SD Gothic Neo","Noto Sans KR",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-synthesis:none; }
.product-form-auth { display:grid; place-items:center; min-height:100vh; text-align:center; }
.product-form-auth[hidden] { display:none; }
.product-form-auth p { color:var(--form-muted); }
.product-form-page { width:min(100%,900px); margin:0 auto; padding:0 24px 120px; }
.product-form-page[aria-hidden="true"] { display:none; }
.product-form-header { position:sticky; top:0; z-index:10; display:grid; grid-template-columns:48px 1fr auto; align-items:center; gap:10px; padding:22px 0 18px; background:rgba(243,245,244,.94); backdrop-filter:blur(12px); }
.product-form-header > a { color:#25322c; font-size:36px; line-height:1; }
.product-form-header span { color:#698076; font-size:11px; font-weight:750; }
.product-form-header h1 { margin:3px 0 0; font-size:25px; }
.product-form-header button { padding:9px 13px; border:1px solid #d9dfdc; border-radius:9px; background:#fff; color:#526159; font-weight:700; }
.form-section { margin-bottom:18px; padding:24px; border:1px solid #e7ebe9; border-radius:18px; background:#fff; box-shadow:0 8px 22px rgba(30,52,42,.035); }
.section-heading { display:flex; gap:12px; margin-bottom:22px; }
.section-heading > b { display:grid; place-items:center; width:26px; height:26px; border-radius:50%; background:#e8f1ed; color:var(--form-green); font-size:12px; }
.section-heading h2 { margin:0; font-size:18px; }
.section-heading p { margin:5px 0 0; color:var(--form-muted); font-size:12px; }
.type-selector { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.type-selector input { position:absolute; opacity:0; }
.type-selector span { display:block; min-height:88px; padding:17px; border:1px solid var(--form-line); border-radius:13px; cursor:pointer; }
.type-selector strong,.type-selector small { display:block; }
.type-selector small { margin-top:7px; color:var(--form-muted); font-size:11px; }
.type-selector input:checked + span { border-color:var(--form-green); background:#f2f7f5; box-shadow:inset 0 0 0 1px var(--form-green); }
.field-grid { display:grid; grid-template-columns:1fr 1fr; gap:17px 14px; }
.field-grid label,.editor-field { display:grid; gap:7px; color:#45514b; font-size:12px; font-weight:700; }
.field-grid .wide { grid-column:1/-1; }
input,textarea,select { width:100%; border:1px solid #dfe4e1; border-radius:10px; background:#fbfcfb; padding:12px 13px; color:#1f2723; font:inherit; outline:none; }
input:focus,textarea:focus { border-color:#668678; box-shadow:0 0 0 3px rgba(69,112,92,.09); }
textarea { resize:vertical; line-height:1.55; }
label small { color:#929a96; font-size:10px; font-weight:500; }
.input-suffix { position:relative; }
.input-suffix input { padding-right:38px; }
.input-suffix i { position:absolute; right:13px; top:50%; color:#89928e; font-style:normal; transform:translateY(-50%); }
.switch-field { display:flex !important; grid-template-columns:1fr auto; align-items:center; }
.switch-field input { width:21px; height:21px; accent-color:var(--form-green); }
.form-note { padding:13px 14px; border-radius:10px; background:#f4f7f5; color:#66726c; font-size:11px; line-height:1.55; }
.image-file-picker { display:block; margin-bottom:16px; cursor:pointer; }
.image-file-picker input { position:absolute; width:1px; height:1px; opacity:0; }
.image-file-picker > span { display:flex; align-items:center; justify-content:space-between; min-height:64px; padding:14px 16px; border:1px dashed #bfcac5; border-radius:12px; background:#f8faf9; color:#355546; }
.image-file-picker strong,.image-file-picker small { display:block; }
.image-file-picker small { color:#87918c; font-size:10px; }
.image-gallery-preview { margin-top:16px; }
.image-gallery-preview > p { margin:0 0 10px; color:#89938e; font-size:10px; }
#image-preview-list { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.image-preview-item { position:relative; min-width:0; aspect-ratio:1/1; overflow:hidden; border:2px solid transparent; border-radius:11px; background:#eef1ef; cursor:pointer; }
.image-preview-item img { width:100%; height:100%; object-fit:cover; }
.image-preview-item.is-main { border-color:var(--form-green); box-shadow:0 0 0 2px rgba(36,77,60,.1); }
.image-preview-item b { position:absolute; left:6px; top:6px; padding:4px 6px; border-radius:5px; background:rgba(30,45,38,.82); color:#fff; font-size:9px; }
.image-preview-item button { position:absolute; right:5px; top:5px; display:grid; place-items:center; width:24px; height:24px; border:0; border-radius:50%; background:rgba(255,255,255,.9); color:#5e6762; font-size:15px; }
.publish-bar { position:fixed; left:50%; bottom:0; z-index:20; display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:16px; width:min(calc(100% - 32px),868px); padding:15px 18px; border:1px solid #dae1dd; border-radius:16px 16px 0 0; background:rgba(255,255,255,.96); box-shadow:0 -12px 28px rgba(27,50,39,.1); transform:translateX(-50%); }
.publish-bar strong,.publish-bar small { display:block; }
.publish-bar small { margin-top:4px; color:#818b86; font-size:10px; }
.publish-bar button { padding:13px 22px; border:0; border-radius:10px; background:var(--form-green); color:#fff; font-weight:800; }
.publish-switch input { width:20px; height:20px; accent-color:var(--form-green); }
.form-toast { position:fixed; left:50%; bottom:94px; z-index:30; padding:11px 16px; border-radius:9px; background:#26332d; color:#fff; font-size:12px; opacity:0; transform:translate(-50%,12px); transition:.2s; pointer-events:none; }
.form-toast.is-visible { opacity:1; transform:translate(-50%,0); }
@media (max-width:640px) {
  .product-form-page { padding:0 14px 120px; }
  .type-selector,.field-grid { grid-template-columns:1fr; }
  .field-grid .wide { grid-column:auto; }
  .publish-bar { grid-template-columns:1fr auto; }
  .publish-bar button { grid-column:1/-1; }
  #image-preview-list { grid-template-columns:repeat(3,1fr); }
}
.field-grid [data-stock-field][hidden] {
  display: none;
}