#searchDialog{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.2);padding:24px;color:#0D0D0D}
#searchDialog[hidden]{display:none}
.gs-panel{width:680px;height:600px;max-width:100%;max-height:calc(100dvh - 48px);padding:24px;border-radius:12px;background:#fff;box-shadow:0 2px 8px #00000038;display:flex;flex-direction:column;gap:16px;overflow:hidden}
.gs-header{display:flex;align-items:center;gap:8px;flex-shrink:0}
.gs-field{display:flex;flex:1;min-width:0;align-items:center;background:#F7F6F2;border:1px solid #D9D8D3;border-radius:9999px;padding:4px 12px}
.gs-field:focus-within{border-color:#19DFDF}
#gsInput{width:100%;min-width:0;background:none;border:0;outline:none;padding:4px 0;height:32px;font:400 15px/24px Pretendard,sans-serif;color:#0D0D0D}
#gsInput::placeholder{color:#888780}
.gs-icon{width:32px;height:32px;flex-shrink:0;display:grid;place-items:center;padding:4px;background:none;border:0;color:#666560;border-radius:9999px;cursor:pointer}
.gs-icon svg{width:20px;height:20px;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.gs-filters{display:flex;gap:12px}
.gs-languages{display:flex;gap:8px;flex-shrink:0;border-bottom:1px solid #EDECE8;padding-bottom:12px}
.gs-language{min-height:44px;flex:1;padding:8px 16px;border:1px solid #D9D8D3;border-radius:8px;background:#fff;color:#666560;font:600 15px/24px Pretendard,sans-serif;cursor:pointer}
.gs-language[aria-pressed=true]{color:#066666;border-color:#12CECE;background:#E6FAFA}
.gs-en-art{display:flex;align-items:center;overflow:hidden}
.gs-en-art>.enc-art{width:36px}
.gs-filter{padding:4px 12px;border-radius:9999px;background:white;border:1px solid #D9D8D3;color:#666560;font:500 15px/24px Pretendard,sans-serif;cursor:pointer}
.gs-filter[aria-pressed=true]{background:#666560;border-color:#666560;color:white}
.gs-results{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}
.gs-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 8px;border-bottom:1px solid #EDECE8;text-decoration:none;color:inherit}
.gs-row:hover{background:#F7F6F2}
.gs-thumb{width:36px;height:50px;object-fit:contain}
.gs-name{font-size:15px;font-weight:600;line-height:24px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere}
.gs-meta{font-size:14px;line-height:20px;color:#888780;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gs-price{font-size:14px;font-weight:600;white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}
.gs-state{padding:24px 8px;color:#888780;font-size:14px;text-align:center;line-height:24px;overflow-wrap:anywhere}
.gs-count{font-size:12px;color:#888780;line-height:16px;flex-shrink:0}
#searchDialog :is(button,a):focus-visible{outline:2px solid #066666;outline-offset:2px}
@media(max-width:768px){#searchDialog{align-items:flex-end;padding:60px 0 0}.gs-panel{width:100%;height:calc(100dvh - 60px);max-height:calc(100dvh - 60px);border-radius:20px 20px 0 0;padding:20px 16px calc(16px + env(safe-area-inset-bottom));gap:16px;animation:searchSlide .2s ease-out}#gsInput{font-size:16px}.gs-icon{width:36px;height:36px}.gs-filter{min-height:40px}.gs-row{gap:8px;padding:12px 0}.gs-price{max-width:104px}.gs-meta{font-size:14px}@keyframes searchSlide{from{transform:translateY(100%)}to{transform:translateY(0)}}}
@media(max-width:360px){.gs-row{grid-template-columns:36px minmax(0,1fr)}.gs-price{grid-column:2;text-align:left;max-width:none}.gs-header{gap:4px}}
@media(prefers-reduced-motion:reduce){.gs-panel{animation:none}}
/* Keep complete card artwork readable on narrow search screens. */
#searchDialog .gs-card-art{display:block;position:relative;overflow:hidden}
#searchDialog .gs-card-art>img{display:block;width:100%;height:100%;object-fit:inherit}

@media(max-width:768px){
  #searchDialog .gs-row{grid-template-columns:96px minmax(0,1fr);column-gap:12px;row-gap:4px}
  #searchDialog .gs-thumb{width:96px;height:134px;object-fit:contain;grid-row:1/3}
  #searchDialog .gs-row>div{min-width:0}
  #searchDialog .gs-price{grid-column:2;text-align:left;max-width:none}
  #searchDialog .gs-card-art>img{position:absolute;width:var(--gs-art-width);height:var(--gs-art-height);left:var(--gs-art-left);top:var(--gs-art-top);max-width:none;max-height:none;object-fit:fill}
  #searchDialog .gs-en-art{height:auto;aspect-ratio:320/448}
  #searchDialog .gs-en-art>.enc-art{width:100%}
}
