:root{--ddg-shell-height:86px;--ddg-shell-brand:#2f6fed;--ddg-shell-bg:#fff;--ddg-shell-text:#172033;--ddg-shell-border:#e7eaf0}
.ddg-shell{position:sticky;top:0;z-index:5000;width:100%;min-height:var(--ddg-shell-height);background:var(--ddg-shell-bg);border-bottom:1px solid var(--ddg-shell-border);box-shadow:0 4px 18px rgba(16,24,40,.045);font-family:"Noto Sans KR",Arial,sans-serif;color:var(--ddg-shell-text)}
.ddg-shell *{box-sizing:border-box}.ddg-shell__inner{width:min(100% - 48px,1500px);min-height:var(--ddg-shell-height);margin:0 auto;display:flex;align-items:center;gap:22px}.ddg-shell__brand{display:flex;align-items:center;gap:13px;min-width:230px;max-width:360px;text-decoration:none;color:inherit;flex:0 1 auto}.ddg-shell__brand img{display:block;max-width:220px;max-height:62px;object-fit:contain}.ddg-shell__mark{font-weight:950;font-size:24px;white-space:nowrap}.ddg-shell__brand-copy{display:flex;flex-direction:column;line-height:1.16;min-width:0}.ddg-shell__brand-copy strong{font-size:18px;white-space:nowrap}.ddg-shell__brand-copy small{font-size:10px;color:#7b8497;white-space:nowrap;max-width:220px;overflow:hidden;text-overflow:ellipsis}.ddg-shell__brand-copy.is-logo-only strong{display:none}.ddg-shell__nav{margin-left:auto;display:flex;justify-content:flex-end;align-items:center;gap:3px;min-width:0}.ddg-shell__link{height:42px;padding:0 12px;display:inline-flex;align-items:center;justify-content:center;border-radius:11px;color:#263244;text-decoration:none;font-size:13px;font-weight:800;white-space:nowrap;border:1px solid transparent}.ddg-shell__link:hover{background:#f5f7fb}.ddg-shell__link.is-current:not(.is-primary){background:color-mix(in srgb,var(--ddg-shell-brand) 9%,white);color:var(--ddg-shell-brand);border-color:color-mix(in srgb,var(--ddg-shell-brand) 20%,white)}.ddg-shell__link.is-primary{background:var(--ddg-shell-brand);color:#fff;padding-inline:17px}.ddg-shell__link.is-primary:hover,.ddg-shell__link.is-primary.is-current{background:var(--ddg-shell-brand);color:#fff}.ddg-shell__status{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:800;color:#237a4b;white-space:nowrap;margin-left:4px}.ddg-shell__status i{width:8px;height:8px;border-radius:50%;background:#27ae60;box-shadow:0 0 0 4px rgba(39,174,96,.12)}.ddg-shell__toggle{display:none;border:0;background:transparent;font-size:22px}.ddg-shell--compact{--ddg-shell-height:58px}.ddg-shell--compact .ddg-shell__brand img{max-height:40px;max-width:155px}.ddg-shell--compact .ddg-shell__link{height:36px;padding:0 9px;font-size:12px}
body.has-ddg-shell{padding-top:0!important}body.has-ddg-shell.ddg-editor-page{padding-top:var(--ddg-shell-height)!important}.ddg-editor-page .ddg-shell{position:fixed}.ddg-editor-page .ddg-editor{height:calc(100vh - var(--ddg-shell-height))!important}
@media(max-width:1050px){.ddg-shell__inner{width:min(100% - 24px,1140px)}.ddg-shell__toggle{display:block;margin-left:auto}.ddg-shell__status{display:none}.ddg-shell__nav{position:absolute;top:calc(100% + 8px);left:12px;right:12px;display:none;flex-direction:column;align-items:stretch;background:#fff;border:1px solid var(--ddg-shell-border);border-radius:14px;padding:10px;box-shadow:0 18px 40px rgba(16,24,40,.14)}.ddg-shell.is-open .ddg-shell__nav{display:flex}.ddg-shell__link{justify-content:flex-start}.ddg-shell__brand{min-width:0}.ddg-shell__brand-copy small{display:none}}
@media(max-width:560px){:root{--ddg-shell-height:70px}.ddg-shell__brand img{max-width:170px;max-height:48px}.ddg-shell__brand-copy strong{font-size:16px}.ddg-shell__inner{gap:10px}}
.ddg-shell__member{display:flex;align-items:center;gap:6px;margin-left:4px;white-space:nowrap}
.ddg-shell__member button{font:inherit;cursor:pointer}
.ddg-shell__member-link,.ddg-shell__member-name{border:0;background:transparent;color:#4b5563;font-size:12px;font-weight:750;padding:8px 5px}
.ddg-shell__member-link:hover,.ddg-shell__member-name:hover{color:#111827}
.ddg-shell__member-join{height:34px;padding:0 11px;border:1px solid #d8dde6;border-radius:9px;background:#fff;color:#1f2937;font-size:12px;font-weight:800}
.ddg-shell__member-join:hover{background:#f6f7f9}
@media(max-width:1050px){.ddg-shell__member{margin-left:auto}.ddg-shell__toggle{margin-left:0}}
@media(max-width:680px){.ddg-shell__member-join{display:none}.ddg-shell__member-name{max-width:76px;overflow:hidden;text-overflow:ellipsis}.ddg-shell__member-link{font-size:11px}}

/* PATCH 033: 로고 좌측 / 메뉴 및 회원영역 우측 정렬 */
.ddg-shell__inner{width:min(100% - 48px,1500px);gap:18px}
.ddg-shell__brand{margin-right:auto;flex:0 0 auto}
.ddg-shell__nav{margin-left:0;justify-content:flex-end}
.ddg-shell__member{margin-left:4px;flex:0 0 auto}
.ddg-shell__status{flex:0 0 auto}
@media(max-width:1050px){
  .ddg-shell__inner{width:min(100% - 24px,1500px)}
  .ddg-shell__brand{margin-right:auto}
  .ddg-shell__member{margin-left:0}
  .ddg-shell__toggle{margin-left:0}
}


/* CanvasD MASTER: 로고 미등록 시 텍스트 로고 + 슬로건 세로 배치 */
.ddg-shell__brand.is-text-logo{flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;min-width:250px;max-width:390px}
.ddg-shell__brand.is-text-logo .ddg-shell__mark{font-size:36px;line-height:1;font-weight:950;letter-spacing:-1.2px;color:#0f172a}
.ddg-shell__brand.is-text-logo .ddg-shell__brand-copy{display:block;line-height:1.2}
.ddg-shell__brand.is-text-logo .ddg-shell__brand-copy small{display:block;font-size:10px;line-height:1.25;color:#64748b;max-width:300px;overflow:visible;text-overflow:clip}
.ddg-shell--compact .ddg-shell__brand.is-text-logo .ddg-shell__mark{font-size:28px}
.ddg-shell--compact .ddg-shell__brand.is-text-logo{gap:2px}
@media(max-width:1050px){.ddg-shell__brand.is-text-logo{min-width:0}.ddg-shell__brand.is-text-logo .ddg-shell__brand-copy small{display:block}}
@media(max-width:560px){.ddg-shell__brand.is-text-logo .ddg-shell__mark{font-size:30px}.ddg-shell__brand.is-text-logo .ddg-shell__brand-copy small{font-size:9px;max-width:210px}}

/* CanvasD MOBILE PRODUCT DETAIL SAFE FIX 3 */
@media (max-width: 560px) {
  body:has(.product-shop.is-detail) .ddg-shell__link.is-primary {
    position: fixed;
    right: 14px;
    bottom: calc(78px + env(safe-area-inset-bottom));
    z-index: 4900;
    width: auto;
    height: 44px;
    padding: 0 16px;
    border-radius: 999px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .2);
    font-size: 13px;
  }
}

/* 2026-08-06: 공통 로고 클릭 반응 */
.ddg-shell__brand {
  cursor: pointer;
  transition: transform .14s ease, opacity .14s ease, filter .14s ease;
  transform-origin: left center;
  -webkit-tap-highlight-color: transparent;
}
.ddg-shell__brand:hover {
  transform: translateY(-1px);
  opacity: .88;
}
.ddg-shell__brand:active {
  transform: translateY(1px) scale(.985);
  opacity: .72;
}
.ddg-shell__brand:focus-visible {
  outline: 2px solid var(--ddg-shell-brand, #db2b35);
  outline-offset: 5px;
  border-radius: 8px;
}
.ddg-shell__brand img,
.ddg-shell__brand .ddg-shell__mark,
.ddg-shell__brand .ddg-shell__brand-copy {
  pointer-events: none;
}

/* 2026-08-09 MUGDOT storefront header v1 - SmartStore inspired */
.ddg-shell{--ddg-shell-height:auto;position:sticky;background:#fff;border-bottom:0;box-shadow:none}
.ddg-shell__utility{background:#f5f5f5;border-bottom:1px solid #e8e8e8}
.ddg-shell__utility-inner{width:min(100% - 48px,1500px);height:42px;margin:0 auto;display:flex;align-items:center;gap:14px}
.ddg-shell__nav{margin:0;display:flex;align-items:center;gap:24px;overflow:visible}
.ddg-shell__link{height:auto;padding:0;border:0;border-radius:0;background:transparent!important;color:#5f6368;font-size:12px;font-weight:400;letter-spacing:-.02em}
.ddg-shell__link:hover,.ddg-shell__link.is-current:not(.is-primary){background:transparent!important;border:0;color:#111}
.ddg-shell__member{margin-left:auto;gap:16px}
.ddg-shell__member-link,.ddg-shell__member-name,.ddg-shell__member-join{height:auto;padding:0;border:0;border-radius:0;background:transparent!important;color:#6b7078;font-size:12px;font-weight:400}
.ddg-shell__status{margin-left:2px;font-size:11px;font-weight:600}
.ddg-shell__editor-link{margin-left:8px;color:#e53935;text-decoration:none;font-size:12px;font-weight:900;white-space:nowrap}
.ddg-shell__editor-link:hover{color:#c62828}
.ddg-shell__brand-row{height:100px;display:flex;align-items:center;justify-content:center;background:#fff}
.ddg-shell__brand,.ddg-shell__brand.is-text-logo{min-width:0;max-width:520px;margin:0;align-items:center;justify-content:center;flex-direction:column;gap:5px;transform-origin:center center}
.ddg-shell__brand img{max-width:250px;max-height:68px}
.ddg-shell__brand.is-text-logo .ddg-shell__mark{font-size:38px;letter-spacing:-1.5px}
.ddg-shell__brand-copy small,.ddg-shell__brand.is-text-logo .ddg-shell__brand-copy small{font-size:10px;color:#8a9098;text-align:center;max-width:none}
.ddg-shell__categories{position:relative;background:#fff;border-top:1px solid #ececec;border-bottom:1px solid #dedede}
.ddg-shell__categories-inner{width:min(100% - 48px,1500px);height:58px;margin:0 auto;display:flex;align-items:stretch;gap:0}
.ddg-shell__category{position:relative;display:flex;align-items:stretch}
.ddg-shell__category>a,.ddg-shell__all-products{display:flex;align-items:center;padding:0 34px;color:#25282d;text-decoration:none;font-size:14px;font-weight:500;white-space:nowrap;transition:background .15s,color .15s}
.ddg-shell__category:first-child>a{padding-left:0;padding-right:34px}
.ddg-shell__category>a:hover,.ddg-shell__category:focus-within>a{color:#e53935}
.ddg-shell__category.has-children>a:after{content:'⌄';margin-left:7px;color:#8d9299;font-size:11px;transform:translateY(-1px)}
.ddg-shell__all-products{margin-left:auto;padding-right:0;color:#666;font-size:12px;font-weight:400}
.ddg-shell__submenu{position:absolute;left:10px;top:calc(100% - 1px);z-index:5100;min-width:170px;padding:9px 0;background:#fff;border:1px solid #dedede;box-shadow:0 12px 28px rgba(0,0,0,.09);opacity:0;visibility:hidden;transform:translateY(5px);transition:.14s ease}
.ddg-shell__category:first-child .ddg-shell__submenu{left:0}
.ddg-shell__category:hover .ddg-shell__submenu,.ddg-shell__category:focus-within .ddg-shell__submenu{opacity:1;visibility:visible;transform:none}
.ddg-shell__submenu a{display:block;padding:10px 18px;color:#4d5259;text-decoration:none;font-size:13px;font-weight:400;white-space:nowrap}
.ddg-shell__submenu a:hover{background:#f5f5f5;color:#e53935}
.ddg-shell__toggle{display:none}
@media(max-width:1050px){
 .ddg-shell__utility-inner{width:min(100% - 28px,1500px);height:46px}.ddg-shell__toggle{display:block;margin:0}
 .ddg-shell__nav{position:absolute;top:46px;left:14px;right:14px;display:none;flex-direction:column;align-items:flex-start;gap:0;padding:10px;background:#fff;border:1px solid #ddd;box-shadow:0 12px 28px rgba(0,0,0,.1)}
 .ddg-shell.is-open .ddg-shell__nav{display:flex}.ddg-shell__link{width:100%;padding:10px 8px;font-size:13px}
 .ddg-shell__member{margin-left:auto}.ddg-shell__brand-row{height:82px}.ddg-shell__brand.is-text-logo .ddg-shell__mark{font-size:32px}
 .ddg-shell__categories-inner{width:100%;height:50px;padding:0 14px;overflow-x:auto;scrollbar-width:none}.ddg-shell__categories-inner::-webkit-scrollbar{display:none}
 .ddg-shell__category>a,.ddg-shell__all-products{padding:0 18px;font-size:13px}.ddg-shell__category:first-child>a{padding-left:0;padding-right:18px}
 .ddg-shell__submenu{display:none}.ddg-shell__category.has-children>a:after{display:none}
}
@media(max-width:560px){.ddg-shell__status{display:none}.ddg-shell__editor-link{font-size:11px}.ddg-shell__brand-row{height:72px}.ddg-shell__brand.is-text-logo .ddg-shell__mark{font-size:29px}.ddg-shell__brand-copy small{font-size:9px}.ddg-shell__member{gap:9px}.ddg-shell__member-join{display:none}}


/* 2026-08-09 MUGDOT storefront header v2 - utility cleanup */
/* 좌측 기능메뉴는 더 작고 가볍게, 우측 회원/운영상태/에디터는 동일한 타이포 스케일로 정렬 */
.ddg-shell__utility-inner{gap:0}
.ddg-shell__nav{gap:22px}
.ddg-shell__link{font-size:11.5px;font-weight:400;color:#61666d}
.ddg-shell__status{order:20;margin-left:auto;margin-right:18px;font-size:12px;font-weight:600;color:#27864f}
.ddg-shell__member{order:30;margin-left:0;gap:16px}
.ddg-shell__member-link,.ddg-shell__member-name,.ddg-shell__member-join{font-size:12px;font-weight:400;color:#5f646b}
.ddg-shell__editor-link{order:40;margin-left:18px;font-size:12px;font-weight:800;color:#e53935}
.ddg-shell__status i{width:7px;height:7px;box-shadow:0 0 0 3px rgba(39,174,96,.10)}
/* 회원가입도 일반 텍스트 메뉴로 완전히 통일 */
.ddg-shell__member-join{border:0!important;background:transparent!important;padding:0!important;height:auto!important;border-radius:0!important}
/* 중앙 브랜드와 카테고리 사이의 밀도를 조금 높여 쇼핑몰 헤더 비율 보정 */
.ddg-shell__brand-row{height:94px}
.ddg-shell__categories-inner{height:56px}
.ddg-shell__category>a{font-weight:500}
@media(max-width:1050px){
  .ddg-shell__status{order:20;margin-left:auto;margin-right:12px}
  .ddg-shell__member{order:30;margin-left:0;gap:11px}
  .ddg-shell__editor-link{order:40;margin-left:12px}
  .ddg-shell__nav{gap:0}
}
@media(max-width:680px){
  .ddg-shell__status{display:none}
  .ddg-shell__member-link,.ddg-shell__member-name,.ddg-shell__member-join,.ddg-shell__editor-link{font-size:11px}
}

/* 2026-08-09 MUGDOT storefront header v3 - alignment / spacing polish */
/* 우측 운영중·로그인·회원가입·CanvasD 에디터는 동일한 12px 타이포 스케일 */
.ddg-shell__utility-inner{height:44px;align-items:center}
.ddg-shell__nav{align-items:center;gap:24px}
.ddg-shell__link{display:inline-flex;align-items:center;line-height:1;height:44px}
.ddg-shell__status,
.ddg-shell__member-link,
.ddg-shell__member-name,
.ddg-shell__member-join,
.ddg-shell__editor-link{font-size:12px;line-height:1;height:44px;display:inline-flex;align-items:center}
.ddg-shell__status{gap:6px}
.ddg-shell__member{height:44px;align-items:center;gap:17px}
.ddg-shell__editor-link{margin-left:19px}

/* 브랜드 영역은 유지하되 위/아래 공백의 균형을 조금 더 정돈 */
.ddg-shell__brand-row{height:92px}

/* 대분류 바: 초기에 넓은 가로폭을 쓰고, 카테고리 간격을 한 단계 확대 */
.ddg-shell__categories-inner{height:56px;align-items:stretch}
.ddg-shell__category>a{padding-left:42px;padding-right:42px}
.ddg-shell__category:first-child>a{padding-left:0;padding-right:42px}
.ddg-shell__all-products{padding-left:42px;padding-right:0}

/* hover dropdown: 쇼핑몰 메뉴처럼 조금 더 가볍고 안정적으로 */
.ddg-shell__submenu{left:18px;min-width:184px;padding:8px 0;border-color:#e1e3e6;box-shadow:0 10px 24px rgba(17,24,39,.08);transform:translateY(3px)}
.ddg-shell__category:first-child .ddg-shell__submenu{left:0}
.ddg-shell__submenu a{padding:11px 18px;font-size:12.5px;line-height:1.35;color:#555b63}
.ddg-shell__submenu a:hover{background:#f5f5f5;color:#e53935}

@media(max-width:1050px){
  .ddg-shell__utility-inner{height:46px}
  .ddg-shell__status,.ddg-shell__member-link,.ddg-shell__member-name,.ddg-shell__member-join,.ddg-shell__editor-link{height:46px}
  .ddg-shell__member{height:46px}
  .ddg-shell__category>a,.ddg-shell__all-products{padding-left:20px;padding-right:20px}
  .ddg-shell__category:first-child>a{padding-left:0;padding-right:20px}
}

/* 2026-08-09 CanvasD customer width/category polish v4 */
/* Hero/customer modules use 1460px. Keep header utility/category and footer on the same vertical guides. */
.ddg-shell__utility-inner,
.ddg-shell__categories-inner{width:min(1460px,calc(100% - 48px));}
.ddg-shell__categories-inner{justify-content:center;}
.ddg-shell__category>a{font-size:16.8px;font-weight:500;padding-left:42px;padding-right:42px;}
.ddg-shell__category:first-child>a{padding-left:42px;padding-right:42px;}
@media(max-width:1050px){
  .ddg-shell__utility-inner{width:min(1460px,calc(100% - 28px));}
  .ddg-shell__categories-inner{width:100%;justify-content:flex-start;}
  .ddg-shell__category>a{font-size:15px;padding-left:20px;padding-right:20px;}
  .ddg-shell__category:first-child>a{padding-left:20px;padding-right:20px;}
}

/* 2026-08-09 CanvasD main category hover refinement */
.ddg-shell__category>a:hover,
.ddg-shell__category:focus-within>a{
  color:#9ca3af;
}
.ddg-shell__submenu a:hover{
  background:#f5f5f5;
  color:#6b7280;
}