:root{
      --bg:#ffffff;
      --text:#111111;
      --muted:#666666;
      --line:#dddddd;
      --soft:#f7f7f7;
      --card:#ffffff;
      --chip:#f5f5f5;
      --stockbg:#f8f8f8;
      --out:#c63e3e;
      --in:#2563eb;
      --radius:0px;
      --log-cols: 88px 84px 130px 120px 100px;
      --request-cols: 88px 84px 130px 112px 120px 100px;
      --blue:#2563eb;
      --bluebg:#eef4ff;
      --blueLine:#dbeafe;
      --danger:#c63e3e;
      --dangerBg:#fff5f5;
      --dangerLine:#ffefef;
      --saMint:#84cdc9;
      --page-accent:#111111;
      --page-accent-soft:#f7f7f7;
      --header-h:72px;
      --max:1260px;
      --content-max:1040px;
    }

    *{box-sizing:border-box}

    body.preboot #app,
    body.preboot .fab{
      visibility:hidden;
    }

    html{scroll-behavior:smooth; overflow-x:hidden}

    body{
      margin:0;
      overflow-x:hidden;
      font-family:'Pretendard', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans KR", sans-serif;
      background:var(--bg);
      color:var(--text);
      line-height:1.5;
      word-break:keep-all;
    }

    body.mode-request,
    body.mode-list,
    body.mode-admin{
      --page-accent:#111111;
      --page-accent-soft:#f7f7f7;
    }

    .wrap{
      width:min(calc(100% - 64px), var(--content-max));
      margin:0 auto;
      padding:0 0 80px;
    }

    .topbar{
      position:sticky;
      top:0;
      z-index:90;
      min-height:64px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:20px;
      padding:16px 0;
      margin:0 0 2px;
      background:rgb(255, 255, 255);
      backdrop-filter:blur(14px);
      border-bottom:none;
    }

    .brand{
      color:inherit;
      text-decoration:none;
      display:inline-flex;
      align-items:center;
      gap:8px;
      min-width:0;
      margin-left:12px;
      font-family:"Pretendard", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
      font-weight:600;
      letter-spacing:-0.02em;
    }

    .brand a{
      color:inherit;
      text-decoration:none;
      min-width:0;
    }

    h1{
      font-size:9px;
      font-weight:500;
      margin:0;
      letter-spacing:-0.02em;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
      -webkit-font-smoothing:antialiased;
      -moz-osx-font-smoothing:grayscale;
    }



    #topTitle{
      display:flex;
      align-items:center;
      min-width:0;
    }

    .topLogo{
      height:22px;
      width:auto;
      max-width:150px;
      object-fit:contain;
      display:block;
    }

    .catalogTopSearch{
      width:140px;
      height:30px;
      border:none !important;
      border-bottom:1px solid #ccc !important;
      border-radius:0;
      background:transparent !important;
      outline:none;
      padding:0 30px 6px 0 !important;
      font-size:11px;
      font-family:inherit;
      color:#111;
      box-shadow:none !important;
      -webkit-appearance:none;
      appearance:none;
    }

    .catalogTopSearch:focus{
      border-bottom-color:#2a2a2aae !important;
    }

    body.mode-request .topbarLogo{
      position:relative;
      min-width:140px;
      padding-right:0;
      margin-left:auto;
    }

    body.mode-request .topbarLogo:has(.catalogTopSearch)::after{
      content:"";
      position:absolute;
      right:0;
      top:50%;
      transform:translateY(-50%);
      width:18px;
      height:18px;
      background:url('https://cdn-icons-png.flaticon.com/512/622/622669.png') no-repeat center/contain;
      opacity:.6;
      pointer-events:none;
      filter:grayscale(1);
    }

    .search{
      display:flex;
      gap:8px;
      align-items:center;
      justify-content:flex-end;
      margin-left:auto;
      flex:1;
    }

    .search input{
      width:min(150px, 100%);
      height:30px;
      padding:0 12px;
      border:1px solid var(--line);
      border-radius:0;
      outline:none;
      font-size:11px;
      background:#fff;
    }

    #doSearch{
  height:30px;
  padding:0 14px;
  border:none;
  background:#292929;   /* 항상 보이게 */
  color:#fff;
  font-size:12px;
  cursor:pointer;
}

#doSearch:active{
  background:#000;
}

#doSearch:hover{
  background:#444;
}

    .search input:focus{
      border-color: #2a2a2aae;
    }

    .topbarLogo{
      display:none;
      align-items:center;
      justify-content:flex-end;
      margin-left:16px;
      padding-right:16px;
      min-width:120px;
    }

    .topbar.no-search .topbarLogo{
      display:flex;
    }

    .topbarLogo.show{ display:flex; }

    .topbarLogo img{
      width:100%;
      max-width:100px;
      height:40px;
      object-fit:contain;
      display:block;
    }
    
    @media (max-width: 640px){
  .topbarLogo img{
    max-width:80px;   /* 모바일에서 작게 */
  }
}

    .pill{
      height:36px;
      padding:0 16px;
      border:1px solid transparent;
      border-radius:0px;
      background:none;
      font-size:12px;
      cursor:pointer;
      user-select:none;
      white-space:nowrap;
      font-weight:500;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      transition:.2s ease;
    }

    .pill:hover,
    .btn:hover,
    .sheetClose:hover,
    .dangerBtn:hover,
    .authBtn.cancel:hover,
    .stockInlineMini:hover,
    .selDelBtn:hover,
    .miniBtn:hover{
      
      border-color:var(--line);
      background:#292929 !important;
      border-color:#292929 !important;
      color:#fff !important
    }

    .section{ margin-top:34px; }

    /* ===== 도록 이미지 메뉴 / 상세 ===== */
    .catalogMenuSection{
      position:relative;
      left:50%;
      width:100vw;
      margin-left:-50vw;
      margin-bottom:20px;
      padding:0;
      background:#eeeeee95;
      overflow:hidden;
    }

    .catalogMenuSection > *{
      width:min(calc(100% - 64px), 1040px);
      margin:0 auto;
    }

    .catalogMenuInner{
      padding:40px 0 40px;
    }

    .catalogMenuHead{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      margin:4px 0 18px;
    }

    .catalogMenuTitleGroup{
      display:flex;
      align-items:center;
      gap:10px;
      min-width:0;
      color:#fff;
    }

    .catalogMenuTitle{
      margin:0;
      font-size:13px;
      font-weight:600;
      letter-spacing:-0.03em;
      color:#1f1f1f;
      line-height:1;
    }

    .catalogMenuDivider{
      font-size:16px;
      color:#1f1f1f;
      line-height:1;
      transform:translateY(-1px);
    }

    .catalogMenuTitleSub{
      font-size:15px;
      font-weight:400;
      color:#1f1f1f;
      letter-spacing:-0.02em;
      white-space:nowrap;
      line-height:1;
    }

    .catalogMenuAction{
      display:inline-flex;
      align-items:center;
      gap:6px;
      font-size:14px;
      font-weight:400;
      color:#1f1f1f;
      white-space:nowrap;
      letter-spacing:-0.02em;
      border:0;
      background:transparent;
      padding:0;
      margin:0;
      cursor:pointer;
      font-family:inherit;
    }

    .catalogMenuGrid{
      display:grid;
      grid-template-columns:repeat(3, minmax(0, 1fr));
      gap:22px;
      min-width:0;
      align-items:stretch;
    }

    .catalogMenuCard{
      width:100%;
      min-width:0;
      border:0;
      background:transparent;
      padding:0;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:flex-start;
      gap:10px;
      text-align:center;
      overflow:visible;
      appearance:none;
      -webkit-appearance:none;
      cursor:pointer;
    }

    .catalogMenuThumb{
      width:100%;
      aspect-ratio:3 / 4;
      display:flex;
      align-items:center;
      justify-content:center;
      background:transparent;
      border:0;
      overflow:visible;
    }

    .catalogMenuThumb img,
    .catalogMenuThumb .catalogMenuThumbImg{
      width:80% !important;
      height:80% !important;
      max-width:80% !important;
      max-height:80% !important;
      object-fit:contain !important;
      display:block;
      margin:0 auto;
    }

    .catalogMenuThumbPlaceholder{
      width:62%;
      aspect-ratio:3 / 4;
      display:flex;
      align-items:center;
      justify-content:center;
      color:rgba(255,255,255,0.45);
      font-size:12px;
      border:1px dashed rgba(255,255,255,0.18);
      background:transparent;
    }

    .catalogMenuLabel{
      width:100%;
      min-height:25px;
      display:flex;
      align-items:flex-start;
      justify-content:center;
      text-align:center;
      font-size:16px;
      line-height:1.22;
      letter-spacing:-0.03em;
      white-space:normal;
      word-break:keep-all;
      overflow-wrap:break-word;
      color:#1f1f1f;
      font-weight:500;
      margin-top:-20px;  /* ← 핵심 */
    }

    .catalogDetailPage{
      width:min(100%, 1200px);
      margin:0 auto;
      padding:0;
    }

    .catalogDetailMeta{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      margin:2px 0 34px;
    }

    .catalogDetailSub{
      display:flex;
      align-items:center;
      gap:10px;
      font-size:15px;
      font-weight:400;
      color: #555555;
      white-space:nowrap;
      letter-spacing:-0.03em;
      
    }

    .catalogDetailSub small{
      font-size:15px;
      font-weight:400;
      color:#666;
      letter-spacing:-0.02em;
    }

    .catalogControlLabel,
    .catalogStockCaption,
    .catalogGalleryTitle{
      margin:0 0 8px;
      font-size:12px;
      font-weight:500;
      color:#666;
      letter-spacing:-0.02em;
    }

    .catalogDetailControlRow{
      display:grid;
      grid-template-columns:minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 1fr) 164px;
      gap:12px;
      align-items:center;
      margin-bottom:20px;
    }

    .catalogSelectWrap{
      position:relative;
      min-width:0;
    }

    .catalogSelect{
      width:100%;
      height:44px;
      border:1px solid #dcdcdc;
      border-radius:0;
      background:#fff;
      padding:0 42px 0 16px;
      font-size:14px;
      font-weight:500;
      color:#444;
      outline:none;
      appearance:none;
      -webkit-appearance:none;
      cursor:pointer;
    }

    .catalogSelectArrow{
      position:absolute;
      right:14px;
      top:50%;
      transform:translateY(-52%);
      pointer-events:none;
      font-size:13px;
      color:#555;
    }

    .catalogDetailAction{
      margin:0;
    }

    .catalogDetailSubmit{
      width:100%;
      height:44px;
      border:0;
      border-radius:0;
      background:#2c2c2c;
      color:#fff;
      font-size:14px;
      font-weight:700;
      cursor:pointer;
    }

    .catalogDetailSubmit:hover{
      opacity:.92;
    }

    .catalogStockBox{
      border:1px solid #dcdcdc;
      background:#fff;
      margin-bottom:28px;
    }

    .catalogStockRow{
      display:grid;
      grid-template-columns:180px minmax(0, 1fr);
      min-height:52px;
      align-items:center;
    }

    .catalogStockLabel,
    .catalogStockValue{
      display:flex;
      align-items:center;
      justify-content:center;
      min-height:52px;
      font-size:13px;
      color:#222;
      font-weight:600;
    }

    .catalogStockValue{
      position:relative;
      font-size:15px;
      font-weight:700;
    }

    .catalogStockValue::before{
      content:"";
      position:absolute;
      left:0;
      top:50%;
      transform:translateY(-50%);
      width:1px;
      height:22px;
      background:#dcdcdc;
    }

    .catalogGalleryGrid{
      display:grid;
      grid-template-columns:repeat(5, minmax(0, 1fr));
      gap:32px 36px;
      margin-bottom:26px;
    }

    .catalogGalleryItem{
      width:100%;
      aspect-ratio:3 / 4;
      overflow:hidden;
      background:#f3f3f3;
      border:1px solid #e1e1e1;
      display:flex;
      align-items:center;
      justify-content:center;
    }

    .catalogGalleryItem img{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
    }

    .catalogGalleryPlaceholder{
      width:100%;
      height:100%;
      display:flex;
      align-items:center;
      justify-content:center;
      color:#b5b5b5;
      font-size:11px;
      background:#f6f6f6;
    }

    .secHead{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      margin:0 0 18px;
      padding-bottom:10px;
      border-bottom:none;
    }

    /* 상세/리스트 들어갔을 때만 선 보이게 */
    .body.mode-request .topbar.no-search{
  border-bottom:none !important;
}

.secHeadTitle{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
}

.secHeadAction{
  display:flex;
  align-items:center;
  flex:0 0 auto;
}

.sectionAddBtn{
  background:#84cdc9 !important;
  border-color:#84cdc9 !important;
  color:#fff !important;
}

.sectionAddBtn:hover{
  background:#73c1bc !important;
  border-color:#73c1bc !important;
  color:#fff !important;
}

.sectionAddBtn:active{
  background:#fff !important;
  border-color:#84cdc9 !important;
  color:#84cdc9 !important;
}

    .secHead h2{
      margin:0;
      font-size:12px;
      color:var(--muted);
      font-weight:500;
      letter-spacing:0em;
      text-transform:uppercase;
    }

    .list{ display:flex; flex-direction:column; gap:14px; }

    body.mode-request .list,
    body.mode-list .list,
    body.mode-admin .list{
      display:grid;
      grid-template-columns:repeat(2, minmax(0, 1fr));
      gap:14px;
    }

    .row{
      display:grid;
      grid-template-columns:minmax(0, 1fr) 150px;
      gap:0;
      align-items:stretch;
    }

    /* 와인박스(1구) 아래 여백 */
    .row.wineboxGap{
      margin-bottom:36px;
    }

    .card{
      border:1px solid var(--line);
      border-right:0;
      border-radius:var(--radius) 0 0 var(--radius);
      background:#fff;
      padding:14px;
      display:flex;
      gap:14px;
      align-items:center;
      min-height:100px;
      cursor:pointer;
      transition:transform .18s ease, border-color .18s ease;
    }

    .card:hover{
      transform:translateY(-2px);
      border-color:#ededed;
    }

    .card:active{ transform:translateY(0); }

    .thumb{
      width:82px;
      height:82px;
      border-radius:0;
      background:#ffffff;
      display:flex;
      align-items:center;
      justify-content:center;
      flex:0 0 auto;
      overflow:hidden;
      border:1px solid #efefef;
      color:transparent;
      font-size:0;
      line-height:0;
    }

    .thumb img,
    .imgBox img,
    .stockThumb img{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
      filter:saturate(.98);
      opacity:0;
      visibility:hidden;
      transition:opacity .15s ease;
    }

    .thumb img.is-loaded,
    .imgBox img.is-loaded,
    .stockThumb img.is-loaded,
    .mainLogoImg.is-loaded{
      opacity:1;
      visibility:visible;
    }

    .meta{ display:flex; flex-direction:column; align-items:flex-start; gap:10px; text-align:left; min-width:0; }
    .meta-top{ width:100%; }

    .meta-bot{
      display:flex;
      align-items:center;
      gap:12px;
      font-size:12px;
      color:var(--muted);
      margin-top:2px;
      min-width:0;
      flex-wrap:wrap;
    }

    .meta-bot span{ white-space:nowrap; }

    .title{
      font-weight:800;
      font-size:18px;
      line-height:1.2;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
      letter-spacing:-0.04em;
      margin-bottom:6px;
    }

    .size{
      font-size:13px;
      color:var(--muted);
      white-space:nowrap;
      font-weight:500;
    }

    .status{ font-weight:600; }
    .status.out{ color:var(--out); }
    .status.in{ color:var(--in); }

    .delta{ white-space:nowrap; font-weight:500; }
    .delta .qty{ font-weight:700; margin-left:6px; }
    .delta .qty.out{ color:var(--out); }
    .delta .qty.in{ color:var(--in); }

    .stock{
      border:1px solid var(--line);
      border-left:1px solid var(--line);
      border-radius:0 var(--radius) var(--radius) 0;
      background:rgba(185, 185, 185, 0.088);
      display:flex;
      align-items:center;
      justify-content:center;
      font-weight:800;
      font-size:20px;
      letter-spacing:-0.04em;
      min-height:100px;
    }

    .stock small{
      font-size:14px;
      color:var(--muted);
      font-weight:700;
      margin-left:4px;
    }

    .paper{
      border:1px solid var(--line);
      border-radius:var(--radius);
      background:#fff;
      overflow:hidden;
    }
    .paper.detailPaper{
  border:none !important;
}

    .paper-head{
      padding:18px 24px;
      border-bottom:1px solid var(--line);
      font-weight:600;
      letter-spacing:0.08em;
      font-size:12px;
      color:var(--muted);
      text-transform:uppercase;
    }

    .paper-body{ padding:28px 24px 24px; }

    .imgRow{
      display:flex;
      justify-content:flex-start;
      gap:20px;
      padding:0 0 24px;
      margin:0;
    }

    .imgBox{
      width:min(100%, 260px);
      aspect-ratio:1 / 1;
      border-radius:0;
      background:#f4f4f4;
      border:1px solid #efefef;
      overflow:hidden;
      display:flex;
      align-items:center;
      justify-content:center;
      color:transparent;
      font-size:0;
      line-height:0;
    }

    .imgPh{ width:42px; height:42px; opacity:.55; }

    .itemHeader{ padding:4px 0 0; }

    .itemTop{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:14px;
      margin-bottom:20px;
    }

    .itemName{
      font-size:30px;
      font-weight:800;
      letter-spacing:-0.06em;
      line-height:1.04;
      margin:0;
      min-width:0;
      word-break:keep-all;
    }

    .sizePill{
      flex:0 0 auto;
      padding:10px 14px;
      border-radius:999px;
      background:#f7f7f7;
      border:1px solid #ececec;
      color:#111827;
      font-weight:600;
      font-size:13px;
      white-space:nowrap;
      margin-top:3px;
    }

    .statsGrid{ display:grid; grid-template-columns:1fr; gap:10px; margin-top:3px; }

    .statCard{
      border-radius:0;
      border:1px solid var(--line);
      background:#fff;
      padding:0;
      min-height:70px;
      display:flex;
      align-items:center;
      justify-content:center;
      overflow:hidden;
    }

    .statCard.current{ background:#f8f8f8; border-color:var(--line); }

    .statRow{
      width:100%;
      display:grid;
      grid-template-columns:1fr 1fr;
      align-items:center;
      min-height:70px;
    }

    .statLabel,
    .statValue{
      display:flex;
      align-items:center;
      justify-content:center;
      min-height:70px;
      min-width:0;
      white-space:nowrap;
      position:relative;
      word-break:keep-all;
      padding:0 6px;
    }

    .statLabel{
      font-size:14px;
      font-weight:600;
      color:#3b3b3b;
      letter-spacing:-0.02em;
    }

    .statLabel .txt{ font-size:15px; line-height:1; white-space:nowrap;  word-break:keep-all;}

    .statValue{
      font-size:18px;
      font-weight:800;
      color:#111;
      letter-spacing:-0.05em;
    }

    .statValue::before{
      content:"";
      position:absolute;
      left:0;
      top:50%;
      transform:translateY(-50%);
      width:1px;
      height:36px;
      background:#d9d9d9;
    }

    .statValue .unit{ font-size:15px; font-weight:800; color:#2f2f2f; margin-left:0; white-space:nowrap;}

    .divider{ height:1px; background:var(--line); margin:28px 0 24px; }

    .boxTitleRow{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0; margin-bottom:8px; flex-wrap:nowrap; }

    .boxTitle{
      font-size:16px;
      font-weight:600;
      letter-spacing:0em;
      margin:0;
      padding:0;
      color:var(--muted);
      text-transform:uppercase;
      white-space:nowrap;
      word-break:keep-all;
      line-height:1.2;
    }

    .selDelBtn,
    .btn,
    .dangerBtn,
    .stockInlineMini,
    .miniBtn,
    .sheetClose,
    .authBtn{
      padding:0 14px;
      border:1px solid var(--line);
      border-radius:0;
      background:#fff;
      font-weight:500;
      cursor:pointer;
      white-space:nowrap;
      min-width:86px;
      height:34px;
      font-size:12px;
      transition:.2s ease;
    }

    .logBox{
      margin:0;
      border:1px solid var(--line);
      border-radius:0;
      background:#fff;
      overflow-x:auto;
      overflow-y:hidden;
      -webkit-overflow-scrolling:touch;
    }

    .logMinWidth{ min-width:100%; width:100%; }

    .logHead,
    .logRow{
      display:grid;
      grid-template-columns:minmax(120px, 1.15fr) minmax(100px, 0.9fr) minmax(140px, 1.1fr) minmax(140px, 1fr) minmax(110px, 0.8fr);
      align-items:center;
      width:100%;
      column-gap:0;
    }

    .requestTable .logHead,
    .requestTable .logRow{
      grid-template-columns:minmax(120px, 1.1fr) minmax(100px, 0.8fr) minmax(140px, 1.1fr) minmax(120px, 0.95fr) minmax(140px, 1fr) minmax(110px, 0.8fr);
    }

    .logHead > div,
    .logRow > div{ min-width:0; padding:0 18px; }

    .logHead{
      padding:0;
      min-height:52px;
      background:#fafafa;
      border-bottom:1px solid var(--line);
      font-weight:600;
      font-size:12px;
    }

    .logRow{
      padding:0;
      min-height:56px;
      border-top:1px solid var(--line);
      font-size:13px;
      background:#fff;
    }

    .logHeadCell,
    .logDate,
    .logType,
    .logDept,
    .logPerson,
    .logQty{
      display:flex;
      align-items:center;
      justify-content:center;
      min-height:52px;
      text-align:center;
    }

    .logHeadLabel{ width:100%; font-size:12px; color:var(--muted); font-weight:600; white-space:nowrap; text-align:center; }

    .logHead .hselect{
      width:100%;
      min-width:0;
      margin:0;
      padding:0 14px;
      text-align:left;
      height:38px;
      border:1px solid var(--line);
      border-radius:999px;
      background:#fff;
      font-weight:600;
      font-size:12px;
      outline:none;
    }

    .logHead .hdateWrap{ width:100%; }
    .logHead .hbtn{ width:100%; }
    .logHead .qtySortBtn{ width:100%; display:flex; justify-content:flex-start; align-items:center; }
    .logRow:first-child{ border-top:none; }
    .logRow.clickable{ cursor:pointer; }

    .logRow.selected{ outline:1px solid #111; outline-offset:-1px; background:#fcfcfc; }

    .hbtn{ display:inline-flex; align-items:center; gap:6px; cursor:pointer; font-weight:700; }
    .arrow{ font-size:10px; color:var(--muted); transform:translateY(-0.5px); }

    .hdateWrap{ position:relative; }

    .hdate{
      position:absolute;
      left:0;
      top:44px;
      width:min(92vw, 320px);
      padding:8px;
      border:1px solid var(--line);
      border-radius:0;
      background:#fff;
      display:none;
      z-index:50;
      box-shadow:0 10px 30px rgba(17,24,39,0.08);
    }

    .hdate input{
      width:100%;
      border:1px solid var(--line);
      border-radius:12px;
      padding:9px 10px;
      font-size:12px;
      font-weight:600;
      outline:none;
      background:#fff;
    }

    .hdate .row2{ display:flex; justify-content:flex-end; gap:6px; margin-top:8px; }

    .requestActionWrap{ margin:8px 0 18px; }

    .catalogApplyPage{
      width:min(100%, 520px);
      margin:0 auto;
      padding:0 0 12px;
    }

    .catalogApplyTop{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:12px;
      margin:6px 0 20px;
    }

    .catalogApplyTitle{
      margin:0;
      font-size:20px;
      font-weight:800;
      letter-spacing:-0.04em;
      color:#111;
      line-height:1.2;
    }

    .catalogApplySub{
      flex:0 0 auto;
      font-size:14px;
      font-weight:500;
      color:#444;
      padding-top:2px;
      white-space:nowrap;
    }

    .catalogApplySummary{
      border:1px solid var(--line);
      background:#f8f8f8;
      margin-bottom:16px;
    }

    .catalogApplySummaryRow{
      display:grid;
      min-height:56px;
    }

    .catalogApplySummaryRowSingle{
      grid-template-columns:1fr;
    }

    .catalogApplySummaryRowDouble{
      grid-template-columns:1fr 1fr;
    }

    .catalogApplySummaryCell{
      display:flex;
      align-items:center;
      justify-content:center;
      padding:0 18px;
      font-size:14px;
      font-weight:600;
      color:#333;
      text-align:center;
      min-height:56px;
    }

    .catalogApplySummaryRowDouble .catalogApplySummaryCell + .catalogApplySummaryCell{
      border-left:1px solid #d9d9d9;
    }

    .catalogApplyTitleCell{
      justify-content:flex-start;
      text-align:left;
      font-weight:700;
      font-size:17px;
      min-height:64px;
      padding:0 38px;
    
      @media (max-width: 640px){
  .catalogApplyTitle{
    margin-left:12px;   /* ← 이 값으로 위치 조절 */
  }
}
    }
    

    .catalogApplyForm{
      border:1px solid var(--line);
      background:#fff;
      padding:18px 18px 4px;
      margin-bottom:18px;
    }

    .catalogApplyBtn{
      width:100%;
      height:62px;
      border:0;
      background:#84cdc9;
      color:#fff;
      font-size:18px;
      font-weight:700;
      cursor:pointer;
    }

    .catalogApplyBtn:hover{ opacity:.92; }

    .requestSubmitBtn{
      width:100%;
      padding:15px 16px;
      border:0;
      border-radius:0;
      background:#84cdc9;
      color:#fff;
      font-weight:500;
      font-size:15px;
      cursor:pointer;
      margin-bottom:0;
      transition:opacity .2s ease;
    }

    .requestSubmitBtn:hover,
    .primary:hover,
    .fab:hover,
    .authBtn.confirm:hover{ opacity:.9; }

    .detailPaper.requestDetailPaper{ border-color:#d9d9d9; }

    .detailPaperHead{ display:none; }
    .detailHeadLogo{ display:none; }
    .detailHeroGrid,
    .detailHeroTop,
    .detailHeroText,
    .detailLogoWrap{ display:none; }

    .detailPaperBody{
      padding:10px 22px 30px;
    }

    .detailAdminHero{
      display:grid;
      grid-template-columns:minmax(180px, 240px) minmax(520px, 1fr);
      align-items:start;
      gap:44px;
      padding:4px 14px 34px;
    }

    .detailAdminIntro{
      display:flex;
      flex-direction:column;
      align-items:flex-start;
      justify-content:flex-start;
      padding-top:14px;
      min-width:0;
    }

    .detailAdminName{
      margin:0;
      font-size:24px;
      line-height:1.15;
      font-weight:800;
      letter-spacing:-0.05em;
      color:#111;
      word-break:keep-all;
    }

    .detailAdminSize{
      margin:20px 0 0;
      font-size:13px;
      line-height:1.2;
      font-weight:600;
      letter-spacing:-0.02em;
      color:#666;
      white-space:nowrap;
    }

    .detailImageFrame{
      border:none;
      border-top:none;
      padding:0;
      display:flex;
      justify-content:flex-end;
    }

    .requestImgRow{
      justify-content:flex-end;
      gap:20px;
      border:none;
      padding:0;
      width:max-content;
      margin-left:auto;
    }

    .requestImgBox{
      width:250px;
      aspect-ratio:1 / 1;
      background:#f6f6f3;
      border:1px solid #dfdfdf;
      display:flex;
      align-items:center;
      justify-content:center;
      color:transparent;
      font-size:0;
      line-height:0;
    }

    .requestImgRow .requestImgBox + .requestImgBox{
      border-left:1px solid #dfdfdf;
      padding-left:0;
      margin-left:0;
    }

    .requestStatsGrid{
      margin-top:20px;
    }

    .requestStatCard{
      border:none;
      background:#f5f5f5;
    }

    .requestActionWrapLarge{ margin:18px 0 28px; }
    .detailSectionBlock{ margin-top:28px; }
    .detailSectionHead{ justify-content:space-between; }
    .requestLogBox{ border-color:#d8d8d8; }
    .subtleHead{ background:#f5f5f5; }

    .typeBadge{ font-weight:700; }
    .typeBadge.request{ color:#1f2937; }
    .typeBadge.pending{ color:#9a6700; }
    .typeBadge.approved{ color:#0f766e; }
    .typeBadge.rejected{ color:#b42318; }
    .typeBadge.in{ color:var(--in); }
    .typeBadge.out{ color:var(--out); }

    .filterInlineRow{ display:flex; justify-content:flex-end; gap:10px; margin:0 0 10px; }
    .filterInlineRow.multi{ justify-content:flex-start; flex-wrap:wrap; }

    .filterDateInput,
    .filterSelectInline{ height:34px; border:1px solid var(--line); padding:0 12px; font-size:12px; font-weight:600; background:#fff; }

    .mintBtn{ background:#84cdc9; border-color: #84cdc9; color:#fff; border-radius:0; }
    .mintBtn:hover{ background:#73c1bc; border-color:#73c1bc; }

    .logEmpty{ padding:18px; font-size:10px; color:var(--muted); }

    #bulkDeleteRequests,
    #bulkDeleteLogs{
      background:#292929;
      border-color:#292929;
      color:#fff;
    }

    #bulkDeleteRequests:hover,
    #bulkDeleteLogs:hover{
      background:#1f1f1f;
      border-color:#1f1f1f;
    }

    .reqApproveBtn{
      background:rgba(37, 99, 235, 0.15);
      border-color:rgba(37, 99, 235, 0.35);
      color:#2563eb;
    }

    .reqApproveBtn:hover{
      background:rgba(37, 99, 235, 0.22);
      border-color:rgba(86, 138, 248, 0.45);
      color:#000000;
    }

    .reqRejectBtn{
      background:rgba(198, 62, 62, 0.12);
      border-color:rgba(198, 62, 62, 0.28);
      color:#c63e3e;
    }

    .reqRejectBtn:hover{
      background:rgba(198, 62, 62, 0.18);
      border-color:rgba(198, 62, 62, 0.38);
      color:#b42318;
    }

    #openAdd{
      background:rgba(37, 99, 235, 0.15);
      border-color:rgba(37, 99, 235, 0.35);
      color: #2563eb;
    }

    #openAdd:hover{
      background:rgba(37, 99, 235, 0.22);
      border-color:rgba(37, 99, 235, 0.45);
      color: #1d4ed8;
    }

    .headerFilterDate,
    .headerFilterSelect{
      width:100%;
      min-width:0;
      height:34px;
      border:1px solid var(--line);
      border-radius:0;
      padding:0 10px;
      font-size:12px;
      text-align:center;
      text-align-last:center;
      font-weight:600;
      background:#fff;
      outline:none;
    }

    .primary{
      background:#111;
      color:#fff;
      border-color:#111;
    }

    .adminBottomRow,
    .commonBottomRow{
      margin-top:18px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      flex-wrap:wrap;
    }

    .adminBottomLeft,
    .commonBottomLeft{
      display:flex;
      align-items:center;
      gap:4px;
      font-size:11px;
      color:var(--muted);
      font-weight:600;
      min-width:0;
    }

    .stockInline{ display:inline-flex; align-items:center; gap:6px; flex-wrap:wrap; }

    .stockInlineValue{
      display:inline-flex;
      align-items:center;
      gap:4px;
      font-size:11px;
      color:#667085;
      font-weight:700;
      cursor:pointer;
      border:none;
      background:transparent;
      padding:0;
    }

    .stockInlineValue b{ font-size:13px; color:#667085; }
    .stockInlineEdit{ display:none; align-items:center; gap:6px; flex-wrap:wrap; }
    .stockInlineEdit.show{ display:inline-flex; }

    .stockInlineInput{
      width:88px;
      height:38px;
      border:1px solid var(--line);
      border-radius:999px;
      padding:0 12px;
      font-size:12px;
      font-weight:700;
      outline:none;
    }

    .adminBottomRight,
    .commonBottomRight{ display:flex; align-items:center; gap:8px; margin-left:auto; }

    .dangerBox{
      margin-top:50px;
      border:1px dashed #e7dede;
      background:#fff9f9;
      border-radius:0;
      padding:16px 18px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
    }

    .dangerText{ font-size:11px; color:#313131; font-weight:500; line-height:1.8; }
    .dbStatusLine{ margin-top:18px; font-size:11px; color:var(--muted); }

    .modal,
    .authModal{
      display:none;
      position:fixed;
      inset:0;
      z-index:9999;
    }

    .modal.show,
    .authModal.show{ display:block; }

    .modalOverlay,
    .authOverlay{
      position:absolute;
      inset:0;
      background:rgba(17,24,39,0.45);
    }

    .sheet{
      position:absolute;
      left:0; right:0; bottom:0;
      background:#fff;
      border-top-left-radius:24px;
      border-top-right-radius:24px;
      box-shadow:0 -10px 30px rgba(0,0,0,0.12);
      overflow:hidden;
      max-height:86vh;
      display:flex;
      flex-direction:column;
    }

    .sheetHead{
      padding:18px 20px;
      border-bottom:1px solid var(--line);
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      font-weight:500;
    }

    .sheetBody{ padding:18px 20px 8px; overflow:auto; }
    .field{ margin-bottom:14px; }

    .field label{
      display:block;
      font-size:11px;
      color:var(--muted);
      font-weight:600;
      margin-bottom:6px;
      letter-spacing:0.04em;
    }

    .field input, .field select, .authInput{
      width:100%;
      border:1px solid var(--line);
      border-radius:0;
      padding:13px 14px;
      font-size:13px;
      font-weight:600;
      outline:none;
      background:#fff;
      color:#111;
    }
    @media (max-width:640px){
  .dateInput{
    width:70%;
    max-width:280px;
    margin:0 auto;
    display:block;
  }
}

    .seg{ display:flex; gap:10px; }

    .seg button{
      flex:1;
      border:1px solid var(--line);
      border-radius:0;
      padding:12px 10px;
      background:#fff;
      cursor:pointer;
      font-weight:700;
      font-size:12px;
    }

    .seg button.active.out{ border-color:var(--out); color:var(--out); background:#fff5f5; }
    .seg button.active.in{ border-color:var(--in); color:var(--in); background:#f1f5ff; }

    .sheetFoot{ padding:14px 20px 20px; border-top:1px solid var(--line); background:#fff; }

    .sheetFoot .primary{
      width:100%;
      padding:15px 14px;
      border-radius:0;
      font-size:14px;
      font-weight:800;
    }

    .fab{
      position:fixed;
      right:24px;
      bottom:24px;
      z-index:9998;
      padding:0 18px;
      height:48px;
      border:1px solid #111;
      border-radius:999px;
      background:#111;
      color:#fff;
      font-weight:700;
      font-size:12px;
      cursor:pointer;
      box-shadow:0 10px 24px rgba(0,0,0,0.14);
      user-select:none;
      white-space:nowrap;
    }

    .fab:active{ transform:translateY(0.5px); }

    .bottomNav{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:9997;
  height:60px;
  background:#f9f9f9;
  border-top:0.2px solid #d9d9d9;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  align-items:center;
  justify-items:center;
  padding:0 env(safe-area-inset-right) calc(env(safe-area-inset-bottom)) env(safe-area-inset-left);
}

.bottomNavBtn{
  appearance:none;
  -webkit-appearance:none;
  border:0;
  background:transparent;
  width:100%;
  height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
}

.bottomNavBtn svg{
  width:20px;
  height:20px;
  stroke:#11111199;
  stroke-width:1.5;
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
}

body{
  padding-bottom:56px;
}

.fab{
  bottom:86px;
}

@media (max-width: 980px){
  .bottomNav{
    height:68px;
  }

  .bottomNavBtn{
    height:52px;
  }

  .bottomNavBtn svg{
    width:20px;
    height:20px;
  }

  .fab{
    right:16px;
    bottom:74px;
  }
}

    .mainHome{
      width:min(100%, 360px);
      margin:0 auto;
      padding:48px 0 8px;
      text-align:center;
    }

    .mainLogoArea{
      width:100%;
      min-height:180px;
      display:flex;
      align-items:center;
      justify-content:center;
      margin-bottom:0px;
      cursor:pointer;
    }

    .mainLogoImg{ max-width:250px; max-height:88px; object-fit:contain; display:block; opacity:0; visibility:hidden; transition:opacity .15s ease; }

    .mainLogoPlaceholder{
      width:200px;
      height:72px;
      border:1px dashed #cfd8dc;
      border-radius:0;
      display:flex;
      align-items:center;
      justify-content:center;
      color:#d1d5da;
      font-size:12px;
      font-weight:600;
      background:#fafafa;
    }

    .mainHomeLine,
    .authHeaderLine{
      width:156px;
      height:0.7px;
      background:#d9d9d9;
      margin:0 auto 14px;
    }

    .mainHomeTitle,
    .authHeaderTitle{
      font-size:11px;
      font-weight:400;
      color:#222;
      margin-bottom:60px;
      letter-spacing:-0.02em;
      text-align:center;
    }

    .mainHomeBtns{
      display:grid;
      grid-template-columns:repeat(3, minmax(0, 1fr));
      gap:20px;
      margin-top:0;
    }

    .mainHomeBtns.oneRole{
      grid-template-columns:1fr;
      width:72%;
      min-width:220px;
      max-width:320px;
      margin:0 auto;
      gap:17px;
    }

    .mainHomeBtn{
      width:100%;
      height:50px;
      min-height:50px;
      border:0;
      border-radius:0;
      background:#fff;
      color:#222;
      font-size:14px;
      font-weight:500;
      cursor:pointer;
      padding:0 18px;
      display:flex;
      align-items:center;
      justify-content:center;
      text-align:center;
      transition:transform .18s ease, border-color .18s ease, background-color .18s ease, color .18s ease;
    }

    .mainHomeBtn:hover{
      transform:translateY(-2px);
    }

    .mainHomeBtn.primaryHomeBtn{ background:#111; border-color:#111; color:#fff; }
    .requestDarkBtn{ background:#262626; color:#fff; }
    .stockBtn{ background:#f3f3f3; color:#111; }
    .adminBtn{ background:#f7f7f7; color:#111; }
    .adminMintBtn{ background:#84cdc9; color:#fff; }

    .logoutBtn{
      background:transparent;
      color:#adadad;
      font-size:11px;
      font-weight:400;
      height:auto;
      min-height:0;
      padding:28px 0 0;
    }

    .listGrid{
      display:grid;
      grid-template-columns:repeat(2, minmax(0, 1fr));
      gap:20px 32px;
      align-items:stretch;
    }

    .stockCard{
      border:1px solid #dcdcdc;
      border-radius:0;
      background:#f6f6f6;
      padding:22px 26px;
      display:grid;
      grid-template-columns:96px minmax(0, 1fr);
      align-items:center;
      column-gap:22px;
      min-height:140px;
    }

    .stockCard:hover{ transform:translateY(-2px); border-color:#bfbfbf; }

    .stockThumb{
      width:96px;
      height:96px;
      flex:0 0 96px;
      background:#f1f1f1;
      border:1px solid #e3e3e3;
      color:transparent;
      font-size:0;
      line-height:0;
      overflow:hidden;
    }

    .stockMeta{
      min-width:0;
      flex:1;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      gap:18px;
    }

    .stockName{
      width:100%;
      text-align:center;
      font-size:22px;
      font-weight:800;
      line-height:1.2;
      white-space:nowrap;
      overflow:hidden;
      text-overflow:ellipsis;
    }

    .stockQtyBar{
      width:100%;
      min-height:54px;
      padding:0 18px;
      background:#efefef;
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:20px;
      border:1px solid #d8d8d8;
    }

    .authDialog{
      position:absolute;
      left:50%;
      top:50%;
      transform:translate(-50%, -50%);
      width:min(92vw, 440px);
      background:#fff;
      border-radius:20px;
      padding:22px 22px 18px;
      box-shadow:0 24px 60px rgba(45, 45, 45, 0.18);
    }

    .authTitle{ font-size:18px; font-weight:700; letter-spacing:-0.03em; margin:0 0 8px; color:#111; }
    .authDesc{ font-size:14px; color:#6d6d6d; margin:0 0 14px; line-height:1.5; }

    .authInput:focus{
      border-color:#111;
      box-shadow:0 0 0 3px rgba(17,17,17,0.06);
    }

    .authError{ min-height:20px; margin-top:10px; font-size:12px; color:#c63e3e; font-weight:500; visibility:hidden; }
    .authError.show{ visibility:visible; }

    .authBtns{ display:flex; justify-content:flex-end; gap:10px; margin-top:0; }
    .authBtn.confirm{ background:#111; color:#fff; border-color:#111; }

    .loginScreen{
      min-height:100vh;
      display:flex;
      align-items:flex-start;
      justify-content:center;
      padding:120px 16px 48px;
      background:#ffffff;
    }

    .loginWrap{
      width:min(100%, 360px);
      display:flex;
      flex-direction:column;
      align-items:center;
    }

    .loginLogoWrap{
      width:100%;
      margin:0 0 0;
    }

    .loginLogoBox{
      width:100%;
      height:100px;
      display:flex;
      align-items:center;
      justify-content:center;
    }

    .loginLogoImage{
      max-width:250px;
      max-height:70px;
      width:auto;
      height:auto;
      display:block;
      object-fit:contain;
    }

    .loginForm{
      width:82%;
      min-width:220px;
      max-width:320px;
      margin-top:0;
    }

    .findIdForm,
    .resetPwForm,
    .signupForm{
      margin-top:120px;
    }

    .loginInput{
      width:100%;
      height:38px;
      border:0;
      background:#f4f4f487;
      padding:0 17px;
      font-size:13px;
      color:#2e2e2e9e;
      outline:none;
      margin-bottom:10px;
      font-family:'Pretendard', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans KR", sans-serif;
    }

    .loginInput::placeholder{
      color:#a1a1a1a9;
      font-family:'Pretendard', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans KR", sans-serif;
    }

    #signupPasswordConfirm,
#findIdEmail,
#resetEmail,
#newPasswordConfirm{
  margin-bottom:24px;
}
.loginForm input:last-of-type{
  margin-bottom:24px;
}

    .loginSubLinks{
      display:flex;
      align-items:center;
      justify-content:center;
      gap:12px;
      font-size:11px;
      color:#9b9b9b;
      font-weight:400;
      margin:14px 0 30px;
      font-family:'Pretendard', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans KR", sans-serif;
      flex-wrap:wrap;
    }

    .loginSubLinks a{
      color:#616161;
      text-decoration:none;
    }

    .loginSubLinks span{ color:#dadada; }

    .loginBtn,
    .authSecondaryBtn{
      width:62%;
      min-width:200px;
      height:39px;
      border:0;
      background:#84cdc9;;
      color:#fff;
      font-size:14px;
      font-weight:500;
      cursor:pointer;
      display:block;
      margin:0 auto;
      font-family:'Pretendard', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans KR", sans-serif;
    }

    .authSecondaryBtn{
      background:#fff;
      color:#111111cc;
      border:1px solid #d9d9d9;
      margin-top:10px;
    }

    .loginErrorText{
      min-height:20px;
      margin:15px 0 0;
      text-align:center;
      font-size:11px;
      color:#d66068bc;
      visibility:hidden;
      font-family:'Pretendard', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans KR", sans-serif;
      white-space:pre-line;
    }

    .loginErrorText.show{ visibility:visible; }

    .authPageTitle{
      width:100%;
      margin:0 0 20px;
      font-size:18px;
      font-weight:500;
      letter-spacing:-0.04em;
      color:#111;
      text-align:center;
    }

    .authPageDesc{
      width:100%;
      margin:0 0 25px;
      font-size:10px;
      line-height:1.6;
      color:#666666b8;
      text-align:center;
    }

    .authBackLink{
      display:block;
      margin-top:18px;
      text-align:center;
      font-size:12px;
      color:#111;
      text-decoration:none;
      font-weight:500;
    }

    .authInfoBox{
      width:100%;
      padding:14px 16px;
      border:1px solid #e5e5e5;
      background:#fafafa;
      color:#333;
      font-size:12px;
      line-height:1.6;
      margin-bottom:18px;
    }

    .nImgPreviewBox{
      width:120px;
      height:120px;
      margin-top:10px;
      border:1px solid #e5e5e5;
      background:#f7f7f7;
      overflow:hidden;
      display:flex;
      align-items:center;
      justify-content:center;
    }

    .nImgPreviewBox img{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
    }

    .shopSection{
      position:relative;
      left:50%;
      width:100vw;
      margin-left:-50vw;
      margin-bottom:20px;
      padding:0;
      background: #e4f3f3e6;
      overflow:hidden;
    }

    .shopSection > *{
      width:min(calc(100% - 64px), 1040px);
      margin:0 auto;
    }

    
    .shopInner{
      padding:40px 0 40px;
    }

.shopHead{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      margin:4px 0 18px;
    }

    .shopTitle{
      margin:0;
      font-size:18px;
      font-weight:600;
      letter-spacing:-0.03em;
      color:#1f1f1f;
      line-height:1;
    }

    .shopLink{
      display:inline-flex;
      align-items:center;
      gap:6px;
      font-size:14px;
      font-weight:400;
      color:#1f1f1f;
      white-space:nowrap;
      letter-spacing:-0.02em;
      text-decoration:none;
    }

    .shopGrid{
      display:grid;
      grid-template-columns:repeat(3, minmax(0, 1fr));
      gap:30px;
      align-items:start;
    }

    .shopCard{
      border:0;
      background:transparent;
      padding:0;
      text-align:center;
      cursor:pointer;
      display:flex;
      flex-direction:column;
      align-items:center;
      gap:10px;
    }
    /* 와인박스(1구)만 여백 */
.shopCard[data-name="와인박스(1구)"]{
  margin-bottom:20px;
}

    .shopThumb{
      width:100%;
      aspect-ratio:1 / 1;
      background:#fff;
      border:1px solid #d8d8d8;
      display:flex;
      align-items:center;
      justify-content:center;
      overflow:hidden;
    }

    .shopThumb img{
      width:100%;
      height:100%;
      object-fit:contain;
      display:block;
    }

    .shopMeta{
      display:flex;
      flex-direction:column;
      align-items:center;
      gap:2px;
    }

    .shopName{
      font-size:14px;
      line-height:1.35;
      color:#111;
      font-weight:500;
      word-break:keep-all;
    }

    .shopPrice{
      font-size:15px;
      line-height:1.2;
      color:#111;
      font-weight:700;
      letter-spacing:-0.02em;
    }

    .catalogDetailTitle{
  display:flex;
  align-items:center;
  margin:0;
}

.catalogTitleKr{
  font-size:20px;
  font-weight:700;
  color:#111;
}

.catalogTitleDivider{
  font-size:18px;
  color:#999;
  margin:0 8px;
}

.catalogTitleEn{
  font-size:14px;
  font-weight:400;
  color:#666;
}

@media (max-width:640px){
  .catalogTitleKr{ font-size:17px; }
  .catalogTitleDivider{ font-size:13px; }
  .catalogTitleEn{ font-size:11px; }
}

    @media (max-width: 1280px){
      .listGrid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
      .mainHomeBtns{ grid-template-columns:1fr 1fr 1fr; }
      .itemName{ font-size:28px; }
    }

    @media (max-width: 980px){
      .wrap{ width:min(calc(100% - 34px), var(--content-max)); }
      .row{ grid-template-columns:1fr; }
      .stock{ min-height:86px; }
      .listGrid{ grid-template-columns:1fr 1fr; }

      body.mode-request .list,
      body.mode-list .list,
      body.mode-admin .list{
        display:grid;
        grid-template-columns:1fr;
        gap:14px;
      }

      body.mode-request .row,
      body.mode-list .row,
      body.mode-admin .row{
        grid-template-columns:minmax(0, 1fr) 140px;
        gap:0px;
        align-items:stretch;
      }

      .mainHomeBtns{ grid-template-columns:1fr; }
      .mainHomeBtns.oneRole{ max-width:320px; width:72%; }
      .mainHomeBtn{ height:50px; min-height:40px; }
      .itemTop{ flex-direction:column; align-items:flex-start; }
      .statRow{ grid-template-columns:1fr 1fr; }
    }

    @media (max-width: 640px){
      :root{ --header-h:64px; --log-cols: 88px 72px 112px 110px 86px; }

      .wrap{ width:min(calc(100% - 28px), var(--content-max)); }

      .topbar{
        min-height:var(--header-h);
        gap:12px;
        margin-bottom:28px;
        padding:12px 0;
      }

      .brand{ margin-left:5px; }
      h1{ font-size:16px; max-width:52vw; }

      .search{ justify-content:flex-end; }
      .search input{ width:min(100px, 100%); height:30px; padding:0 10px; font-size:11px; }
      .pill{ height:30px; padding:0 12px; font-size:12px; }

      .section{ margin-top:28px; }
      .listGrid{ grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; }

      body.mode-request .list,
      body.mode-list .list,
      body.mode-admin .list{
        display:grid;
        grid-template-columns:1fr;
        gap:14px;
      }

      body.mode-request .row,
      body.mode-list .row,
      body.mode-admin .row{
        grid-template-columns:minmax(0, 1fr) 104px;
        gap:0px;
        align-items:stretch;
      }

      body.mode-request .card,
      body.mode-list .card,
      body.mode-admin .card{
        min-height:92px;
        padding:12px;
        gap:12px;
        flex-direction:row;
        align-items:center;
      }

      body.mode-request .thumb,
      body.mode-list .thumb,
      body.mode-admin .thumb{
        width:62px;
        height:62px;
        aspect-ratio:auto;
        flex:0 0 62px;
      }

      body.mode-request .meta,
      body.mode-list .meta,
      body.mode-admin .meta{
        width:100%;
        gap:6px;
        min-width:0;
      }

      body.mode-request .meta-bot,
      body.mode-list .meta-bot,
      body.mode-admin .meta-bot{
        width:100%;
        gap:8px;
        flex-direction:row;
        align-items:center;
        flex-wrap:wrap;
      }

      body.mode-request .meta-bot span,
      body.mode-request .delta,
      body.mode-list .meta-bot span,
      body.mode-list .delta,
      body.mode-admin .meta-bot span,
      body.mode-admin .delta{
        white-space:nowrap;
      }

      body.mode-request .title,
      body.mode-list .title,
      body.mode-admin .title{
        font-size:14px;
        line-height:1.35;
        white-space:normal;
        overflow:visible;
        text-overflow:unset;
        display:-webkit-box;
        -webkit-line-clamp:2;
        -webkit-box-orient:vertical;
      }

      body.mode-request .size,
      body.mode-list .size,
      body.mode-admin .size{
        font-size:11px;
        white-space:normal;
      }

      body.mode-request .stock,
      body.mode-list .stock,
      body.mode-admin .stock{
        min-height:92px;
        padding:10px 8px;
        font-size:16px;
      }

      body.mode-request .stock small,
      body.mode-list .stock small,
      body.mode-admin .stock small{
        font-size:10px;
      }

      .card{ padding:14px; min-height:96px; gap:14px; }
      .thumb{ width:78px; height:78px; }
      .title{ font-size:18px; }
      .size{ font-size:12px; }
      .stock{ min-height:96px; font-size:22px; }

      .paper-body{ padding:18px 16px 18px; }
      .imgRow{ gap:12px; padding-bottom:18px; }
      .imgBox{ width:calc(50% - 6px); }
      .itemName{ font-size:26px; }
      .sizePill{ font-size:12px; }
      .statRow{ grid-template-columns:minmax(0, 96px) minmax(0, 1fr); }
      .statValue::before{ display:block; height:22px; }
      .statLabel, .statValue{ min-height:56px; padding:0 4px; }
      .statLabel{ justify-content:center; }
      .statLabel .txt,
      .statValue,
      .statValue .unit{ white-space:nowrap; }
      .statValue{ font-size:22px; }

      .logBox{ margin:0; }
      @media (max-width: 640px){
  .logBox{
    overflow-x:auto;
    overflow-y:hidden;
  }

  .logMinWidth{
    min-width:max-content;
    width:max-content;
  }

  .logHead,
  .logRow,
  .requestTable .logHead,
  .requestTable .logRow{
    width:max-content;
  }
}
      .logHead > div, .logRow > div{ padding:0 12px; }
      .detailBrand{ font-size:20px; }
      .detailPaperBody{ padding:6px 16px 24px; }
      .detailAdminHero{
        grid-template-columns:1fr;
        gap:20px;
        padding:0 0 24px;
      }
      .detailAdminIntro{
        padding-top:4px;
      }
      .detailAdminName{ font-size:18px; }
      .detailAdminSize{ margin-top:12px; font-size:12px; }
      .detailLogoImage{ max-width:62px; }
      .detailLogoImage{ max-width:64px; }
      .detailImageFrame{
        padding:0;
        display:block;
      }
      .requestImgRow{
        gap:12px;
        padding:0;
        justify-content:flex-start;
        width:100%;
        margin-left:0;
      }
      .requestImgRow .requestImgBox + .requestImgBox{ padding-left:0; margin-left:0; }
      .requestImgBox{ width:calc(50% - 6px); }

      .detailSectionHead{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:6px;
        flex-wrap:nowrap;
        min-width:0;
      }

      .detailSectionHead .boxTitle{
        flex:1 1 auto;
        min-width:0;
        margin:0;
        font-size:14px;
        line-height:1.2;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
      }

      .requestAdminActions{
        display:flex;
        align-items:center;
        justify-content:flex-end;
        gap:4px;
        margin-left:auto;
        flex:0 0 auto;
        white-space:nowrap;
      }

      .requestAdminActions .btn,
      .requestAdminActions .dangerBtn,
      .requestAdminActions .selDelBtn,
      .requestAdminActions .reqApproveBtn,
      .requestAdminActions .reqRejectBtn{
        min-width:52px;
        height:28px;
        padding:0 8px;
        font-size:11px;
      }

      .logActionBtns{
        display:flex;
        align-items:center;
        justify-content:flex-end;
        gap:4px;
        margin-left:auto;
        flex:0 0 auto;
        white-space:nowrap;
      }

      .logActionBtns .btn,
      .logActionBtns .dangerBtn,
      .logActionBtns .selDelBtn{
        min-width:52px;
        height:28px;
        padding:0 8px;
        font-size:11px;
      }

      .adminBottomRow,
      .commonBottomRow{ align-items:flex-start; }

      .adminBottomRight,
      .commonBottomRight{
        width:100%;
        justify-content:flex-end;
        gap:4px;
        flex-wrap:nowrap;
      }

      .adminBottomRight .btn,
      .adminBottomRight .dangerBtn,
      .adminBottomRight .selDelBtn,
      .commonBottomRight .btn,
      .commonBottomRight .dangerBtn,
      .commonBottomRight .selDelBtn{
        min-width:52px;
        height:28px;
        padding:0 8px;
        font-size:11px;
      }

      .dangerBox{ flex-direction:column; align-items:flex-start; }
      .dangerBtn{ align-self:stretch; text-align:center; }

      .mainHome{ padding-top:150px; text-align:center;}
      .mainLogoArea{ min-height:90px; margin-bottom:30px; justify-content:center; }
      .mainLogoImg{ max-width:220px; max-height:82px; }
      .mainLogoPlaceholder{ width:220px; height:82px; font-size:13px; }
      .mainHomeTitle{ font-size:12px; margin-bottom:45px; }
      .mainHomeBtn{
        min-height:50px;
        font-size:14px;
        font-weight:500;
        padding:16px 16px;
        align-items:center;
        justify-content:center;
        text-align:center;
      }

      .catalogMenuSection{
        position:relative;
        left:50%;
        width:100vw;
        margin-left:-50vw;
        margin-bottom:22px;
        padding:0;
        background:#eeeeee95;
        overflow:hidden;
      }

      .catalogMenuSection > *{
        width:min(calc(100% - 28px), 800px);
        margin:0 auto;
      }

      .catalogMenuInner{
        padding:24px 0 28px;
      }

      .catalogMenuHead{
        margin-bottom:16px;
        gap:10px;
      }

      .catalogMenuTitleGroup{
        gap:8px;
      }

      .catalogMenuTitle{
        font-size:15px;
        margin:0;
      }

      .catalogMenuDivider{
        font-size:13px;
      }

      .catalogMenuTitleSub{
        font-size:13px;
      }

      .catalogMenuAction{
        font-size:12px;
        gap:4px;
      }

      .catalogMenuGrid{
        grid-template-columns:repeat(3, minmax(0, 1fr));
        gap:10px;
      }

      .catalogMenuCard{
        gap:8px;
      }

      .catalogMenuLabel{
        min-height:30px;
        font-size:11px;
        line-height:1.16;
        letter-spacing:-0.03em;
        white-space:normal;
        word-break:keep-all;
        overflow-wrap:break-word;
        color: #292929;
        margin-top:0.2px;
      }

      .catalogDetailPage{ width:100%; }
      .catalogDetailTop{ margin-bottom:28px; }
      .catalogDetailTitle{ font-size:17px; }
      .catalogDetailSub{ font-size:11px; padding-top:3px; font-weight:400; color: #555555; }
      .catalogDetailFields{ grid-template-columns:110px minmax(0, 1fr); gap:12px; margin-bottom:12px; }
      .catalogDetailControlRow{
        grid-template-columns:repeat(3, minmax(0, 1fr));
        gap:8px;
        align-items:stretch;
        margin-bottom:16px;
      }
      .catalogDetailAction{
        grid-column:1 / -1;
      }
      .catalogSelectWrap,
      .catalogDetailAction{
        width:100%;
      }
      .catalogSelect{ height:42px; padding:0 36px 0 14px; font-size:13px; }
      .catalogSelectArrow{ right:12px; font-size:12px; }
      .catalogStockRow{ grid-template-columns:120px minmax(0, 1fr); min-height:52px; }
      .catalogStockLabel, .catalogStockValue{ min-height:52px; font-size:13px; }
      .catalogStockValue{ font-size:15px; }
      .catalogStockBox{ margin-bottom:14px; }
      .catalogDetailSubmit{
        width:100%;
        height:52px;
        font-size:15px;
      }
      .catalogGalleryGrid{
        grid-template-columns:repeat(3, minmax(0, 1fr));
        gap:8px;
        margin-bottom:22px;
      }

      .stockCard{
        padding:12px;
        grid-template-columns:52px minmax(0, 1fr);
        column-gap:10px;
        min-height:88px;
      }

      .stockThumb{
        width:52px;
        height:52px;
        flex-basis:52px;
      }

      .stockMeta{ gap:8px; }
      .stockName{ font-size:12px; }

      .stockQtyBar{
        min-height:34px;
        padding:0 8px;
        font-size:11px;
      }

      .fab{ right:16px; bottom:16px; height:44px; }
      .authDialog{ width:min(92vw, 360px); padding:20px 18px 16px; }
      .authTitle{ font-size:17px; }
      .authBtn{ min-width:92px; height:42px; font-size:13px; }

      .shopSection{
        position:relative;
        left:50%;
        width:100vw;
        margin-left:-50vw;
        margin-bottom:22px;
        padding:0;
        background: #e4f3f3e6;
        overflow:hidden;
      }

      .shopSection > *{
        width:min(calc(100% - 28px), 800px);
        margin:0 auto;
      }

      .shopInner{
        padding:24px 0 28px;
      }

      .shopHead{
        margin-bottom:16px;
        gap:10px;
      }

      .shopTitle{
        font-size:15px;
      }

      .shopLink{
        font-size:12px;
        gap:4px;
      }

      .shopGrid{
        gap:12px;
      }

      .shopCard{
        gap:8px;
      }

      .shopName{
        font-size:11px;
      }

      .shopPrice{
        font-size:12px;
      }
    }

    .reqApproveBtn{
      background:rgba(37, 99, 235, 0.15);
      border-color:#2563eb;
      color:#2563eb;
    }

    .reqApproveBtn:hover{
      background:rgba(37, 99, 235, 0.25);
      border-color:#2563eb;
      color:#2563eb;
    }

    .reqRejectBtn{
      background:rgba(198, 62, 62, 0.15);
      border-color:#c63e3e;
      color:#c63e3e;
    }

    .reqRejectBtn:hover{
      background:rgba(198, 62, 62, 0.25);
      border-color:#c63e3e;
      color:#c63e3e;
    }

    .addLogBtn{
      background:rgba(37, 99, 235, 0.15);
      border-color:#2563eb;
      color:#2563eb;
    }

    .addLogBtn:hover{
      background:rgba(37, 99, 235, 0.25);
      border-color:#2563eb;
      color:#2563eb;
    }

    body.auth-page{
      padding-bottom:0 !important;
      overflow:hidden;
    }

    html.auth-page{
      overflow:hidden;
    }

    body.auth-page .wrap{
      padding-bottom:0 !important;
    }

    @media (max-width: 768px){
      body.auth-page,
      html.auth-page{
        height:100%;
        overflow:hidden;
      }

      body.auth-page .wrap,
      body.auth-page #app{
        min-height:100dvh;
      }

      body.auth-page .loginScreen{
        min-height:100dvh;
        height:100dvh;
        padding:48px 16px 8px !important;
        align-items:center;
        box-sizing:border-box;
        overflow:hidden;
      }

      body.auth-page .loginWrap{
        width:min(100%, 360px);
        max-width:360px;
        margin:0 auto;
      }

      body.auth-page .loginForm,
      body.auth-page .signupForm,
      body.auth-page .findIdForm,
      body.auth-page .resetPwForm{
        margin-top:0 !important;
        padding-bottom:0 !important;
      }
    }
/* ===== SHOP 구매 페이지 ===== */
.shopHomeBtn{
  background:#ffffff;
  color:#111;
  border:1px solid #e2e2e2;
}

body.mode-shop .topbar.no-search,
body.mode-request .topbar.no-search{
  border-bottom:none !important;
}

.shopPage{
  width:min(100%, 760px);
  margin:0 auto;
  padding:18px 0 80px;
}

.shopPageHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin:0 0 42px;
}

.shopPageTitle{
  font-size:12px;
  font-weight:700;
  letter-spacing:-0.02em;
  color:#111;
}

.shopPageIcons{
  display:flex;
  align-items:center;
  gap:10px;
}

.shopIconBtn{
  position:relative;
  border:0;
  background:transparent;
  color:#999;
  font-size:15px;
  cursor:pointer;
  padding:0;
  line-height:1;
}

.shopIconBtn span{
  position:absolute;
  right:-8px;
  top:-9px;
  min-width:14px;
  height:14px;
  padding:0 4px;
  border-radius:999px;
  background:#84cdc9;
  color:#fff;
  font-size:9px;
  line-height:14px;
  font-weight:700;
}

.shopProductGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:42px 50px;
}

.shopProductCard{
  border:0;
  background:transparent;
  padding:0;
  text-align:left;
  cursor:pointer;
}

.shopProductThumb{
  width:100%;
  aspect-ratio:1 / 1;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  margin-bottom:18px;
  overflow:hidden;
}

.shopProductThumb img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}

.shopReadyIcon{
  width:74%;
  height:74%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fafafa;
  color:#c9c9c9;
  font-size:58px;
  font-weight:100;
}

.shopProductName,
.shopDetailName,
.shopCartName{
  font-size:11px;
  font-weight:500;
  color:#111;
  line-height:1.35;
  letter-spacing:-0.02em;
}

.shopProductColor,
.shopDetailColor,
.shopCartColor,
.shopDetailsText{
  font-size:10px;
  color:#666;
  line-height:1.6;
}

.shopProductPrice,
.shopDetailPrice,
.shopCartUnit,
.shopCartPrice{
  font-size:11px;
  font-weight:800;
  color:#111;
  line-height:1.5;
}

.shopDetailPage{
  max-width:520px;
}

.shopDetailHero{
  width:100%;
}

.shopDetailImg{
  width:100%;
  aspect-ratio:1 / 1;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 24px;
  overflow:hidden;
}

.shopDetailImg img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}

.shopDetailInfo{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  margin-bottom:12px;
}

.shopOptionSelect{
  width:100%;
  height:30px;
  border:1px solid #d9d9d9;
  background:#fff;
  font-size:10px;
  color:#555;
  padding:0 10px;
  outline:none;
  border-radius:0;
}

.shopDetailActions{
  display:grid;
  grid-template-columns:1fr 86px;
  gap:8px;
  margin:12px 0 44px;
}

.shopBuyBtn,
.shopOrderBtn{
  height:34px;
  border:0;
  background:#84cdc9;
  color:#fff;
  font-size:10px;
  font-weight:800;
  cursor:pointer;
}

.shopCartBtn{
  height:34px;
  border:1px solid #d9d9d9;
  background:#fff;
  color:#333;
  font-size:10px;
  font-weight:700;
  cursor:pointer;
}

.shopDetailsBlock{
  border-top:1px solid #d9d9d9;
  padding-top:18px;
}

.shopDetailsTitle{
  font-size:10px;
  font-weight:800;
  color:#555;
  margin-bottom:8px;
}

.shopCartPage{
  max-width:620px;
}

.shopCartList{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.shopCartRow{
  position:relative;
  display:grid;
  grid-template-columns:96px minmax(0, 1fr) auto;
  align-items:center;
  gap:18px;
  border:1px solid #e0e0e0;
  padding:18px;
  min-height:126px;
}

.shopCartRemove{
  position:absolute;
  right:12px;
  top:8px;
  border:0;
  background:transparent;
  color:#777;
  font-size:14px;
  cursor:pointer;
}

.shopCartThumb{
  width:96px;
  height:96px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.shopCartThumb img{
  width:100%;
  height:100%;
  object-fit:contain;
}

.shopQtyControl{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:6px;
  font-size:10px;
}

.shopQtyControl button{
  width:16px;
  height:16px;
  border:1px solid #ddd;
  background:#fff;
  line-height:1;
  font-size:10px;
  cursor:pointer;
}

.shopCartEmpty{
  padding:60px 0;
  text-align:center;
  color:#777;
  font-size:12px;
}

.shopOrderBtn{
  display:block;
  width:180px;
  margin:34px 0 0 auto;
}

@media (max-width:640px){
  .shopPage{
    width:100%;
    padding:18px 12px 72px;
  }

  .shopPageHead{
    margin-bottom:34px;
  }

  .shopProductGrid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:36px 28px;
  }

  .shopDetailPage,
  .shopCartPage{
    max-width:100%;
  }

  .shopCartRow{
    grid-template-columns:82px minmax(0, 1fr) auto;
    gap:12px;
    padding:16px 14px;
  }

  .shopCartThumb{
    width:82px;
    height:82px;
  }

  .shopOrderBtn{
    width:160px;
  }
}


/* ===== SHOP 상세 PC 레이아웃 최종 보정 ===== */
@media (min-width: 769px){
  .shopPage{
    width:min(calc(100% - 48px), 1040px) !important;
    max-width:1040px !important;
    margin:0 auto !important;
    padding:18px 0 80px !important;
  }

  .shopDetailPage{
    max-width:1040px !important;
  }

  .shopDetailHero{
    display:grid !important;
    grid-template-columns:minmax(360px, 1.05fr) minmax(330px, .95fr) !important;
    grid-template-areas:
      "image info"
      "image option"
      "image actions"
      "details details" !important;
    column-gap:72px !important;
    row-gap:12px !important;
    align-items:start !important;
    width:100% !important;
  }

  .shopDetailImg{
    grid-area:image !important;
    width:100% !important;
    max-width:430px !important;
    aspect-ratio:1 / 1 !important;
    margin:0 !important;
    justify-content:flex-start !important;
  }

  .shopDetailImg img{
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
  }

  .shopDetailInfo{
    grid-area:info !important;
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) auto !important;
    gap:16px !important;
    align-items:start !important;
    margin:172px 0 0 !important;
  }

  .shopOptionSelect{
    grid-area:option !important;
    width:100% !important;
    height:34px !important;
  }

  .shopDetailActions{
    grid-area:actions !important;
    display:grid !important;
    grid-template-columns:1fr 120px !important;
    gap:12px !important;
    margin:0 !important;
  }

  .shopBuyBtn,
  .shopCartBtn{
    height:38px !important;
  }

  .shopDetailsBlock{
    grid-area:details !important;
    width:100% !important;
    margin-top:54px !important;
  }
}

@media (max-width:768px){
  .shopDetailHero{
    display:block !important;
  }

  .shopDetailInfo{
    margin-bottom:12px !important;
  }

  .shopDetailActions{
    margin:12px 0 44px !important;
  }
}


/* 신청하기/리스트/관리자 화면에서는 SHOP 영역 숨김 */
body.mode-request .shopSection,
body.mode-list .shopSection,
body.mode-admin .shopSection{
  display:none !important;
}


/* 검색 아이콘형 디자인 */
.search{
  position:relative;
}

.search input{
  border:none !important;
  border-bottom:1px solid #ccc !important;
  padding:0 30px 6px 0 !important;
  width:140px;
  background:transparent;
}

.searchIcon{
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%);
  width:18px;
  height:18px;
  background:url('https://cdn-icons-png.flaticon.com/512/622/622669.png') no-repeat center/contain;
  opacity:0.6;
  cursor:pointer;
}

/* ===== SHOP 상단바 - 첨부 시안 반영 ===== */
body.mode-shop .wrap{
  width:min(calc(100% - 52px), 1040px);
}

body.mode-shop .topbar{
  min-height:52px;
  padding:20px 0 6px;
  margin:0;
  align-items:flex-start;
  border-bottom:none !important;
  background:#fff;
}

body.mode-shop .brand{
  margin-left:0;
  align-items:flex-start;
}

body.mode-shop h1#topTitle{
  font-family:Georgia, 'Times New Roman', serif;
  font-size:16px;
  line-height:1;
  font-weight:400;
  letter-spacing:-0.05em;
  color:#b7b2ad;
}

body.mode-shop .search{
  flex:0 0 auto;
  width:74px;
  height:20px;
  margin-left:auto;
  margin-right:0;
  gap:0;
  justify-content:flex-end;
}

body.mode-shop .search input{
  width:74px !important;
  height:20px;
  padding:0 17px 3px 0 !important;
  border:0 !important;
  border-bottom:1px solid #e2e0dd !important;
  background:transparent !important;
  box-shadow:none !important;
  font-size:0;
}

body.mode-shop .searchIcon{
  width:11px;
  height:11px;
  right:2px;
  top:8px;
  opacity:.58;
  filter:grayscale(1);
}

body.mode-shop .topbarLogo{
  display:none !important;
}

body.mode-shop .shopPage{
  padding-top:14px;
}

body.mode-shop .shopPageHead{
  margin:0 0 42px;
  min-height:24px;
  align-items:center;
}

body.mode-shop .shopPageTitle{
  display:flex;
  align-items:center;
  gap:7px;
  color:#222;
  letter-spacing:-0.02em;
  line-height:1;
}

body.mode-shop .shopPageTitle strong{
  font-size:13px;
  font-weight:700;
}

body.mode-shop .shopPageTitle span{
  font-size:12px;
  color:#111;
  font-weight:300;
  transform:translateY(-.5px);
}

body.mode-shop .shopPageTitle em{
  font-style:normal;
  font-size:10px;
  font-weight:400;
  color:#333;
}

body.mode-shop .shopPageIcons{
  gap:14px;
  padding-right:2px;
}

body.mode-shop .shopIconBtn{
  width:16px;
  height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#8b8782;
}

body.mode-shop .shopIconBtn svg{
  width:16px;
  height:18px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:1.25;
  stroke-linecap:round;
  stroke-linejoin:round;
}

body.mode-shop .shopIconBtn span{
  right:-7px;
  top:-8px;
}

@media (max-width:640px){
  body.mode-shop .wrap{
    width:calc(100% - 36px);
  }

  body.mode-shop .topbar{
    padding-top:18px;
  }

  body.mode-shop h1#topTitle{
    font-size:15px;
  }

  body.mode-shop .shopPage{
    padding-left:0;
    padding-right:0;
  }
}


@media (max-width:640px){
  .topLogo{
    height:19px;
    max-width:130px;
  }
  .catalogTopSearch{
    width:104px !important;
    height:30px;
    padding:0 28px 6px 0 !important;
  }
  body.mode-request .topbarLogo{
    min-width:104px;
  }
  .catalogDetailMeta{
    margin-bottom:28px;
  }
}


/* ===== 요청 반영: 도록/신청 상단 검색 디자인 통일 + 상단 선 제거 ===== */
body.mode-request .topbar,
body.mode-request .topbar.no-search,
body.mode-shop .topbar,
body.mode-shop .topbar.no-search{
  border-bottom:none !important;
  box-shadow:none !important;
}

body.mode-request .topbarLogo:has(.catalogTopSearch){
  display:flex !important;
  align-items:center;
  justify-content:flex-end;
}

body.mode-request .topbarLogo:has(.catalogTopSearch) img{
  display:none !important;
}

/* ===== 도록 신청하기 페이지: 요청 디자인 반영 v3 ===== */
body.mode-request .wrap{
  width:min(calc(100% - 80px), 1040px);
}

.catalogDetailPage{
  width:100%;
  max-width:980px;
  margin:0 auto;
  padding-top:18px;
}

.catalogDetailTop{
  margin-bottom:30px;
}

.catalogDetailTitle{
  display:flex;
  align-items:center;
  gap:18px;
  margin:0;
  line-height:1;
  letter-spacing:-0.04em;
}

.catalogTitleKr{
  font-size:28px;
  font-weight:800;
  color:#000;
}

.catalogTitleDivider{
  font-size:22px;
  font-weight:500;
  color:#111;
  transform:translateY(-1px);
}

.catalogTitleEn{
  font-size:18px;
  font-weight:400;
  color:#111;
  letter-spacing:-0.03em;
}

.catalogControlLabel{
  margin:0 0 10px;
  font-size:16px;
  font-weight:400;
  color:#111;
}

.catalogDetailControlRow{
  display:grid;
  grid-template-columns:200px 200px 200px 182px;
  gap:18px;
  align-items:center;
  margin-bottom:48px;
}

.catalogSelect{
  height:54px;
  padding:0 48px 0 26px;
  border:1px solid #bdbdbd;
  background:#fff;
  color:#111;
  font-size:18px;
  font-weight:400;
}

.catalogSelectArrow{
  right:16px;
  font-size:22px;
  color:#5a5a5a;
}

.catalogDetailSubmit{
  width:100%;
  height:54px;
  border:0;
  background:#3c3c3c;
  color:#fff;
  font-size:18px;
  font-weight:400;
}

.catalogGalleryTitle{
  margin:0 0 8px 0;
  font-size:11px;
  font-weight:600;
  color:#555;
}

.catalogGalleryGrid{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:24px 28px;
  margin:0 0 24px;
}

.catalogGalleryItem{
  aspect-ratio:3/4;
  border:1px solid #e4e4e4;
  background:#f4f4f4;
}

.catalogGalleryItem img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.catalogGalleryPlaceholder{
  color:#b5b5b5;
  font-size:11px;
}

.catalogSelectedDetail{
  display:grid;
  grid-template-columns:250px 1fr 182px;
  column-gap:46px;
  align-items:end;
  margin:0 0 52px;
}

.catalogSelectedImage{
  width:250px;
  aspect-ratio:3/4;
  background:#f4f4f4;
  overflow:hidden;
}

.catalogSelectedImage img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.catalogSelectedInfo{
  padding-bottom:0;
  min-width:0;
}

.catalogSelectedYear{
  font-size:18px;
  line-height:1.2;
  color:#111;
  font-weight:400;
  margin-bottom:8px;
}

.catalogSelectedTitle{
  font-size:22px;
  line-height:1.35;
  color:#111;
  font-weight:400;
  letter-spacing:-0.04em;
  margin-bottom:26px;
}

.catalogSelectedStock{
  width:365px;
  max-width:100%;
  height:54px;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  border:0;
  background:#f6f6f6;
  color:#111;
  font-family:inherit;
  font-size:16px;
  font-weight:400;
  cursor:pointer;
  padding:0;
}

.catalogSelectedStock span{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:54px;
  position:relative;
}

.catalogSelectedStock span + span::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:1px;
  height:22px;
  background:#9b9b9b;
  transform:translateY(-50%);
}

.catalogSelectedDetail + .detailSectionBlock{
  margin-top:0;
}

.detailSectionBlock{
  width:100%;
  max-width:980px;
  margin:0 auto;
}

.detailSectionHead{
  margin:0 0 10px;
}

.detailSectionHead .boxTitle{
  font-size:16px;
  font-weight:700;
  color:#666;
}

.requestAdminActions .selDelBtn{
  width:96px;
  height:36px;
  font-size:13px;
  background:#fff;
}

.requestLogBox{
  border:1px solid #ddd;
}

.requestTable .logHead{
  min-height:58px;
  background:#f7f7f7;
}

.requestTable .logHead,
.requestTable .logRow{
  grid-template-columns:170px 120px 170px 160px 170px 120px;
}

.requestTable .headerFilterDate,
.requestTable .headerFilterSelect{
  height:38px;
  border:1px solid #ddd;
  border-radius:0;
  background:#fff;
  font-size:13px;
  font-weight:600;
}

.requestTable .logEmpty{
  padding:22px 24px;
  min-height:58px;
  font-size:12px;
  color:#666;
  background:#fff;
}

@media (max-width: 760px){
  body.mode-request .wrap{
    width:min(calc(100% - 32px), 1040px);
  }
  .catalogTitleKr{font-size:24px;}
  .catalogTitleEn{font-size:14px;}
  .catalogDetailControlRow{
    grid-template-columns:1fr;
    gap:10px;
    margin-bottom:32px;
  }
  .catalogSelect,
  .catalogDetailSubmit{
    height:48px;
    font-size:15px;
  }
  .catalogGalleryGrid{
    grid-template-columns:repeat(2, 1fr);
    gap:18px;
  }
  .catalogSelectedDetail{
    grid-template-columns:1fr;
    gap:24px;
    align-items:start;
  }
  .catalogSelectedImage{
    width:min(70vw, 260px);
  }
  .catalogSelectedTitle{font-size:19px;}
  .catalogSelectedStock{width:100%;}
  .requestTable .logHead,
  .requestTable .logRow{
    grid-template-columns:130px 100px 130px 120px 130px 100px;
  }
}