:root { color: #1a1a1a; background: #f8f8f8; font-family: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", sans-serif; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100dvh; }
button { font: inherit; }
.page { min-height: 100dvh; padding: calc(env(safe-area-inset-top, 0px) + 24px) 20px calc(env(safe-area-inset-bottom, 0px) + 36px); }
.brand { color: #ff532c; font-size: 20px; font-weight: 700; letter-spacing: -0.07em; text-decoration: none; }
.header { align-items: center; display: flex; justify-content: space-between; }
.header-label { color: #909090; font-size: 12px; font-weight: 600; }
.collection-info { margin-top: 46px; }
.owner { color: #ff532c; font-size: 14px; font-weight: 700; letter-spacing: -0.02em; margin: 0; }
h1 { color: #1a1a1a; font-size: 28px; font-weight: 700; letter-spacing: -0.04em; line-height: 1.35; margin: 8px 0 0; word-break: keep-all; }
.meta { color: #777; font-size: 13px; font-weight: 500; letter-spacing: -0.02em; line-height: 1.5; margin: 12px 0 0; }
.book-panel { background: #fff; border-radius: 16px; box-shadow: 0 3px 14px rgb(0 0 0 / 3.5%); margin-top: 30px; padding: 16px; }
.book-panel h2 { font-size: 15px; font-weight: 700; letter-spacing: -0.03em; margin: 0; }
.books { column-gap: 12px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; margin: 16px 0 0; padding: 0; row-gap: 22px; }
.cover { aspect-ratio: .68; border-radius: 4px; box-shadow: 0 4px 12px rgb(0 0 0 / 12%); display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; padding: 12px 9px; }
.cover-brand { font-size: 9px; font-weight: 600; opacity: .78; }
.cover-title { font-size: 15px; font-weight: 700; letter-spacing: -0.04em; line-height: 1.35; word-break: keep-all; }
.cover-author { font-size: 10px; opacity: .85; }
.book-title, .book-author { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.book-title { color: #303030; font-size: 13px; font-weight: 600; letter-spacing: -0.03em; line-height: 1.45; margin: 10px 0 0; }
.book-author { color: #777; font-size: 12px; font-weight: 500; letter-spacing: -0.03em; line-height: 1.45; margin: 2px 0 0; }
.footer { color: #969696; font-size: 12px; font-weight: 500; margin: 26px 0 0; text-align: center; }
.status-page { align-items: stretch; display: flex; flex-direction: column; }
.status-content { align-items: center; display: flex; flex: 1; flex-direction: column; justify-content: center; text-align: center; }
.status-content p { color: #777; font-size: 14px; font-weight: 500; letter-spacing: -0.02em; line-height: 1.5; margin: 6px 0 0; }
.spinner { animation: spin .8s linear infinite; border: 3px solid #ffe4de; border-radius: 50%; border-top-color: #ff532c; height: 30px; margin-bottom: 18px; width: 30px; }
.open-page { background: #ff532c; color: #fff; display: flex; flex-direction: column; }
.open-page .brand, .open-page h1 { color: #fff; }
.open-copy { display: flex; flex: 1; flex-direction: column; justify-content: center; }
.open-eyebrow { font-size: 15px; font-weight: 600; margin: 0; opacity: .82; }
.open-copy h1 { margin-top: 10px; }
.open-description { font-size: 15px; font-weight: 500; letter-spacing: -0.02em; line-height: 1.55; margin: 14px 0 0; opacity: .9; }
.store-button { background: #fff; border: 0; border-radius: 8px; color: #ff532c; cursor: not-allowed; font-size: 15px; font-weight: 700; height: 52px; opacity: .65; }
.store-note { font-size: 11px; font-weight: 500; margin: 12px 0 0; opacity: .68; text-align: center; }
@keyframes spin { to { transform: rotate(360deg); } }