/* 광장·꾸미기 공용(2026-10-23): 구글 로그인 블록(혜택 설명은 아주 작게) · 멜로미 보관함 카드 · 광장 첫 화면의 보관함 창 */
.login-block { display: grid; justify-items: center; gap: 6px; margin: 10px 0 2px; }
.login-block .benefit { font-size: 11px; font-weight: 800; color: var(--pink-dark); }
.login-block .g-button { min-height: 40px; }
.login-block .fine { font-size: 10.5px; line-height: 1.4; color: #8a7a72; text-align: center; }
.vault-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; margin-top: 8px; }
.vault-card { position: relative; border: 1px solid var(--line); border-radius: 16px; background: #fff; padding: 6px; text-align: center; cursor: pointer; }
.vault-card img { width: 100%; aspect-ratio: 1; object-fit: contain; background: #f6ece6; border-radius: 12px; display: block; }
.vault-card b { display: block; font-size: 12px; margin-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vault-card .days { position: absolute; right: 9px; bottom: 29px; font-size: 9px; font-weight: 800; color: #fff; background: rgba(47, 41, 39, 0.55); border-radius: 8px; padding: 1px 5px; }
.vault-card .remove { position: absolute; top: 2px; right: 2px; width: 24px; height: 24px; border: 0; border-radius: 999px; background: rgba(255, 253, 251, 0.92); color: var(--ink); font-weight: 900; cursor: pointer; }
.vault-card.empty { display: grid; place-items: center; min-height: 128px; color: #b3a49b; font-size: 12px; font-weight: 800; cursor: default; background: #fbf6f2; }
.vault-sheet.choose .vault-card:not(.empty):hover { outline: 2px solid var(--pink); }
.login-block .inapp { font-size: 11px; line-height: 1.45; color: #b04a6c; background: #fff0f5; border-radius: 10px; padding: 6px 8px; text-align: center; }
.vault-card { color: inherit; }
.vault-save { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 2px; }
.vault-id { font-size: 10.5px; color: #9a8b83; margin-top: 8px; }
/* 광장 첫 화면(index.html)의 보관함 창: 꾸미기의 dialog.sheet와 같은 모양 */
dialog.account-sheet { border: 0; border-radius: 24px; padding: 18px; width: min(92vw, 420px); box-shadow: 0 22px 70px rgba(81, 55, 46, 0.25); color: #2f2927; font-family: inherit; }
dialog.account-sheet::backdrop { background: rgba(47, 41, 39, 0.35); }
dialog.account-sheet h3 { margin: 0 0 8px; }
dialog.account-sheet p { font-size: 13px; line-height: 1.55; margin: 6px 0; color: #6b5a52; }
dialog.account-sheet .actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
dialog.account-sheet .actions button { border: 1px solid rgba(65, 48, 45, 0.12); background: #fff; border-radius: 999px; padding: 9px 14px; font-weight: 800; cursor: pointer; color: #2f2927; }
dialog.account-sheet .actions button.primary { background: #ef789f; border-color: #ef789f; color: #fff; }
.login-block .continue-outside { border: 0; border-radius: 999px; padding: 11px 18px; font-weight: 900; font-size: 14px; color: #fff; background: #2f2927; cursor: pointer; }
.login-block .inapp-next { font-size: 11px; line-height: 1.5; color: #6b5a52; text-align: center; }
.login-block .copy-link { margin-top: 6px; border: 1px solid rgba(65, 48, 45, 0.15); background: #fff; border-radius: 999px; padding: 6px 12px; font-weight: 800; cursor: pointer; }