/* Semantic tokens: components consume these aliases instead of a preset's raw colors. */
:root { --surface:#fbf7f2; --text:#2e2830; --muted-text:#756c73; --accent:#b85e62; --accent-link:color-mix(in srgb,var(--accent) 80%,var(--text)); --accent-contrast:#ffffff; --card:#fffdf9; --border:#e8dfd7; --primary-bg:var(--text); --primary-fg:var(--card); --danger:#a34d50; --heading-font:'Playfair Display',Georgia,serif; --body-font:'DM Sans',Arial,sans-serif; --ink:var(--text); --muted:var(--muted-text); --cream:var(--surface); --paper:var(--card); --rose:color-mix(in srgb,var(--accent) 45%,white); --rose-dark:var(--accent); --line:var(--border); --serif:var(--heading-font); --sans:var(--body-font); }
:root[data-theme="meadow"] { --surface:#f4f7ef; --text:#25362a; --muted-text:#637064; --accent:#4f765e; --accent-contrast:#ffffff; --card:#ffffff; --border:#d9e2d2; --heading-font:Georgia,serif; --body-font:'DM Sans',Arial,sans-serif; }
:root[data-theme="dusk"] { --surface:#f8f3fa; --text:#322838; --muted-text:#776b7b; --accent:#8d5c9e; --accent-contrast:#ffffff; --card:#fffaff; --border:#e6dce9; --heading-font:Georgia,serif; --body-font:Arial,sans-serif; }
:root[data-theme="coast"] { --surface:#f1f8f8; --text:#20383d; --muted-text:#62777a; --accent:#28758b; --accent-contrast:#ffffff; --card:#ffffff; --border:#d4e5e6; --heading-font:'Playfair Display',Georgia,serif; --body-font:'DM Sans',Arial,sans-serif; }
:root[data-theme="ember"] { --surface:#fff6ee; --text:#3c2b24; --muted-text:#79675d; --accent:#b85d35; --accent-contrast:#ffffff; --card:#fffdfa; --border:#efded0; --heading-font:Georgia,serif; --body-font:Arial,sans-serif; }
:root[data-theme-mode="dark"] { --primary-fg:var(--surface); --danger:#ffb5b5; --accent-link:var(--accent); }
.primary { background:var(--primary-bg); color:var(--primary-fg); transition:filter .15s ease; }
.primary:hover { background:var(--primary-bg); filter:brightness(.92); }
.filter.active { background:var(--primary-bg); border-color:var(--primary-bg); color:var(--primary-fg); }
.toast { background:var(--primary-bg); color:var(--primary-fg); }
.text-button { color:var(--text); }
.form-actions .delete { color:var(--danger); }
dialog .form-grid input,dialog .form-grid textarea,dialog .form-grid select { border-color:var(--border); background:var(--card); color:var(--text); }
dialog .form-grid input::placeholder,dialog .form-grid textarea::placeholder { color:var(--muted-text); opacity:1; }
.reserve button { border:1px solid var(--border); background:var(--card); color:var(--text); }
.reserve button:disabled { border-color:var(--border); background:var(--surface); color:var(--muted-text); opacity:1; }
.theme-picker { display:grid; grid-template-columns:repeat(5,1fr); gap:8px; margin:21px 0; }
.theme-swatch { border:2px solid var(--border); background:var(--card); border-radius:12px; padding:10px 6px; color:var(--text); font-size:11px; font-weight:700; }
.theme-swatch:hover,.theme-swatch.selected { border-color:var(--accent); }
.theme-swatch i { display:block; height:22px; border-radius:7px; margin-bottom:6px; background:var(--swatch-surface); box-shadow:inset 0 -9px var(--swatch-accent); }
#theme-dialog { width:min(860px,calc(100% - 32px)); max-height:calc(100dvh - 32px); overflow:auto; }
#theme-dialog form { padding:clamp(24px,4vw,46px); }
#theme-dialog .dialog-top { margin-bottom:20px; }
#theme-dialog .form-hint { max-width:38rem; margin:10px 0 0; color:var(--muted); line-height:1.5; }
#theme-dialog .theme-picker { margin:22px 0 0; }
#theme-dialog .theme-swatch { min-height:92px; padding:10px; }
#theme-dialog .theme-swatch i { height:34px; }
.theme-live-preview { min-height:190px; display:flex; align-items:end; justify-content:space-between; gap:24px; overflow:hidden; padding:28px; border-radius:16px; background:var(--preview-surface); color:var(--preview-text); border:1px solid color-mix(in srgb,var(--preview-accent) 25%,transparent); }
.theme-live-preview span { display:block; color:var(--preview-accent); font:700 11px var(--preview-body); letter-spacing:1.3px; }
.theme-live-preview h3 { margin:8px 0 0; font:600 clamp(28px,4vw,46px)/.96 var(--preview-heading); letter-spacing:-1.5px; }
.theme-live-preview em { color:var(--preview-accent); }
.theme-live-preview aside { display:grid; gap:8px; min-width:140px; padding:18px; border-radius:13px; background:var(--preview-card); box-shadow:0 12px 25px #00000012; font-family:var(--preview-body); }
.theme-live-preview small { color:var(--preview-muted); }
.settings-form { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.settings-form label { display:grid; gap:6px; font-size:12px; font-weight:700; color:var(--muted); }
.settings-form input,.settings-form select { border:1px solid var(--border); border-radius:8px; padding:10px; background:var(--card); color:var(--text); }
.settings-form .wide { grid-column:1/-1; }
.color-setting { align-content:start; }
.color-swatches { display:flex; flex-wrap:wrap; gap:9px; margin-top:2px; }
.color-swatch { width:30px; height:30px; border-radius:50%; border:2px solid var(--card); background:var(--swatch-color); box-shadow:0 0 0 1px var(--border); padding:0; }
.color-swatch:hover:not(.selected) { box-shadow:0 0 0 2px var(--muted-text); }
.color-swatch.selected { box-shadow:0 0 0 3px var(--accent); }
.color-swatch:focus-visible { outline:2px solid var(--text); outline-offset:5px; }
.image-control { display:grid; gap:8px; padding:13px; border:1px dashed var(--border); border-radius:10px; background:color-mix(in srgb,var(--card) 82%,var(--surface)); }
.image-control.dragging { border-color:var(--accent); background:color-mix(in srgb,var(--accent) 10%,var(--card)); }
.image-control label { display:grid; gap:7px; }
.image-control input[type="file"] { max-width:100%; padding:8px; border:1px solid var(--border); border-radius:8px; background:var(--card); color:var(--text); font:500 12px var(--body-font); }
.image-control input[type="file"]::file-selector-button { margin-inline-end:10px; padding:7px 12px; border:1px solid var(--border); border-radius:999px; background:var(--surface); color:var(--text); font:600 12px var(--body-font); cursor:pointer; }
.image-control input[type="file"]::file-selector-button:hover { border-color:var(--accent); background:color-mix(in srgb,var(--accent) 10%,var(--card)); }
.image-upload-preview { min-height:0; }
.image-upload-preview img { display:block; width:min(100%,240px); max-height:180px; object-fit:cover; border-radius:9px; }
.image-control [data-image-remove] { justify-self:start; }
.color-system { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 18px; min-width:0; margin:0; padding:16px; border:1px solid var(--border); border-radius:12px; }
.color-system legend { padding:0 6px; color:var(--text); font-size:13px; font-weight:700; }
.base-theme-control { display:flex; align-items:center; gap:12px; }
.base-theme-control select { flex:1; min-width:0; }
.base-theme-colors { display:inline-flex; flex:none; align-items:center; gap:4px; }
.base-theme-colors i { width:15px; height:15px; border-radius:50%; background:var(--theme-chip); border:1px solid var(--border); box-shadow:0 0 0 1px var(--card); }
.fine-tune { display:flex; align-items:center; gap:8px; margin-top:7px; font-size:11px; font-weight:600; color:var(--muted); }
.settings-form .fine-tune input[type="color"] { width:42px; height:30px; padding:3px; }
.following-list { display:grid; gap:.75rem; margin:1.25rem 0; }
.preview-profiles-content { padding:clamp(22px,4vw,36px); }
#preview-profiles-dialog { width:min(570px,calc(100% - 28px)); max-height:calc(100dvh - 28px); overflow:auto; }
#preview-profiles-dialog .dialog-top { gap:16px; margin-bottom:18px; }
#preview-profiles-dialog .dialog-top h2 { margin:0; font:600 clamp(30px,5vw,40px) var(--heading-font); }
#preview-profiles-dialog .form-hint { margin:8px 0 0; color:var(--muted-text); line-height:1.45; }
.preview-profile-options { display:grid; gap:9px; }
.preview-profile-options button { display:grid; gap:3px; width:100%; padding:12px 14px; border:1px solid var(--border); border-radius:11px; background:var(--card); color:var(--text); text-align:left; }
.preview-profile-options button:hover:not(:disabled) { border-color:var(--accent); background:color-mix(in srgb,var(--accent) 7%,var(--card)); }
.preview-profile-options button:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.preview-profile-options button:disabled { opacity:.6; cursor:wait; }
.preview-profile-options strong { font-size:13px; }
.preview-profile-options small { color:var(--muted-text); font-size:12px; line-height:1.4; }
#preview-profiles-dialog .form-actions { margin-top:16px; }
.list-manager { max-width:1180px; margin:0 auto; padding:0 28px 14px; display:flex; align-items:center; border-bottom:1px solid var(--border); }
.wishlist-control { position:relative; width:min(560px,100%); }
.wishlist-control summary { display:flex; align-items:center; justify-content:space-between; gap:14px; min-width:0; padding:10px 14px; border:1px solid var(--border); border-radius:999px; background:var(--card); color:var(--text); cursor:pointer; font-size:14px; font-weight:700; list-style:none; }
.wishlist-control summary::-webkit-details-marker { display:none; }
.wishlist-control summary,.wishlist-control-panel button { -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
.wishlist-control summary::after { width:7px; height:7px; flex:none; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; content:""; transform:translateY(-2px) rotate(45deg); transition:transform .15s ease; }
.wishlist-control[open] summary::after { transform:translateY(2px) rotate(225deg); }
.wishlist-control summary:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.wishlist-control-title { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wishlist-control-panel { position:absolute; z-index:6; top:calc(100% + 8px); left:0; display:grid; width:min(420px,calc(100vw - 40px)); max-height:min(70vh,520px); gap:4px; overflow:auto; padding:10px; border:1px solid var(--border); border-radius:16px; background:var(--card); color:var(--text); box-shadow:0 12px 30px #24191d20; }
.wishlist-menu-heading { margin:4px 10px 6px; color:var(--muted-text); font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.wishlist-menu-list,.wishlist-menu-actions { display:grid; gap:3px; }
.wishlist-control-panel button { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; padding:10px; border:0; border-radius:10px; background:transparent; color:var(--text); cursor:pointer; font:600 13px/1.35 var(--body-font); text-align:left; }
.wishlist-control-panel button:hover:not(:disabled),.wishlist-control-panel button.selected { background:var(--surface); }
.wishlist-option-name { display:flex; align-items:center; gap:9px; min-width:0; }
.wishlist-option-check { display:inline-grid; width:16px; flex:none; place-items:center; color:var(--accent); font-weight:800; }
.wishlist-option-name { overflow-wrap:anywhere; }
.wishlist-access-badge { flex:none; padding:4px 8px; border:1px solid var(--border); border-radius:999px; background:var(--card); color:var(--muted-text); font-size:10px; font-weight:700; }
.wishlist-menu-divider { height:1px; margin:6px 4px; background:var(--border); }
.wishlist-menu-actions [data-list-archive] { color:var(--danger); }
.wishlist-control-panel button:disabled { opacity:.45; cursor:not-allowed; }
@media(max-width:600px){.list-manager{padding:0 18px 12px}.wishlist-control{width:100%}.wishlist-control summary{padding:10px 12px}.wishlist-control-panel{width:100%;max-height:min(65vh,480px)}}
@media(max-width:540px){.preview-profiles-content{padding:22px 18px}#preview-profiles-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 20px)}}
.following-list > div { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; padding:1rem; border:1px solid var(--border); border-radius:1rem; }
.following-list a { margin-right:auto; color:var(--ink); text-decoration:none; font-weight:700; }
.following-list small { display:block; color:var(--muted); font-weight:400; margin-top:.15rem; }
.gift-link { display:inline-flex; align-items:center; gap:.4rem; margin-top:.35rem; color:var(--accent-link); font-weight:700; text-decoration:none; }
.gift-link svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.summary { background:color-mix(in srgb,var(--surface) 84%,var(--accent)); color:var(--text); }
.summary span,.summary p { color:var(--text); }
.summary p { border-left-color:color-mix(in srgb,var(--accent) 42%,transparent); }
.inspiration-empty { grid-column:1/-1; display:grid; gap:1.5rem; padding:clamp(1.5rem,4vw,3rem); border:1px dashed var(--border); border-radius:1.5rem; background:color-mix(in srgb,var(--card) 82%,var(--surface)); text-align:center; }
.inspiration-empty > div:first-child { max-width:42rem; margin:0 auto; }
.inspiration-empty > div:first-child > span { color:var(--accent); font-size:1.5rem; }
.inspiration-empty h3 { margin:.45rem 0; font:600 clamp(1.8rem,3vw,2.7rem)/1 var(--heading-font); }
.inspiration-empty p:not(.eyebrow) { max-width:36rem; margin:.6rem auto 0; color:var(--muted); line-height:1.55; }
.inspiration-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; text-align:left; }
.inspiration-card { min-width:0; }
.inspiration-card .gift-image { min-height:120px; }
.inspiration-card .gift-content { padding:1.15rem; }
.inspiration-card h3 { font-size:1.65rem; }
.inspiration-card .owner-note { color:var(--muted); font-size:.78rem; }
.occasion-filter { position:relative; display:inline-flex; align-items:center; }
.occasion-remove { width:20px; height:20px; margin-left:-25px; border:0; border-radius:50%; background:transparent; color:var(--muted); font-size:17px; line-height:1; position:relative; z-index:1; }
.occasion-remove:hover { background:color-mix(in srgb,var(--accent) 14%,transparent); color:var(--text); }
.occasion-filter .filter { padding-right:31px; }
.add-occasion { border-style:dashed; color:var(--accent); }
.occasion-restore { display:flex; flex-wrap:wrap; gap:.6rem 1rem; align-items:center; margin:-1rem 0 1.7rem; color:var(--muted); font-size:.78rem; }
.occasion-restore .text-button { color:var(--muted); font-size:.78rem; }
@media(max-width:760px){.inspiration-grid{grid-template-columns:1fr}.inspiration-card .gift-image{min-height:88px}}
@media(max-width:600px){.theme-picker{grid-template-columns:repeat(3,1fr)}.settings-form{grid-template-columns:1fr}.settings-form .wide{grid-column:auto}.color-system{grid-template-columns:1fr}.color-system .wide{grid-column:1/-1}#theme-dialog .theme-picker{grid-template-columns:repeat(2,1fr)}.theme-live-preview{min-height:160px;padding:22px;align-items:start}.theme-live-preview aside{display:none}}
.reservation-control { display:flex; flex-direction:column; align-items:flex-end; gap:.4rem; }
.reservation-note { max-width:230px; margin:0; color:var(--muted-text); font-size:.68rem; line-height:1.4; text-align:right; }
.reservation-confirm { max-width:100%; padding:9px 13px; font-size:.72rem; white-space:normal; }
.anonymous-reservation { display:flex; align-items:center; gap:.35rem; color:var(--muted); font-size:.7rem; white-space:nowrap; }
.anonymous-reservation input,.reservation-visibility input { accent-color:var(--accent); }
.owner-reservation { display:flex; flex-direction:column; gap:.15rem; color:var(--accent); font-size:.78rem; font-weight:700; }
.owner-reservation small { color:var(--muted); font-weight:500; }
.reservation-visibility { display:grid; gap:.65rem; margin:0; padding:1rem; border:1px solid var(--border); border-radius:1rem; }
.access-settings { display:grid; gap:.7rem; margin:1rem 0 0; padding:1rem; border:1px solid var(--border); border-radius:1rem; }
.access-settings legend { padding:0 .3rem; font-weight:700; }
.access-settings label { display:flex; align-items:flex-start; gap:.5rem; color:var(--text); font-size:.82rem; font-weight:600; }
.access-settings input[type="radio"] { margin-top:.18rem; accent-color:var(--accent); }
.profile-id { display:grid; gap:6px; max-width:420px; margin:16px 0 0; }
.profile-id label { color:var(--muted-text); font-size:12px; font-weight:700; }
.profile-id input { width:100%; min-width:0; padding:10px 12px; border:1px solid var(--border); border-radius:9px; background:var(--card); color:var(--text); font:600 14px var(--body-font); }
.profile-id-value { display:flex; align-items:stretch; gap:8px; min-width:0; }
.profile-id-value input { flex:1; }
.profile-id-value button { flex:0 0 auto; min-height:42px; }
.profile-id .form-hint { margin:0; }
.profile-visibility { display:grid; gap:9px; margin:16px 0 0; padding:14px; border:1px solid var(--border); border-radius:14px; }
.profile-visibility legend { padding:0 6px; color:var(--text); font-size:13px; font-weight:700; }
.profile-visibility .privacy-option { display:flex; align-items:flex-start; gap:10px; margin:0; padding:11px 12px; border:1px solid var(--border); border-radius:10px; background:var(--card); color:var(--text); font-size:13px; font-weight:600; line-height:1.4; }
.profile-visibility .privacy-option input[type="radio"] { flex:none; margin:3px 0 0; accent-color:var(--accent); }
.profile-visibility .privacy-option span { display:grid; gap:3px; }
.profile-visibility .privacy-option strong { color:var(--text); }
.profile-visibility .privacy-option small { color:var(--muted-text); font-size:12px; font-weight:400; line-height:1.45; }
.profile-visibility>.form-hint { margin:2px 0 0; color:var(--muted-text); font-size:12px; line-height:1.45; }
.invite-manager { display:grid; gap:.6rem; padding:.8rem; border-radius:.8rem; background:var(--surface); }
.invite-manager[hidden] { display:none; }
.invitation-list { display:grid; gap:.45rem; }
.invitation-row { display:flex; flex-wrap:wrap; align-items:center; gap:.6rem; padding:.6rem; background:var(--card); border:1px solid var(--border); border-radius:.65rem; }
.invitation-row span { margin-right:auto; color:var(--text); font-size:.78rem; }
.discover-form { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:9px; padding:0; margin:1rem 0; }
.discover-form label { display:grid; gap:6px; color:var(--muted-text); font-size:.78rem; font-weight:700; }
.discover-form input { min-width:0; padding:10px; border:1px solid var(--border); border-radius:8px; background:var(--card); color:var(--text); }
.discover-form > button { align-self:end; }
.discover-form [data-discover-results] { grid-column:1/-1; color:var(--text); font-size:.82rem; }
.discover-list,.friend-requests > div { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:10px; border:1px solid var(--border); border-radius:10px; }
.discover-list a { margin-right:auto; color:var(--accent); font-weight:700; }
.friend-requests { display:grid; gap:8px; margin:1rem 0; }
.friend-requests h3 { margin:.5rem 0; font:600 1.2rem var(--heading-font); }
.friend-requests span { margin-right:auto; color:var(--text); font-weight:700; }
.friend-requests small,.discover-form small { display:block; margin-top:3px; color:var(--muted-text); font-size:.72rem; font-weight:500; }
.following-list-link{display:block;margin-top:6px;color:var(--accent);font-size:.82rem;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.access-audience{display:grid;gap:5px;margin:5px 0 0;padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text);font-size:.8rem;line-height:1.45}
.access-audience span,.access-audience small{color:var(--muted-text)}
.access-audience small{font-size:.72rem}
#new-list-dialog,#rename-list-dialog{width:min(540px,calc(100% - 28px));max-height:calc(100dvh - 28px);overflow:auto;padding:0;border:1px solid var(--border);border-radius:20px;background:var(--card);color:var(--text);box-shadow:0 24px 80px #100b1833}
#new-list-dialog form,#rename-list-dialog form{padding:clamp(20px,4vw,32px)}
.new-list-title{display:grid;gap:6px;margin:16px 0;color:var(--muted-text);font-size:12px;font-weight:700}
.new-list-title input{padding:11px 12px;border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--text);font:600 14px var(--body-font)}
.new-list-access{display:grid;gap:9px;margin:14px 0;padding:14px;border:1px solid var(--border);border-radius:12px}
.new-list-access legend{padding:0 5px;font-weight:700}
.new-list-access label{display:flex;align-items:flex-start;gap:8px;color:var(--text);font-size:13px;line-height:1.4}
.new-list-access input{margin-top:3px;accent-color:var(--accent)}
@media(max-width:540px){.discover-form{grid-template-columns:1fr}.discover-form > button{justify-self:start}}
.reservation-visibility label { display:flex; align-items:flex-start; gap:.5rem; color:var(--text); font-size:.82rem; font-weight:600; }
.reservation-visibility legend { padding:0 .3rem; font-weight:700; }
.reservation-visibility p { margin:0; color:var(--muted); font-size:.8rem; line-height:1.45; }
.reservation-visibility label { display:flex; align-items:flex-start; gap:.5rem; color:var(--text); font-size:.82rem; font-weight:600; }
@media(max-width:760px){.reservation-control{align-items:flex-start}.gift-footer{align-items:flex-end}}

/* Presets carry visual structure as well as color, type, and contrast tokens. */
:root[data-theme-mode="dark"] .summary span,:root[data-theme-mode="dark"] .summary p{color:var(--muted-text)}
:root[data-theme-mode="dark"] .summary p{border-left-color:var(--border)}
:root[data-theme-mode="dark"] .gift-card{border-color:var(--border);box-shadow:0 8px 28px #0003}
:root[data-theme-mode="dark"] button:focus-visible,:root[data-theme-mode="dark"] a:focus-visible,:root[data-theme-mode="dark"] input:focus-visible,:root[data-theme-mode="dark"] select:focus-visible,:root[data-theme-mode="dark"] textarea:focus-visible{outline-color:var(--accent)}
:root[data-layout="gallery"] .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
:root[data-shape="rounded"] .gift-card,:root[data-shape="rounded"] .empty{border-radius:30px}
:root[data-shape="pill"] .gift-card,:root[data-shape="pill"] .empty{border-radius:28px}
:root[data-shape="square"] .gift-card,:root[data-shape="square"] .empty{border-radius:5px}
:root[data-hero-shape="circle"] .hero-orb{border-radius:50%;transform:none}
:root[data-hero-shape="leaf"] .hero-orb{border-radius:5% 70% 8% 70% / 10% 60% 10% 60%;transform:rotate(-5deg)}
:root[data-hero-shape="sun"] .hero-orb{border-radius:50%;box-shadow:0 0 0 18px color-mix(in srgb,var(--accent) 14%,transparent),0 0 0 36px color-mix(in srgb,var(--accent) 8%,transparent)}
.profile-hero-image{width:100%;height:100%;display:block;object-fit:contain;border-radius:inherit;background:var(--card);padding:6px}
.settings-tabs{display:flex;gap:8px;margin:0 0 22px;border-bottom:1px solid var(--border)}
.settings-tabs [role="tab"]{flex:1;min-width:0;border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;padding:11px 8px;color:var(--muted-text);font-weight:700;line-height:1.25;white-space:normal}
.settings-tabs [role="tab"][aria-selected="true"]{border-color:var(--accent);color:var(--text)}
.settings-panel[hidden]{display:none}
.settings-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}
.settings-fields>label{display:grid;align-content:start;gap:6px;color:var(--muted-text);font-size:12px;font-weight:700}
.settings-fields input,.settings-fields select{min-width:0;border:1px solid var(--border);border-radius:8px;padding:10px;background:var(--card);color:var(--text)}
.settings-fields .wide{grid-column:1/-1}
.settings-panel>h3{margin:8px 0;font:600 22px var(--heading-font)}
.settings-language-field{display:grid;gap:7px;width:min(100%,420px);margin-top:16px;color:var(--muted-text);font-size:12px;font-weight:700}
.settings-language-field select{width:100%;min-height:44px;border:1px solid var(--border);border-radius:9px;padding:10px 12px;background:var(--card);color:var(--text);font:500 14px var(--body-font)}
.settings-shortcut{border:0;padding:0;background:transparent;color:var(--accent);font:inherit;font-size:.9em;font-weight:700;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.owner-note .settings-shortcut{display:block;margin-top:5px;font-size:11px}
.theme-live-preview aside{position:relative;overflow:hidden}
.theme-live-preview aside>img,.theme-live-preview .preview-mark{width:56px;height:56px;display:grid;place-items:center;object-fit:cover;border-radius:50%;border:2px solid var(--preview-accent);font-size:34px;line-height:1}
.theme-live-preview[data-hero-shape="leaf"] aside>img,.theme-live-preview[data-hero-shape="leaf"] .preview-mark{border-radius:5% 70% 8% 70% / 10% 60% 10% 60%}
.theme-live-preview[data-hero-shape="sun"] aside>img,.theme-live-preview[data-hero-shape="sun"] .preview-mark{box-shadow:0 0 0 5px color-mix(in srgb,var(--preview-accent) 14%,transparent),0 0 0 10px color-mix(in srgb,var(--preview-accent) 8%,transparent)}
.theme-live-preview[data-layout="gallery"]{align-items:center;text-align:center;flex-direction:column;justify-content:center;gap:10px}
.theme-live-preview[data-layout="gallery"] aside{display:flex;align-items:center;gap:10px;min-width:0;padding:10px 14px}
.theme-live-preview[data-shape="rounded"]{border-radius:30px}
.theme-live-preview[data-shape="pill"]{border-radius:45px}
.theme-live-preview[data-shape="square"]{border-radius:4px}
@media(max-width:760px){:root[data-layout="gallery"] .grid{grid-template-columns:1fr}}
@media(max-width:600px){#settings-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 20px);overflow:auto}#settings-dialog form{padding:22px 18px}.settings-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:8px}.settings-tabs [role="tab"]{min-height:52px;text-align:center}.settings-fields{grid-template-columns:1fr}.settings-fields .wide{grid-column:auto}.theme-live-preview{min-height:140px;padding:16px;align-items:center;gap:12px}.theme-live-preview h3{font-size:clamp(22px,7vw,31px);letter-spacing:-.8px}.theme-live-preview aside{display:grid;flex:0 0 min(34%,116px);min-width:0;padding:10px;gap:5px;font-size:12px}.theme-live-preview aside>img,.theme-live-preview .preview-mark{width:100%;height:56px}.theme-live-preview[data-layout="gallery"]{align-items:center;text-align:left;flex-direction:row;justify-content:space-between}.theme-live-preview[data-layout="gallery"] aside{display:grid;min-width:0}}
@media(max-width:600px){.settings-tabs{display:flex;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin;scroll-snap-type:x proximity}.settings-tabs [role="tab"]{flex:0 0 auto;min-width:max-content;white-space:nowrap;scroll-snap-align:start}}
.notifications-content,.delete-choice-content{padding:clamp(20px,4vw,32px)}
#notifications-dialog,#delete-choice-dialog{width:min(700px,calc(100% - 28px));max-height:calc(100dvh - 28px);overflow:auto;padding:0;border:1px solid var(--border);border-radius:20px;background:var(--card);color:var(--text);box-shadow:0 24px 80px #100b1833}
#notifications-dialog::backdrop,#delete-choice-dialog::backdrop{background:#14101888;backdrop-filter:blur(3px)}
.notification-count{display:inline-grid;min-width:25px;height:25px;place-items:center;vertical-align:middle;border-radius:99px;background:var(--accent);color:var(--card);font:700 12px var(--body-font)}
.notification-preferences{display:grid;gap:10px;margin:20px 0;padding:16px;border:1px solid var(--border);border-radius:14px;background:var(--surface)}
.notification-preferences h3{margin:0 0 3px;font:600 20px var(--heading-font)}
.notification-preferences label{display:flex;align-items:center;gap:9px;color:var(--text);font-size:13px;font-weight:600}
.notification-preferences input{accent-color:var(--accent)}
.notification-preferences .form-hint{margin:0}
.notification-list{display:grid;gap:9px}
.notification-card{display:flex;align-items:flex-start;gap:12px;padding:14px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text)}
.notification-card.unread{border-left:4px solid var(--accent)}
.notification-card>div{flex:1;min-width:0;display:grid;gap:4px}
.notification-card p,.notification-card small{margin:0;color:var(--muted-text);line-height:1.45}
.notification-card small{font-size:11px}
.notification-actions{display:flex;flex-wrap:wrap;gap:8px}
.notification-actions button,.notification-actions a{border:0;padding:2px;background:none;color:var(--accent);font:700 12px var(--body-font);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.delete-choice-content>p{color:var(--muted-text);line-height:1.5}
.delete-choice-content .form-actions{flex-wrap:wrap}
@media(max-width:560px){.notification-card{flex-wrap:wrap}.notification-card>.notification-actions{width:100%}.delete-choice-content .form-actions>*{flex:1 1 100%}}
dialog{background:var(--card);color:var(--text)}
:root[data-theme-mode="dark"] .role-switch:hover,:root[data-theme-mode="dark"] .secondary:hover,:root[data-theme-mode="dark"] .filter:hover{background:color-mix(in srgb,var(--card) 78%,var(--accent))}
:root[data-theme-mode="dark"] .gift-content .recurring{color:var(--accent)}
:root[data-theme-mode="dark"] .occasion{background:color-mix(in srgb,var(--card) 88%,transparent);color:var(--text)}
:root[data-theme-mode="dark"] .empty{border-color:var(--border)}
.add-idea-card{align-items:center;justify-content:center;gap:12px;padding:24px;border:1px dashed var(--border);background:var(--surface);color:var(--text);text-align:center;transition:border-color .16s ease,background .16s ease,transform .16s ease}
.add-idea-card:hover{border-color:var(--accent);background:color-mix(in srgb,var(--surface) 88%,var(--accent));transform:translateY(-2px)}
.add-idea-card-mark{display:grid;width:58px;height:58px;place-items:center;border:1px solid var(--accent);border-radius:50%;color:var(--accent);font:400 38px/1 var(--body-font)}
.add-idea-card strong{font:600 21px/1.2 var(--heading-font)}
.add-idea-card small{color:var(--muted-text);font-size:12px;line-height:1.4}
@media(max-width:760px){.add-idea-card{min-height:220px}}
:root[data-theme-mode="dark"] .image-placeholder{background:linear-gradient(130deg,var(--card),var(--surface));color:var(--accent)}
:root[data-theme-mode="dark"] .status{color:var(--muted-text)}
:root[data-theme-mode="dark"] .status.partly,:root[data-theme-mode="dark"] .status.claimed{color:var(--accent)}

.api-offline-page{min-height:100vh;background:var(--surface);color:var(--text)}
.api-offline-card{width:min(620px,calc(100% - 36px));margin:clamp(36px,10vh,100px) auto;padding:clamp(24px,5vw,48px);border:1px solid var(--border);border-radius:20px;background:var(--card);box-shadow:0 18px 55px #120d1818}
.api-offline-card h1{margin:0;font:600 clamp(36px,7vw,58px)/1 var(--heading-font);letter-spacing:-1.5px}
.api-offline-card>p:not(.eyebrow){margin:16px 0 24px;color:var(--muted-text);line-height:1.6}
.api-offline-banner{margin:0 0 18px;padding:14px 16px;border:1px solid var(--border);border-left:4px solid var(--accent);border-radius:10px;background:var(--card);color:var(--text)}
.api-offline-banner p{margin:4px 0 8px;color:var(--muted-text);line-height:1.4}