/* Step 8 polish (impeccable polish, emil-design-eng, make-interfaces-feel-better). Details only; no new layout or colour decisions. */

/* Image outlines: neutral alpha only (no brand tint). */
.cover { filter: drop-shadow(0 0 1px rgba(255, 255, 255, .22)) drop-shadow(0 6px 9px rgba(0, 0, 0, .45)); }
@media (prefers-color-scheme: light) {
  .cover { filter: drop-shadow(0 0 1px rgba(0, 0, 0, .35)) drop-shadow(0 6px 9px rgba(35, 26, 20, .26)); }
}

/* Text wrapping: short body text and captions avoid one-word last lines; headings already balance. */
.lede, .meta, .buy-note, .fake-banner, .notice-box p, .book-author, .state { text-wrap: pretty; }

/* Tabular numerals wherever a number can change or line up. */
.cart-n, .sum-total, .prices dd, .state, .n, .price, .bar-track + .meta { font-variant-numeric: tabular-nums; }

/* Press: a tactile 2% sink instead of a 1px shove. */
.btn:active { transform: scale(.98); }
.btn[disabled]:active { transform: none; }
@media (prefers-reduced-motion: reduce) { .btn:active { transform: none; } }

/* The one place gold shows up in text-selection: matches the buy button. Reader keeps its own selection colour. */
body:not(.rd) ::selection { background: var(--accent); color: var(--on-accent); }

/* Anchors (library tabs, #hash links) land below the header instead of under it. */
html { scroll-padding-top: var(--s-5); }

/* W15 prices: 정가 / 소장 / 7일 대여 stacked on cards, plain line on the book page */
.price .pr { display: block; }
.list-price { margin: 0 0 var(--s-2); font-size: var(--fs-14); color: var(--ink-2); font-variant-numeric: tabular-nums; }

/* W16 inquiry form */
.inquiry { max-width: 640px; }
.inquiry .field { max-width: none; }
.field select, .field textarea { padding: var(--s-3) var(--s-4); border: 1px solid var(--ink-3); border-radius: var(--radius-btn); background: var(--wall); font: inherit; font-size: var(--fs-16); color: var(--ink); }
.field select { height: 48px; padding-top: 0; padding-bottom: 0; }
.field textarea { resize: vertical; min-height: 96px; }
.field .err { font-size: var(--fs-12); color: var(--ink); font-weight: 600; min-height: 0; }
.field .err:empty { display: none; }
.hp { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.notice { background: var(--notice-bg); border: 1px solid var(--rule); border-radius: 2px; padding: var(--s-3) var(--s-4); margin: var(--s-2) 0 var(--s-4); font-size: var(--fs-14); color: var(--ink); }
.notice h2 { font-size: var(--fs-14); margin: 0 0 var(--s-2); }
.notice-list { margin: 0; padding-left: 1.2em; display: grid; gap: var(--s-1); }
.inquiry .buy-note { margin: var(--s-3) 0; }
/* phone: three prices in a search/category row wrap instead of running past the edge */
.row .prices { flex-wrap: wrap; row-gap: var(--s-1); }
@media (max-width: 720px) { .row .prices { column-gap: var(--s-3); min-width: 0; } .row .prices div { min-width: 0; } }

/* W17 login: link-style buttons (sign up / forgot password); hidden wins inside the login and inquiry forms */
.login [hidden], .inquiry [hidden] { display: none !important; } /* scoped: other pages rely on their own display rules */
button.text-link { background: none; border: 0; padding: var(--s-2) 0; min-height: 44px; font: inherit; font-size: var(--fs-14); color: var(--ink); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.login-links { display: flex; flex-wrap: wrap; gap: 0 var(--s-5); margin: var(--s-3) 0 0; }
.login .btn-buy[type="submit"] { margin-top: var(--s-2); }
.login-methods .soon { font-size: var(--fs-12); font-weight: 400; margin-left: var(--s-1); }
.login .field { margin-bottom: var(--s-3); }
.login .buy-note { margin-top: var(--s-4); }
.login-methods { margin-bottom: var(--s-5); }
