:root {
  --bg: #f5eee9;
  --bg-soft: #fbf7f3;
  --card: rgba(255,255,255,.78);
  --card-strong: #fffaf6;
  --text: #3a2d2a;
  --muted: #8d7770;
  --line: rgba(87,59,50,.12);
  --rose: #b97879;
  --rose-deep: #8f595d;
  --sand: #d9c1af;
  --wood: #8c5c3b;
  --wood-dark: #5f3b28;
  --success: #7f9c79;
  --danger: #ad6666;
  --shadow: 0 18px 50px rgba(80,50,40,.11);
  --radius-xl: 28px;
  --radius-lg: 22px;
  --radius-md: 16px;
}
* { box-sizing: border-box; }
html { background: var(--bg); }
body {
  margin: 0;
  min-height: 100vh;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text);
  background:
    radial-gradient(circle at 12% 4%, rgba(202,154,149,.20), transparent 24rem),
    radial-gradient(circle at 95% 8%, rgba(223,201,179,.26), transparent 28rem),
    linear-gradient(180deg,#f8f1ec 0%,#f3ebe5 100%);
}
button,input,select,textarea { font: inherit; }
button { cursor: pointer; }
.app-shell { max-width: 1180px; margin: 0 auto; min-height: 100vh; }
.topbar {
  position: sticky; top: 0; z-index: 20;
  display: flex; justify-content: space-between; align-items: center;
  padding: calc(18px + env(safe-area-inset-top)) 20px 14px;
  backdrop-filter: blur(18px);
  background: linear-gradient(180deg,rgba(248,241,236,.94),rgba(248,241,236,.72));
  border-bottom: 1px solid rgba(90,65,55,.07);
}
.eyebrow { margin:0 0 3px; color: var(--rose-deep); font-size: 10px; font-weight:800; letter-spacing:.16em; }
h1 { margin:0; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(25px,5vw,38px); font-weight:600; letter-spacing:-.03em; }
.avatar-button { width:44px;height:44px;border-radius:50%;border:1px solid rgba(110,77,66,.13);background:linear-gradient(145deg,#d8aba7,#b97778);color:white;font-weight:800;box-shadow:0 8px 24px rgba(143,89,93,.22); }
.app-content { padding: 20px 18px calc(108px + env(safe-area-inset-bottom)); }
.section { margin-bottom: 26px; }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:16px; margin-bottom:14px; }
.section-heading h2 { margin:0; font-family: Georgia,serif; font-size:24px; font-weight:600; }
.section-heading p { margin:4px 0 0; color:var(--muted); font-size:14px; }
.link-button { border:0;background:transparent;color:var(--rose-deep);font-weight:700;padding:6px; }
.hero {
  position:relative; overflow:hidden;
  background:linear-gradient(135deg,#745042 0%,#a86f67 55%,#d7b0a3 100%);
  color:white; border-radius:32px; padding:28px; box-shadow:var(--shadow); min-height:205px;
}
.hero::after { content:""; position:absolute; width:210px;height:210px;border-radius:50%;right:-48px;top:-65px;background:rgba(255,255,255,.10);box-shadow:0 0 0 30px rgba(255,255,255,.04); }
.hero-kicker{font-size:12px;text-transform:uppercase;letter-spacing:.13em;opacity:.78;font-weight:800;margin:0 0 8px}
.hero h2{font-family:Georgia,serif;font-size:34px;margin:0 0 9px;max-width:540px}
.hero p{margin:0;opacity:.86;max-width:580px;line-height:1.6}
.hero-actions{margin-top:22px;display:flex;gap:10px;flex-wrap:wrap}
.btn { border:0;border-radius:14px;padding:12px 16px;font-weight:800;transition:.18s transform,.18s box-shadow,.18s background; }
.btn:active{transform:scale(.98)}
.btn-primary{background:var(--rose-deep);color:#fff;box-shadow:0 8px 20px rgba(101,57,60,.18)}
.btn-light{background:rgba(255,255,255,.92);color:var(--text)}
.btn-soft{background:#f2e3de;color:var(--rose-deep)}
.btn-danger{background:#f7e4e4;color:#8c4949}
.btn-ghost{background:transparent;border:1px solid var(--line);color:var(--text)}
.metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:14px; }
.metric { background:var(--card);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.6);border-radius:20px;padding:15px;box-shadow:0 10px 28px rgba(90,62,53,.07); }
.metric strong{display:block;font-family:Georgia,serif;font-size:25px}
.metric span{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.card { background:var(--card);border:1px solid rgba(255,255,255,.72);border-radius:var(--radius-xl);box-shadow:var(--shadow); }
.current-book { display:grid;grid-template-columns:92px 1fr;gap:18px;padding:18px;align-items:center; }
.cover { aspect-ratio:2/3;border-radius:14px;box-shadow:0 12px 24px rgba(50,30,25,.2);display:flex;align-items:center;justify-content:center;text-align:center;padding:9px;color:white;font-family:Georgia,serif;font-weight:700;line-height:1.05;position:relative;overflow:hidden; }
.cover::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.16),transparent 45%,rgba(0,0,0,.13));pointer-events:none}
.cover::after{content:"";position:absolute;inset:0;border-left:3px solid rgba(255,255,255,.17);border-right:2px solid rgba(0,0,0,.08);opacity:.8}
.cover span{position:relative;z-index:1}
.book-meta h3{margin:0 0 4px;font-family:Georgia,serif;font-size:21px}
.book-meta .author{color:var(--muted);font-size:13px;margin-bottom:14px}
.progress-row{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;margin-bottom:6px}
.progress{height:9px;background:#eadbd3;border-radius:99px;overflow:hidden}
.progress > i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--rose),var(--rose-deep))}
.book-strip { display:grid;grid-auto-flow:column;grid-auto-columns:112px;gap:14px;overflow-x:auto;padding:2px 2px 14px;scrollbar-width:none}
.book-strip::-webkit-scrollbar{display:none}
.book-mini .cover{width:100%}
.book-mini b{display:block;font-size:12px;margin-top:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.book-mini small{display:block;color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.toolbar { display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.search{flex:1;min-width:220px;position:relative}
.search input{width:100%;padding:13px 14px 13px 40px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.78);outline:none}
.search::before{content:"⌕";position:absolute;left:14px;top:9px;color:var(--muted);font-size:22px}
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:3px;scrollbar-width:none}
.chip{white-space:nowrap;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.65);padding:9px 12px;color:var(--muted);font-weight:700;font-size:12px}
.chip.active{background:var(--rose-deep);color:white;border-color:transparent}
.book-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.book-card{background:var(--card);border-radius:22px;padding:12px;box-shadow:0 12px 30px rgba(73,46,38,.08);border:1px solid rgba(255,255,255,.72)}
.book-card .cover{width:100%;}
.book-card h3{font-size:14px;margin:10px 0 3px}
.book-card p{font-size:12px;color:var(--muted);margin:0 0 8px}
.status{display:inline-flex;border-radius:99px;padding:5px 8px;font-size:10px;font-weight:800;background:#f2e2dc;color:#87585a}
.status.green{background:#e7efe4;color:#60795c}
.status.gold{background:#f2ead7;color:#8b7240}
.status.gray{background:#ebe7e4;color:#776f69}
.fab { position:fixed;right:22px;bottom:calc(88px + env(safe-area-inset-bottom));z-index:22;width:56px;height:56px;border:0;border-radius:50%;background:var(--rose-deep);color:white;font-size:29px;box-shadow:0 14px 30px rgba(100,55,58,.28); }

.shelf-preview-card{padding:14px;background:linear-gradient(180deg,#f0e1d5,#d7bba6)}
.preview-stage{min-height:210px}
.preview-stage .shelf-scene{padding-top:26px;padding-bottom:18px}
.preview-stage .scene-side{height:auto;top:18px;bottom:14px}
.preview-stage .shelf-row.compact{height:130px;margin-bottom:0}
.preview-lights{top:8px}

.library-stage{border-radius:30px;overflow:hidden;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.8);position:relative;min-height:600px;background-size:cover;background-position:center}
.library-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(48,32,26,.12));pointer-events:none}
.fairy-lights{position:absolute;left:10px;right:10px;top:10px;height:58px;z-index:3;pointer-events:none}
.fairy-lights::before{content:"";position:absolute;left:6px;right:6px;top:14px;height:18px;border-top:2px solid rgba(114,83,71,.3);border-radius:50%;}
.light{position:absolute;top:20px;width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.2),0 0 14px rgba(255,226,183,.9)}
.light::before{content:"";position:absolute;top:-6px;left:4px;width:2px;height:8px;background:rgba(83,58,48,.42);border-radius:99px}
.light.warm{background:#ffe7b9}
.light.cream{background:#fff3db}
.light.pink{background:#f6ced7;box-shadow:0 0 0 2px rgba(255,255,255,.18),0 0 13px rgba(248,196,211,.95)}
.cozy-glow{position:absolute;border-radius:50%;filter:blur(16px);pointer-events:none;opacity:.8;z-index:1}
.cozy-glow-left{left:-16px;bottom:80px;width:88px;height:88px;background:rgba(255,210,165,.42)}
.cozy-glow-right{right:-12px;top:92px;width:74px;height:74px;background:rgba(248,208,214,.42)}
.shelf-scene{position:relative;z-index:2;padding:56px 16px 34px}
.shelf-scene .scene-side{position:absolute;top:44px;bottom:16px;width:16px;border-radius:10px;z-index:0;box-shadow:inset 2px 0 rgba(255,255,255,.15), inset -3px 0 rgba(0,0,0,.14), 0 8px 12px rgba(51,31,23,.12)}
.shelf-scene .scene-side.left{left:8px}
.shelf-scene .scene-side.right{right:8px}
.shelf-scene.cozy .scene-side{background:linear-gradient(180deg,#a6764f 0%,#76462f 45%,#5d3625 100%)}
.shelf-scene.white .scene-side{background:linear-gradient(180deg,#fffdf9 0%,#ebddd5 45%,#d6c6bc 100%)}
.shelf-scene.dark .scene-side{background:linear-gradient(180deg,#6d5143 0%,#3b2a21 55%,#2a1d17 100%)}
.shelf-scene.minimal .scene-side{background:linear-gradient(180deg,#d9c0af 0%,#bc9e89 48%,#a27f6a 100%)}
.shelf-scene.pastel .scene-side{background:linear-gradient(180deg,#f1d8df 0%,#d5aab4 45%,#b98294 100%)}

.shelf-row{
  position:relative;
  min-height:136px;
  display:flex;
  align-items:flex-end;
  padding:10px 18px 36px;
  margin:0 10px 24px;
  gap:4px;
  z-index:1;
}
.shelf-row::before{
  content:"";
  position:absolute;
  left:-2px;
  right:-2px;
  bottom:18px;
  height:18px;
  border-radius:8px 8px 6px 6px;
  box-shadow:0 12px 18px rgba(50,30,20,.22);
}
.shelf-row::after{
  content:"";
  position:absolute;
  left:6px;
  right:6px;
  bottom:12px;
  height:7px;
  border-radius:99px;
  opacity:.65;
}
.shelf-row.cozy::before{background:linear-gradient(180deg,#be8c62 0%,#8e5f41 35%,#69402b 100%)}
.shelf-row.cozy::after{background:rgba(61,37,26,.22)}
.shelf-row.white::before{background:linear-gradient(180deg,#fffefe 0%,#ede1d8 45%,#d7c5ba 100%)}
.shelf-row.white::after{background:rgba(116,101,94,.16)}
.shelf-row.dark::before{background:linear-gradient(180deg,#775a48 0%,#4e372b 40%,#2e1f18 100%)}
.shelf-row.dark::after{background:rgba(22,14,10,.28)}
.shelf-row.minimal::before{background:linear-gradient(180deg,#dac3b4 0%,#b99682 42%,#9a7662 100%)}
.shelf-row.minimal::after{background:rgba(71,48,36,.16)}
.shelf-row.pastel::before{background:linear-gradient(180deg,#efcfd8 0%,#d7aab7 42%,#b98095 100%)}
.shelf-row.pastel::after{background:rgba(92,56,65,.18)}

.spine{
  height:94px;
  width:var(--w);
  min-width:14px;
  border-radius:4px 4px 2px 2px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.16),transparent 12%),
    linear-gradient(90deg,rgba(255,255,255,.18),transparent 22%,rgba(0,0,0,.09) 88%),
    var(--c);
  box-shadow:inset 2px 0 rgba(255,255,255,.18), inset -2px 0 rgba(0,0,0,.12), 0 5px 10px rgba(51,31,23,.12);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  position:relative;
  margin-bottom:0;
  align-self:flex-end;
}
.spine::before,
.spine::after{content:"";position:absolute;left:2px;right:2px;height:2px;border-radius:99px;background:rgba(255,255,255,.26)}
.spine::before{top:7px}
.spine::after{bottom:7px;opacity:.4}
.spine.gold::before{background:linear-gradient(90deg,#f9ecc7,#d4a858,#f8e7ba)}
.spine.gold::after{background:linear-gradient(90deg,#f9ecc7,#d4a858,#f8e7ba)}
.spine.light{box-shadow:inset 3px 0 rgba(255,255,255,.3), inset -2px 0 rgba(0,0,0,.1), 0 5px 10px rgba(51,31,23,.12)}
.spine span{
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  font-family:Georgia,serif;
  font-size:8px;
  color:rgba(255,255,255,.94);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-height:80px;
  letter-spacing:.04em;
}

.shelf-deco{
  position:relative;
  flex:0 0 auto;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  height:96px;
  width:34px;
  margin:0 2px 0;
  align-self:flex-end;
}
.shelf-deco .deco-shape{position:relative;display:block}
.shelf-deco.candle{width:28px}
.shelf-deco.candle .deco-shape{width:18px;height:34px;border-radius:9px 9px 6px 6px;background:linear-gradient(180deg,#fdf4eb,#efddcf 68%,#d6c0af);box-shadow:0 6px 10px rgba(62,40,30,.12)}
.shelf-deco.candle .deco-shape::before{content:"";position:absolute;left:8px;top:-8px;width:2px;height:8px;background:#61453a;border-radius:99px}
.shelf-deco.candle .deco-shape::after{content:"";position:absolute;left:4px;top:-15px;width:10px;height:10px;background:radial-gradient(circle,#ffe4a6 0%,#f7b06c 56%,rgba(255,176,108,0) 72%);filter:blur(.2px);border-radius:50%;box-shadow:0 0 18px rgba(255,205,120,.85)}
.shelf-deco.plant{width:42px}
.shelf-deco.plant .deco-shape{width:24px;height:18px;border-radius:4px 4px 9px 9px;background:linear-gradient(180deg,#e8d7ca,#c5a48f);box-shadow:0 6px 10px rgba(62,40,30,.12)}
.shelf-deco.plant .deco-shape::before,
.shelf-deco.plant .deco-shape::after{content:"";position:absolute;bottom:11px;width:16px;height:26px;background:linear-gradient(180deg,#92b189,#5f8460);border-radius:16px 0 16px 0}
.shelf-deco.plant .deco-shape::before{left:-3px;transform:rotate(-22deg)}
.shelf-deco.plant .deco-shape::after{right:-3px;transform:rotate(22deg)}
.shelf-deco.frame .deco-shape{width:24px;height:30px;border-radius:4px;background:linear-gradient(180deg,#d1b17e,#a97743);box-shadow:0 6px 10px rgba(62,40,30,.12)}
.shelf-deco.frame .deco-shape::before{content:"";position:absolute;inset:4px;border-radius:2px;background:linear-gradient(145deg,#f8ece1,#e9d8c8)}
.shelf-deco.stack{width:40px}
.shelf-deco.stack .deco-shape{width:32px;height:12px;border-radius:4px;background:#b5827b;box-shadow:0 -10px 0 0 #d4a8a1, 0 -20px 0 0 #8c5f68, 0 7px 10px rgba(62,40,30,.12)}
.shelf-deco.mug .deco-shape{width:22px;height:22px;border-radius:6px 6px 11px 11px;background:linear-gradient(180deg,#f8e0de,#e3b9ba);box-shadow:0 6px 10px rgba(62,40,30,.12)}
.shelf-deco.mug .deco-shape::before{content:"";position:absolute;right:-8px;top:5px;width:10px;height:10px;border:2px solid #e3b9ba;border-left:0;border-radius:0 8px 8px 0}
.shelf-deco.vase{width:28px}
.shelf-deco.vase .deco-shape{width:18px;height:30px;border-radius:8px 8px 10px 10px;background:linear-gradient(180deg,#f3d4d5,#d9a0ab);box-shadow:0 6px 10px rgba(62,40,30,.12)}
.shelf-deco.vase .deco-shape::before{content:"";position:absolute;left:6px;top:-16px;width:2px;height:18px;background:#7a976f;box-shadow:-5px 1px 0 0 #96bb90, 5px 0 0 0 #96bb90}
.shelf-deco.bow{width:34px}
.shelf-deco.bow .deco-shape{width:12px;height:12px;background:#f2b8c8;border-radius:50%;box-shadow:0 6px 10px rgba(62,40,30,.12)}
.shelf-deco.bow .deco-shape::before,
.shelf-deco.bow .deco-shape::after{content:"";position:absolute;top:0;width:14px;height:10px;background:#f6d4df;border-radius:12px 12px 4px 12px}
.shelf-deco.bow .deco-shape::before{left:-10px;transform:rotate(-20deg)}
.shelf-deco.bow .deco-shape::after{right:-10px;transform:rotate(20deg) scaleX(-1)}

.design-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.design-option{border:1px solid var(--line);border-radius:18px;padding:12px;background:rgba(255,255,255,.68);text-align:left}
.design-option.active{outline:2px solid var(--rose);background:#fff9f6}
.design-preview{height:66px;border-radius:12px;margin-bottom:8px;position:relative;overflow:hidden;background:#eee2da}
.design-preview::after{content:"";position:absolute;left:7px;right:7px;bottom:12px;height:8px;border-radius:3px;background:var(--preview)}
.shelf-preview span{position:absolute;left:10px;bottom:20px;width:10px;height:28px;border-radius:3px;background:#98686d;box-shadow:15px 0 0 #6b4a59,32px 0 0 #bea27a,47px 0 0 #7d656f}
.shelf-preview i{position:absolute;right:12px;bottom:17px;width:13px;height:13px;border-radius:50%;background:#fce2ac;box-shadow:0 0 12px rgba(255,209,137,.9)}
.shelf-preview i::before{content:"";position:absolute;left:-4px;top:11px;width:20px;height:10px;border-radius:8px;background:#f3eadf;box-shadow:0 5px 8px rgba(62,40,30,.12)}
.shelf-preview em{position:absolute;right:34px;bottom:18px;width:15px;height:14px;border-radius:4px 4px 7px 7px;background:#d5b3b8}
.shelf-preview.em::before{display:none}
.decor-preview{background:linear-gradient(145deg,#f2e1d8,#e7cdc4)}
.decor-preview::after{display:none}
.decor-preview span{position:absolute;bottom:14px;width:12px;border-radius:4px 4px 8px 8px;background:#d08c96;box-shadow:0 6px 10px rgba(62,40,30,.12)}
.decor-preview span:nth-child(1){left:14px;height:18px;background:#efdfd3}
.decor-preview span:nth-child(2){left:34px;height:30px;background:#8eac83}
.decor-preview span:nth-child(3){right:14px;height:24px;background:#caa371}
.decor-preview.wenig span:nth-child(2),
.decor-preview.wenig span:nth-child(3){opacity:.5}
.decor-preview.mittel span:nth-child(3){opacity:.8}
.design-option strong{font-size:13px}
.design-option small{display:block;color:var(--muted);margin-top:2px}
.upload-box{border:1px dashed rgba(119,84,72,.25);background:rgba(255,255,255,.6);border-radius:18px;padding:18px;text-align:center}
.upload-box input{display:none}
.upload-box label{display:block;color:var(--rose-deep);font-weight:800;cursor:pointer}
.upload-box small{display:block;color:var(--muted);margin-top:5px}
.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.stat-card{padding:18px}
.stat-card strong{font-family:Georgia,serif;font-size:28px;display:block}
.stat-card span{color:var(--muted);font-size:12px}
.goal{padding:22px}
.goal-top{display:flex;justify-content:space-between;gap:14px;align-items:center}
.goal-ring{width:102px;height:102px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--rose-deep) 0 68%,#eadbd3 68% 100%);position:relative;flex:0 0 auto}
.goal-ring::after{content:"";position:absolute;width:74px;height:74px;border-radius:50%;background:#fff8f4}
.goal-ring strong{position:relative;z-index:1;font-family:Georgia,serif;font-size:22px}
.bar-chart{display:grid;gap:12px}
.bar-line{display:grid;grid-template-columns:86px 1fr 35px;align-items:center;gap:8px;font-size:12px}
.bar-track{height:9px;background:#eadbd3;border-radius:99px;overflow:hidden}
.bar-track i{display:block;height:100%;background:linear-gradient(90deg,#c99a95,#8f595d);border-radius:inherit}
.profile-card{padding:22px;display:flex;gap:16px;align-items:center}
.profile-avatar{width:66px;height:66px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#d9aaa6,#a76b70);color:white;font-family:Georgia,serif;font-size:30px}
.profile-card h2{margin:0 0 4px;font-family:Georgia,serif}
.profile-card p{margin:0;color:var(--muted);font-size:13px}
.settings-list{overflow:hidden}
.setting-row{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:16px 18px;border-bottom:1px solid var(--line)}
.setting-row:last-child{border-bottom:0}
.setting-row b{font-size:14px}
.setting-row small{display:block;color:var(--muted);margin-top:2px}
.switch{width:48px;height:28px;border:0;border-radius:99px;background:#d8cdc7;padding:3px;transition:.2s}
.switch i{display:block;width:22px;height:22px;border-radius:50%;background:white;transition:.2s;box-shadow:0 2px 8px rgba(0,0,0,.14)}
.switch.on{background:var(--rose-deep)}
.switch.on i{transform:translateX(20px)}
.admin-user{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:15px 16px;border-bottom:1px solid var(--line)}
.admin-user:last-child{border-bottom:0}
.admin-user b{display:block}
.admin-user small{display:block;color:var(--muted)}
.admin-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.icon-btn{border:1px solid var(--line);background:#fffaf7;border-radius:10px;padding:7px 9px;color:var(--text);font-size:12px}
.icon-btn.danger{color:#8d4c4c;background:#fff2f2}
.bottom-nav { position:fixed;left:50%;transform:translateX(-50%);bottom:0;z-index:25;width:min(100%,1180px);display:grid;grid-template-columns:repeat(6,1fr);padding:10px 10px calc(10px + env(safe-area-inset-bottom));background:rgba(255,250,247,.92);backdrop-filter:blur(18px);border-top:1px solid rgba(102,72,61,.10);box-shadow:0 -10px 28px rgba(70,45,37,.05)}
.nav-item{border:0;background:transparent;color:#9a8580;padding:5px 2px;border-radius:14px;display:flex;flex-direction:column;align-items:center;gap:3px}
.nav-item span{font-size:22px;line-height:1}
.nav-item small{font-size:10px;font-weight:800}
.nav-item.active{color:var(--rose-deep);background:#f4e5e1}
.modal-backdrop{position:fixed;inset:0;z-index:50;background:rgba(44,30,26,.42);backdrop-filter:blur(6px);display:flex;align-items:flex-end;justify-content:center;padding:14px}
.modal{width:min(100%,720px);max-height:88vh;overflow:auto;background:#fffaf7;border-radius:28px 28px 18px 18px;padding:20px;box-shadow:0 24px 70px rgba(35,23,20,.3)}
.modal-head{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:16px}
.modal-head h2{margin:0;font-family:Georgia,serif}
.close-btn{border:0;width:38px;height:38px;border-radius:50%;background:#f1e5df;color:var(--text);font-size:20px}
.choice-grid{display:grid;grid-template-columns:1fr;gap:12px}
.choice-card{border:1px solid var(--line);background:#fff;border-radius:18px;padding:17px;text-align:left}
.choice-card strong{display:block}
.choice-card small{display:block;color:var(--muted);margin-top:4px;line-height:1.4}
.form-grid{display:grid;grid-template-columns:1fr;gap:12px}
.field label{display:block;font-size:12px;font-weight:800;margin:0 0 6px}
.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:14px;background:white;padding:12px 13px;outline:none;color:var(--text)}
.field textarea{min-height:100px;resize:vertical}
.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}
.toast-root{position:fixed;z-index:80;top:18px;right:18px;display:grid;gap:8px}
.toast{background:#3d312e;color:white;padding:12px 14px;border-radius:14px;box-shadow:0 12px 28px rgba(0,0,0,.18);font-size:13px;animation:toastIn .2s ease}
.toast.error{background:#8a5151}
@keyframes toastIn{from{transform:translateY(-8px);opacity:0}to{transform:none;opacity:1}}
.empty{padding:34px;text-align:center;color:var(--muted)}
.demo-note{display:inline-flex;align-items:center;gap:6px;border-radius:99px;padding:6px 9px;background:#efe2dc;color:#815b59;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}

@media (min-width:700px) {
  .app-content{padding:28px 28px 120px}
  .book-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .design-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .metrics{grid-template-columns:repeat(3,1fr)}
  .stats-grid{grid-template-columns:repeat(4,1fr)}
  .choice-grid{grid-template-columns:repeat(3,1fr)}
  .form-grid{grid-template-columns:repeat(2,1fr)}
  .field.full{grid-column:1/-1}
  .modal-backdrop{align-items:center}
  .modal{border-radius:28px}
  .current-book{grid-template-columns:120px 1fr}
  .hero{padding:36px}
  .library-stage{min-height:640px}
  .shelf-row{min-height:148px;padding-left:22px;padding-right:22px;padding-bottom:36px}
}

@media (min-width:1000px) {
  .topbar{padding-left:36px;padding-right:36px}
  .app-content{padding-left:36px;padding-right:36px}
  .bottom-nav{bottom:18px;border:1px solid rgba(102,72,61,.10);border-radius:22px;width:620px;padding:8px 12px;box-shadow:0 16px 45px rgba(70,45,37,.12)}
  .fab{right:max(32px,calc((100vw - 1120px)/2 + 20px));bottom:110px}
  .book-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
}


/* v0.1.2 – Regalfilter & Bücherwunschliste */
.shelf-filter-chips{margin-bottom:14px;padding-bottom:6px}
.shelf-empty{position:absolute;inset:92px 34px 70px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:rgba(67,47,41,.74);background:rgba(255,248,243,.42);border:1px solid rgba(255,255,255,.45);backdrop-filter:blur(7px);border-radius:22px;z-index:3}
.shelf-empty span{font-size:38px;color:var(--rose-deep);margin-bottom:8px}
.shelf-empty strong{font-family:Georgia,serif;font-size:20px}
.shelf-empty small{margin-top:6px;max-width:250px;line-height:1.45}
.wishlist-teaser{padding:16px 18px;display:flex;align-items:center;justify-content:space-between;gap:14px}
.wishlist-teaser>div{display:flex;align-items:center;gap:12px;min-width:0}
.wishlist-teaser strong{display:block;font-family:Georgia,serif;font-size:17px}
.wishlist-teaser small{display:block;color:var(--muted);margin-top:3px}
.wishlist-heart{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;background:linear-gradient(145deg,#f3d7dc,#e7babf);color:#8f595d;font-size:23px;box-shadow:0 7px 18px rgba(143,89,93,.12)}
.wishlist-hero{position:relative;overflow:hidden;border-radius:30px;padding:26px;background:linear-gradient(135deg,#8d5e65,#be8387 58%,#e0b5b0);color:white;box-shadow:var(--shadow)}
.wishlist-hero::after{content:"♡";position:absolute;right:-8px;top:-38px;font-family:Georgia,serif;font-size:170px;color:rgba(255,255,255,.09);transform:rotate(-10deg)}
.wishlist-hero h2{position:relative;z-index:1;font-family:Georgia,serif;font-size:31px;margin:0 0 8px}
.wishlist-hero p{position:relative;z-index:1;margin:0;max-width:620px;line-height:1.55;opacity:.9}
.wishlist-hero .hero-kicker{position:relative;z-index:1;color:#fff;opacity:.75}
.wishlist-hero-actions{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.wishlist-grid{display:grid;grid-template-columns:1fr;gap:12px}
.wish-card{display:grid;grid-template-columns:72px 1fr;gap:14px;padding:12px;border-radius:22px;align-items:stretch}
.wish-cover{min-height:102px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(150deg,#dcaeb7,#a76d79 58%,#76515f);box-shadow:inset 1px 0 rgba(255,255,255,.25),0 10px 20px rgba(83,49,58,.16);position:relative;overflow:hidden}
.wish-cover::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.25),transparent 38%),linear-gradient(90deg,rgba(255,255,255,.13),transparent 18%,rgba(0,0,0,.08) 90%)}
.wish-cover span{position:relative;z-index:1;color:#fff6f8;font-size:30px}
.wish-body{min-width:0;display:flex;flex-direction:column;justify-content:center}
.wish-body h3{font-family:Georgia,serif;margin:7px 0 2px;font-size:18px;line-height:1.12}
.wish-body p{margin:0;color:var(--muted);font-size:12px}
.wish-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.priority{display:inline-flex;align-items:center;width:max-content;padding:4px 8px;border-radius:99px;font-size:9px;text-transform:uppercase;letter-spacing:.07em;font-weight:900}
.priority.high{background:#f4d8dd;color:#8d505b}
.priority.medium{background:#f1e5d7;color:#8b704c}
.priority.low{background:#e4ece2;color:#687f65}
.wish-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.wish-actions .icon-btn{font-size:10px;padding:7px 8px}
.wishlist-empty{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;gap:5px}
.wishlist-empty span{font-size:34px;color:var(--rose)}
.wishlist-empty strong{font-family:Georgia,serif;font-size:18px}
.wishlist-empty small{max-width:330px}
.share-info{padding:17px;display:grid;grid-template-columns:38px 1fr;gap:12px;align-items:start}
.share-info>span{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#f2e1dc;color:var(--rose-deep);font-weight:900}
.share-info strong{font-family:Georgia,serif;font-size:17px}
.share-info p{margin:4px 0 0;color:var(--muted);font-size:12px;line-height:1.55}
.shared-wishlist-page{max-width:900px;margin:0 auto;padding:42px 18px 60px}
.shared-wishlist-head{text-align:center;padding:20px 0 28px}
.shared-wishlist-head h1{font-size:clamp(30px,7vw,48px);margin:4px 0 8px}
.shared-wishlist-head p{color:var(--muted);margin:0 auto;max-width:520px}
.shared-wishlist-head .hero-kicker{color:var(--rose-deep)}
.shared-heart{width:64px;height:64px;display:grid;place-items:center;margin:0 auto 14px;border-radius:50%;background:linear-gradient(145deg,#f3d7dc,#dfafb8);color:#8f595d;font-size:34px;box-shadow:0 12px 28px rgba(143,89,93,.15)}
.shared-footer{text-align:center;color:var(--muted);font-size:12px;margin-top:26px}
@media(min-width:700px){.wishlist-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.wishlist-hero{padding:34px}.wish-card{grid-template-columns:86px 1fr}.shared-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:430px){.bottom-nav{padding-left:4px;padding-right:4px}.nav-item small{font-size:9px}.nav-item span{font-size:20px}.wishlist-teaser{align-items:flex-start;flex-direction:column}.wishlist-teaser .btn{width:100%}.wish-actions{flex-direction:column}.wish-actions .icon-btn{width:100%}}


/* v0.1.3 – ISBN-Automatik und exakte Regalboden-Ausrichtung */
.cover.has-image{padding:0;background:#d9c4b7!important}
.cover.has-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2}
.cover.has-image span{opacity:0}
.cover.title-only span{font-size:clamp(11px,2.8vw,16px);line-height:1.12;padding:4px}

.wish-cover.has-image{padding:0;background:#d8c1b6}
.wish-cover.has-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2}
.wish-cover.title-only span{font-family:Georgia,serif;font-size:13px;line-height:1.15;text-align:center;padding:10px;color:#fff8f5;font-weight:700;word-break:normal}

.entry-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:5px;margin:0 0 18px;border-radius:16px;background:#f1e5df;border:1px solid rgba(105,76,66,.08)}
.entry-tab{border:0;border-radius:12px;padding:11px 14px;background:transparent;color:var(--muted);font-weight:850;transition:.18s ease}
.entry-tab.active{background:#fffaf7;color:var(--rose-deep);box-shadow:0 5px 16px rgba(89,57,49,.10)}
.isbn-lookup-panel{display:grid;gap:12px}
.isbn-input-row{display:flex;gap:8px;align-items:stretch}
.isbn-input-row input{min-width:0;flex:1}
.isbn-input-row .btn{flex:0 0 auto;white-space:nowrap}
.isbn-field>small{display:block;margin-top:6px;color:var(--muted);font-size:11px;line-height:1.4}
.lookup-status{min-height:20px;font-size:12px;font-weight:700}
.lookup-working{color:#8b704c}
.lookup-success{color:#617b5d}
.lookup-error{color:#985b5b}
.auto-book-preview{display:grid;grid-template-columns:82px 1fr;gap:15px;padding:12px;align-items:stretch;border-radius:20px}
.auto-book-preview .wish-cover{min-height:122px}
.auto-book-meta{min-width:0;display:flex;flex-direction:column;justify-content:center}
.auto-book-meta h3{font-family:Georgia,serif;font-size:19px;line-height:1.12;margin:7px 0 2px}
.auto-book-meta p{margin:0;color:var(--muted);font-size:12px}
.auto-book-meta>small{display:block;color:var(--muted);font-size:10px;line-height:1.4;margin-top:8px}
.lookup-badge{display:inline-flex;width:max-content;max-width:100%;padding:4px 7px;border-radius:99px;background:#f1e5d7;color:#7e6749;font-size:9px;font-weight:900;letter-spacing:.03em}
.auto-book-details{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.auto-book-details span{display:inline-flex;padding:4px 7px;border-radius:99px;background:#f3ebe6;color:#7c6962;font-size:9px;font-weight:750}
.auto-priority{margin-top:12px}
#addAutoWish:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}

/* Jede Buchunterkante liegt exakt auf der Oberkante des Regalbodens. */
.shelf-row{align-items:flex-end}
.shelf-row>.spine,.shelf-row>.shelf-deco{align-self:flex-end;transform:none}

@media(max-width:560px){
  .isbn-input-row{flex-direction:column}
  .isbn-input-row .btn{width:100%}
  .auto-book-preview{grid-template-columns:72px 1fr}
}


/* v0.1.4 – alle aufrecht stehenden Bücher haben exakt dieselbe Höhe und Grundlinie. */
.shelf-row > .spine {
  height:94px !important;
  min-height:94px !important;
  max-height:94px !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
  align-self:flex-end !important;
  bottom:auto !important;
  top:auto !important;
  transform:none !important;
}
.preview-stage .shelf-row > .spine {
  height:86px !important;
  min-height:86px !important;
  max-height:86px !important;
}

/* v0.1.5 – Buchverwaltung, Favoriten, Bewertungen und Regal-Darstellungen */
.book-card.interactive{cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.book-card.interactive:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(73,46,38,.12);border-color:rgba(143,89,93,.22)}
.book-card.interactive:focus-visible{outline:3px solid rgba(185,120,121,.35);outline-offset:3px}
.book-card-cover-wrap{position:relative}
.favorite-button{position:absolute;top:8px;right:8px;z-index:3;width:34px;height:34px;border:1px solid rgba(255,255,255,.72);border-radius:50%;display:grid;place-items:center;background:rgba(255,250,247,.9);backdrop-filter:blur(8px);color:#9f7576;font-size:20px;line-height:1;box-shadow:0 5px 14px rgba(56,34,30,.12)}
.favorite-button.active{background:#9c5c63;color:#fff;border-color:transparent}
.book-card-footer{display:flex;align-items:center;justify-content:space-between;gap:7px;flex-wrap:wrap}
.rating-stars{font-size:13px;letter-spacing:.04em;color:#c29652;white-space:nowrap}

.display-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.display-choice{position:relative;border:1px solid var(--line);border-radius:15px;padding:12px;background:#fff;cursor:pointer;min-height:72px;display:flex;align-items:center;transition:.18s ease}
.display-choice input{position:absolute;opacity:0;pointer-events:none}
.display-choice span{display:block}
.display-choice strong{display:block;font-size:13px;color:var(--text)}
.display-choice small{display:block;margin-top:3px;color:var(--muted);font-size:11px;line-height:1.3}
.display-choice.selected{border-color:var(--rose);background:#fff6f3;box-shadow:inset 0 0 0 1px var(--rose)}
.favorite-check{display:flex!important;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:#fff8f6;cursor:pointer}
.favorite-check input{width:20px!important;height:20px;margin:0;accent-color:var(--rose-deep)}
.favorite-check span{color:var(--rose-deep);font-weight:800}
.auto-book-fields{margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.auto-book-fields[hidden]{display:none!important}
.edit-actions{justify-content:space-between;align-items:center;flex-wrap:wrap}
.edit-actions>div{display:flex;gap:8px;flex-wrap:wrap}

/* Alle stehenden Varianten teilen dieselbe Auflagekante. */
.shelf-row{align-items:flex-end}
.spine,.shelf-cover-book,.book-stack{position:relative;z-index:2;margin-bottom:4px;flex:0 0 auto}
.shelf-cover-book{height:104px;width:70px;border-radius:5px 5px 3px 3px;overflow:hidden;background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(0,0,0,.10)),var(--c);box-shadow:0 7px 13px rgba(51,31,23,.18),inset 2px 0 rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;color:#fff;text-align:center;font-family:Georgia,serif;font-size:9px;font-weight:700;padding:7px}
.shelf-cover-book img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.shelf-cover-book span{width:100%;height:100%;align-items:center;justify-content:center;position:relative;z-index:1}
.book-stack{width:72px;min-height:30px;display:flex;flex-direction:column-reverse;align-items:center;justify-content:flex-start;gap:2px}
.stacked-book{position:relative;width:calc(66px - var(--offset));height:15px;border-radius:3px 5px 5px 3px;background:linear-gradient(180deg,rgba(255,255,255,.18),transparent 34%),linear-gradient(90deg,rgba(255,255,255,.14),transparent 20%,rgba(0,0,0,.11)),var(--c);box-shadow:0 3px 6px rgba(47,29,23,.16);display:flex;align-items:center;justify-content:center;padding:0 5px;overflow:hidden}
.stacked-book::before{content:"";position:absolute;left:3px;right:3px;top:2px;height:1px;background:rgba(255,255,255,.25)}
.stacked-book span{font-family:Georgia,serif;font-size:6.5px;color:rgba(255,255,255,.94);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.stacked-book img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}

@media(max-width:520px){
  .display-choice-grid{grid-template-columns:1fr}
  .display-choice{min-height:auto}
  .shelf-cover-book{width:62px;height:96px}
  .book-stack{width:65px}
  .stacked-book{width:calc(60px - var(--offset))}
}


/* v0.1.6 – reduzierte Kategorien, mobile Regalbreite und ISBN-Kamerascan */
.shelf-scene{overflow:hidden;max-width:100%}
.shelf-row{
  --standing-book-height:94px;
  width:calc(100% - 20px);
  max-width:calc(100% - 20px);
  min-width:0;
  overflow:hidden;
  flex-wrap:nowrap;
}
.shelf-row > .spine{
  height:var(--standing-book-height)!important;
  min-height:var(--standing-book-height)!important;
  max-height:var(--standing-book-height)!important;
}
.book-stack{
  width:var(--standing-book-height)!important;
  max-width:var(--standing-book-height)!important;
}
.stacked-book{
  width:var(--standing-book-height)!important;
  max-width:var(--standing-book-height)!important;
}
.preview-stage .shelf-row{--standing-book-height:86px}
.library-stage,.shelf-scene,.shelf-row{box-sizing:border-box}

.isbn-actions{display:flex;gap:8px;flex:0 0 auto}
.btn-camera{background:linear-gradient(145deg,#9f6a70,#87545b);color:#fff;box-shadow:0 7px 18px rgba(104,61,67,.14)}
.camera-capture-input{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;overflow:hidden!important}
.hidden-barcode-reader{position:fixed;left:-10000px;top:-10000px;width:1px;height:1px;overflow:hidden;pointer-events:none}

@media(max-width:560px){
  .isbn-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .isbn-actions .btn{width:100%;min-width:0;white-space:normal}
  .shelf-scene{padding-left:8px;padding-right:8px}
  .shelf-row{margin-left:10px;margin-right:10px;padding-left:12px;padding-right:12px;gap:3px}
  .shelf-cover-book{width:58px;height:94px}
}

@media(max-width:390px){
  .isbn-actions{grid-template-columns:1fr}
  .shelf-row{padding-left:10px;padding-right:10px}
}
.lookup-source{display:inline-flex;width:max-content;max-width:100%;margin-left:6px;padding:4px 7px;border-radius:99px;background:#eee7e2;color:#7b6a64;font-size:9px;font-weight:800;letter-spacing:.02em}

.hidden{display:none !important}
.cover-choice-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.cover-source-panel{margin-top:-4px}
.cover-source-layout{display:grid;grid-template-columns:110px 1fr;gap:14px;align-items:start}
.cover-source-copy{display:grid;gap:10px}
.editable-cover-preview{width:110px;aspect-ratio:2/3;border-radius:16px;background:linear-gradient(145deg,#8d5a56,#6b4b52);display:flex;align-items:center;justify-content:center;text-align:center;padding:10px;box-shadow:0 8px 18px rgba(69,44,36,.15);overflow:hidden;color:#fff;font-family:Georgia,serif;font-weight:700}
.editable-cover-preview img{width:100%;height:100%;object-fit:cover;display:block}
.editable-cover-preview span{position:relative;z-index:1;line-height:1.1;font-size:14px}
.cropper-backdrop{position:fixed;inset:0;z-index:120;background:rgba(35,23,20,.55);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:16px}
.cropper-modal{width:min(100%,760px);background:#fffaf7;border-radius:26px;padding:20px;box-shadow:0 30px 80px rgba(30,20,18,.35)}
.cropper-stage{display:flex;justify-content:center;margin-bottom:18px}
.cropper-frame{width:min(78vw,240px);height:min(calc(78vw * 1.5),360px);max-width:240px;max-height:360px;border-radius:18px;background:#efe1d5;overflow:hidden;position:relative;box-shadow:inset 0 0 0 2px rgba(255,255,255,.7),0 16px 30px rgba(69,44,36,.16)}
.cropper-frame::after{content:"";position:absolute;inset:0;border:2px solid rgba(255,255,255,.72);border-radius:18px;pointer-events:none}
.cropper-image{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:none;max-height:none;user-select:none}
.cropper-controls{display:grid;gap:12px}
.cropper-controls label{display:grid;gap:6px;font-size:12px;font-weight:800;color:var(--text)}
.cropper-controls input[type="range"]{width:100%}
@media (max-width:560px){
  .cover-choice-grid{grid-template-columns:1fr}
  .cover-source-layout{grid-template-columns:1fr}
  .editable-cover-preview{width:100%;max-width:140px}
}

/* v0.1.10 – Bücher enger zusammen und stärker auf dem Regal */
.shelf-row{
  gap:1px !important;
  padding-left:10px;
  padding-right:10px;
}
.shelf-row > .spine,
.shelf-row > .shelf-cover-book,
.shelf-row > .book-stack,
.shelf-row > .shelf-deco{
  margin-left:0 !important;
  margin-right:0 !important;
}
.shelf-row > .spine{
  margin-bottom:0 !important;
}
.shelf-row > .shelf-cover-book{
  margin-bottom:-2px !important;
  transform:translateY(2px);
}
.shelf-row > .book-stack{
  margin-bottom:-3px !important;
  transform:translateY(3px);
}
.book-stack .stacked-book{
  box-shadow:0 2px 5px rgba(47,29,23,.18);
}
.shelf-row > .spine + .spine,
.shelf-row > .shelf-cover-book + .spine,
.shelf-row > .spine + .shelf-cover-book,
.shelf-row > .book-stack + .spine,
.shelf-row > .spine + .book-stack,
.shelf-row > .shelf-cover-book + .book-stack,
.shelf-row > .book-stack + .shelf-cover-book{
  margin-left:-1px !important;
}
@media(max-width:560px){
  .shelf-row{
    gap:0 !important;
    padding-left:8px;
    padding-right:8px;
  }
  .shelf-row > .shelf-cover-book{
    transform:translateY(3px);
  }
  .shelf-row > .book-stack{
    transform:translateY(4px);
  }
}