:root { --hub-green: #0b2c1c; --hub-cream: #fbfaf6; --hub-mint: #e7f1df; }
body { min-width: 320px; overflow: hidden; }.page-backdrop,.page-scrim { position:fixed; inset:0; }.page-backdrop { z-index:0; background:var(--paper); }.page-backdrop iframe { width:100%;height:100%;border:0;pointer-events:none; }.page-scrim { z-index:1;background:rgba(11,39,24,.49); }
.wish-hub { position:fixed;z-index:2;top:50%;left:50%;width:min(1035px,calc(100vw - 40px));max-height:min(790px,calc(100dvh - 40px));transform:translate(-50%,-50%);padding:42px clamp(22px,6vw,72px);border-radius:12px;background:var(--white);color:var(--ink);overflow:auto; }.hub-close { top:20px;right:22px; }.hub-step[hidden] { display:none; }
.hub-header { max-width:650px;margin:0 auto 23px;text-align:center; }.eyebrow { margin:0 0 6px;color:#35654a;font-size:12px;font-weight:700;letter-spacing:.08em; }.hub-header h1,.wish-hub h1 { margin:0;color:var(--ink);font-size:clamp(29px,4vw,42px);line-height:1.08;letter-spacing:-.032em; }.hub-header>p:last-child { margin:12px auto 0;max-width:540px;color:#52615a;font-size:15px;line-height:1.45; }
.moment-tabs { display:flex;width:fit-content;max-width:100%;gap:6px;margin:0 auto 16px;padding:5px;border:1px solid var(--line);border-radius:999px;background:var(--hub-cream);overflow-x:auto; }.moment-tab { flex:0 0 auto;padding:8px 12px;border:0;border-radius:999px;color:var(--ink);background:transparent;cursor:pointer;font:inherit;font-size:13px;font-weight:700; }.moment-tab:hover,.moment-tab[aria-pressed="true"] { color:white;background:var(--hub-green); }.catalog-status { min-height:20px;margin:2px 0 12px;color:#52615a;text-align:center;font-size:13px; }.catalog-status:empty { display:none; }
.nudge-section { margin:0 0 31px; }.section-label { display:flex;align-items:center;gap:7px;margin:0 0 8px;font-size:12px;letter-spacing:.06em; }.nudge-card { display:grid;grid-template-columns:186px 1fr;gap:31px;align-items:center;padding:22px 28px;border:1px solid var(--ink);border-radius:10px;background:var(--hub-mint);box-shadow:3px 3px 0 var(--ink); }.nudge-cover { display:grid;height:218px;place-items:center;border-radius:7px;background:#d4e6cf; }.nudge-cover img { max-width:135px;max-height:190px;object-fit:contain;filter:drop-shadow(0 6px 6px rgba(11,39,24,.2)); }.nudge-copy .eyebrow { margin-bottom:3px; }.nudge-copy h2 { margin:0;font-size:clamp(23px,3vw,31px);line-height:1.13;letter-spacing:-.024em; }.byline { margin:5px 0 13px;color:#52615a;font-size:14px; }.nudge-reason { max-width:525px;margin:0 0 11px;font-size:15px;line-height:1.42; }.book-meta { display:flex;flex-wrap:wrap;gap:6px; }.book-meta span { padding:4px 8px;border:1px solid #7d9785;border-radius:999px;color:#34553d;background:#fff9;font-size:11px;font-weight:700; }.nudge-actions { display:flex;flex-wrap:wrap;gap:10px;margin-top:18px; }.nudge-actions .primary-action,.nudge-actions .secondary-action { justify-content:center;min-height:42px;text-decoration:none; }.nudge-actions .primary-action { min-width:190px; }
.section-head { display:flex;align-items:end;justify-content:space-between;gap:18px;margin:0 0 12px; }.section-head h2 { margin:0;font-size:24px;line-height:1.12;letter-spacing:-.02em; }.count-pill,.live-pill { padding:5px 9px;border-radius:999px;background:var(--soft-green);color:#34553d;font-size:11px;font-weight:700;white-space:nowrap; }.live-pill { color:#35654a;background:#e5f5e7; }.saved-section { margin:0 0 28px; }.saved-rail { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px; }.saved-card,.catalog-card { position:relative;display:flex;min-width:0;gap:10px;padding:8px;border:1px solid var(--line);border-radius:8px;color:var(--ink);background:var(--hub-cream);text-align:left; }.saved-card { flex-direction:column; }.saved-card img { width:100%;height:120px;object-fit:contain; }.saved-card strong,.catalog-card strong { font-size:13px;line-height:1.22; }.saved-card small,.catalog-card small { color:#52615a;font-size:11px;line-height:1.25; }.remove-book { position:absolute;top:5px;right:5px;width:24px;height:24px;border:1px solid var(--ink);border-radius:50%;background:var(--white);cursor:pointer; }
.discover-section { padding-top:2px; }.discovery-intro { margin:-4px 0 13px;color:#52615a;font-size:13px; }.catalog-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px; }.catalog-card { min-height:184px;flex-direction:column;padding:10px; }.catalog-cover { display:grid;height:118px;place-items:center;border-radius:5px;background:var(--white); }.catalog-cover img { max-width:75px;max-height:106px;object-fit:contain;filter:drop-shadow(0 3px 4px rgba(11,39,24,.18)); }.catalog-card .card-copy { display:grid;gap:2px; }.save-book { margin-top:auto;padding:7px 9px;border:0;border-radius:999px;color:var(--ink);background:#dcebd8;cursor:pointer;font:inherit;font-size:11px;font-weight:700; }.save-book:hover { background:var(--hub-green);color:white; }.empty-catalog { grid-column:1/-1;margin:4px 0;color:#52615a;text-align:center;font-size:14px; }
.time-step,.confirmation-step { max-width:530px;margin:12px auto;text-align:center; }.back-link { align-self:start;margin-bottom:13px;border:0;color:var(--ink);background:transparent;cursor:pointer;font:inherit;font-size:13px;font-weight:700; }.picker-icon { margin-bottom:10px;font-size:38px; }.time-book { margin:14px 0 20px;color:#52615a;font-size:15px; }.time-choices { display:grid;gap:9px;text-align:left; }.time-choice { display:flex;align-items:center;gap:13px;min-height:65px;padding:9px 14px;border:1px solid var(--line);border-radius:8px;color:var(--ink);background:var(--hub-cream);cursor:pointer;font:inherit;font-size:23px; }.time-choice[aria-pressed="true"] { border-color:var(--ink);background:var(--hub-mint);box-shadow:2px 2px 0 var(--ink); }.time-choice span { display:grid;gap:2px;font-size:14px; }.time-choice small { color:#52615a;font-size:12px; }.save-time { margin-top:22px; }.save-time:disabled { opacity:.5;cursor:not-allowed; }.confirmation-step { padding:80px 0 45px; }.confirmation-mark { display:grid;width:62px;height:62px;margin:0 auto 18px;place-items:center;border:2px solid var(--ink);border-radius:50%;background:#ccead2;font-size:34px;font-weight:700; }.confirmation-step p { margin:16px auto 24px;font-size:16px; }.is-closed .wish-hub,.is-closed .page-scrim { display:none; }.is-closed .page-backdrop iframe { pointer-events:auto; }
@media(max-width:700px){body{overflow:auto}.wish-hub{width:calc(100vw - 18px);max-height:calc(100dvh - 18px);padding:43px 17px 25px}.hub-header h1{font-size:31px}.nudge-card{grid-template-columns:100px 1fr;gap:15px;padding:14px}.nudge-cover{height:155px}.nudge-cover img{max-width:84px;max-height:135px}.nudge-copy h2{font-size:23px}.nudge-reason{font-size:13px}.nudge-actions .primary-action,.nudge-actions .secondary-action{width:100%;font-size:12px}.saved-rail,.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.saved-card img{height:100px}.catalog-card{min-height:170px}.section-head h2{font-size:21px}}@media(max-width:390px){.moment-tab{padding-inline:9px}.nudge-card{grid-template-columns:78px 1fr}.nudge-cover{height:145px}.nudge-cover img{max-width:68px}.nudge-copy h2{font-size:20px}.nudge-actions{gap:7px}.book-meta span{font-size:10px}}

/* Den proaktive variant viser bevidst kun ét værk fra huskelisten ad gangen. */
.nudge-step { max-width: 650px; margin: 10px auto; text-align: center; }
.nudge-step > h1 { margin: 0; font-size: clamp(31px, 4vw, 42px); }
.saved-note { margin: 10px auto 22px; color: #52615a; font-size: 15px; }
.nudge-step .nudge-card { margin: 0; text-align: left; }
.main-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 20px; }
.main-actions .primary-action, .main-actions .secondary-action { min-height: 44px; justify-content: center; text-decoration: none; }
.main-actions .primary-action { min-width: 190px; }
.later-row { display: flex; justify-content: center; gap: 16px; margin-top: 16px; }
.text-action { border: 0; color: var(--ink); background: transparent; cursor: pointer; font: inherit; font-size: 13px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.quiet-action { color: #52615a; font-weight: 500; }
.list-hint { margin: 18px 0 0; color: #52615a; font-size: 12px; }
@media(max-width:700px){.nudge-step .nudge-card{grid-template-columns:100px 1fr}.main-actions .primary-action,.main-actions .secondary-action{width:100%}.later-row{gap:12px}.nudge-step>h1{font-size:31px}}