:root {
  color-scheme: light;
  --ink: #172033;
  --muted: #6b7485;
  --blue: #2468df;
  --blue-dark: #1555c4;
  --blue-soft: #e8f0ff;
  --surface: rgba(255,255,255,.82);
  --line: rgba(48,64,91,.1);
  --shadow: 0 16px 45px rgba(31,49,83,.1);
  --radius: 20px;
  --sidebar: 256px;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif;
  font-synthesis: none;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { background: #eef2f7; scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; min-height: 100vh; color: var(--ink); background: radial-gradient(circle at 74% -10%, #dfeaff 0, transparent 32%), #f3f6fa; }
button, input, select { font: inherit; }
button { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, input:focus-visible, select:focus-visible, a:focus-visible { outline: 3px solid rgba(36,104,223,.28); outline-offset: 2px; }
.skip-link { position: fixed; z-index: 100; left: 12px; top: -80px; padding: 10px 14px; border-radius: 12px; color: #fff; background: var(--ink); transition: top .2s; }
.skip-link:focus { top: 12px; }
.app-shell { min-height: 100vh; }
.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 20; width: var(--sidebar); display: flex; flex-direction: column; padding: 24px 16px 18px; border-right: 1px solid rgba(47,65,93,.08); background: rgba(249,251,254,.76); backdrop-filter: blur(24px) saturate(145%); -webkit-backdrop-filter: blur(24px) saturate(145%); }
.brand { display: flex; align-items: center; gap: 12px; margin: 0 8px 34px; color: inherit; text-decoration: none; }
.brand-mark { display: grid; place-items: center; position: relative; width: 40px; height: 40px; overflow: hidden; border-radius: 12px; color: white; background: linear-gradient(145deg,#2c79f0,#154eb9); box-shadow: 0 8px 18px rgba(36,104,223,.25); font-size: 16px; font-weight: 800; letter-spacing: -.28em; }
.brand-mark span:first-child { transform: translateX(-4px); }.brand-mark span:last-child { transform: translateX(4px); opacity: .72; }
.brand-copy { display: grid; gap: 2px; }.brand-copy strong { font-size: 15px; letter-spacing: -.01em; }.brand-copy small { color: var(--muted); font-size: 10.5px; }
.primary-nav, .audience-nav { display: grid; gap: 5px; }
.nav-label { margin: 30px 12px 9px; color: #9aa2b0; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.nav-item { min-height: 44px; display: flex; align-items: center; gap: 12px; width: 100%; padding: 0 12px; border: 0; border-radius: 13px; color: #5d687b; background: transparent; cursor: pointer; text-align: left; transition: .18s ease; }
.nav-item:hover { color: var(--ink); background: rgba(36,104,223,.06); }.nav-item.is-active { color: var(--blue-dark); background: #e7efff; font-weight: 650; }
.nav-item svg { width: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }.nav-item > span:nth-last-child(2) { flex: 1; }.nav-item small { margin-left: auto; color: #a1a9b6; font-size: 11px; }
.nav-dot { width: 9px; height: 9px; border-radius: 50%; box-shadow: 0 0 0 4px rgba(0,0,0,.03); }.dot-nens { background:#ff9e77; }.dot-joves { background:#8f7bff; }.dot-adults { background:#47b6a8; }
.sidebar-spacer { flex: 1; min-height: 28px; }
.demo-note { display: flex; gap: 10px; margin: 0 7px 12px; padding: 11px 12px; border: 1px solid rgba(36,104,223,.1); border-radius: 14px; background: rgba(232,240,255,.52); }.status-dot { flex: 0 0 auto; width: 7px; height: 7px; margin-top: 5px; border-radius: 50%; background: #37b777; box-shadow: 0 0 0 4px rgba(55,183,119,.11); }.demo-note strong { font-size: 11px; }.demo-note p { margin: 3px 0 0; color: var(--muted); font-size: 9.5px; line-height: 1.35; }
.profile-card { display: grid; grid-template-columns: 36px 1fr 18px; align-items: center; gap: 10px; width: 100%; padding: 10px; border: 0; border-radius: 15px; background: transparent; text-align: left; cursor: pointer; }.profile-card:hover { background: rgba(255,255,255,.7); }.avatar { display:grid; place-items:center; width:36px; height:36px; border-radius: 50%; color:#fff; background: linear-gradient(145deg,#344a73,#16223c); font-size:11px; font-weight:700; }.profile-card strong,.profile-card small { display:block; }.profile-card strong { overflow:hidden; font-size:12px; white-space:nowrap; text-overflow:ellipsis; }.profile-card small { margin-top:2px; color:var(--muted); font-size:10px; }.profile-card svg { width:16px; fill:none; stroke:#9da6b4; stroke-width:1.8; }
.main-content { min-height: 100vh; margin-left: var(--sidebar); }
.topbar { position: sticky; top: 0; z-index: 10; height: 84px; display: flex; align-items: center; gap: 16px; padding: 18px clamp(24px,4vw,64px); border-bottom: 1px solid rgba(47,65,93,.06); background: rgba(244,247,251,.72); backdrop-filter: blur(24px) saturate(160%); -webkit-backdrop-filter: blur(24px) saturate(160%); }
.mobile-menu { display:none; }.icon-button { display:grid; place-items:center; width:40px; height:40px; padding:0; border:0; border-radius:50%; background:rgba(255,255,255,.8); cursor:pointer; }.icon-button svg { width:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; }
.search-wrap { position:relative; flex: 1; max-width: 620px; }.search-wrap > svg { position:absolute; left:15px; top:50%; width:18px; transform:translateY(-50%); fill:none; stroke:#8a94a4; stroke-width:1.8; }.search-wrap input { width:100%; height:48px; padding:0 54px 0 43px; border:1px solid rgba(47,65,93,.09); border-radius:15px; color:var(--ink); background:rgba(255,255,255,.8); box-shadow:0 5px 18px rgba(31,49,83,.035); outline:none; }.search-wrap input:focus { border-color:rgba(36,104,223,.35); box-shadow:0 0 0 4px rgba(36,104,223,.08); }.search-wrap kbd { position:absolute; right:11px; top:50%; transform:translateY(-50%); padding:4px 7px; border:1px solid #dfe3e9; border-radius:7px; color:#8a94a4; background:#f4f6f8; font-family:inherit; font-size:10px; box-shadow:0 1px 0 #d7dce3; }
.import-button,.primary-button,.secondary-button { display:inline-flex; align-items:center; justify-content:center; gap:8px; height:44px; padding:0 17px; border-radius:13px; font-weight:650; font-size:13px; cursor:pointer; transition:.18s ease; }.import-button,.primary-button { border:0; color:white; background:linear-gradient(180deg,#2c73ea,#1f60d4); box-shadow:0 8px 18px rgba(36,104,223,.18); }.import-button:hover,.primary-button:hover { transform:translateY(-1px); box-shadow:0 10px 24px rgba(36,104,223,.25); }.import-button svg { width:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }.secondary-button { border:1px solid rgba(47,65,93,.13); color:#34425a; background:#fff; }
.primary-button:disabled { opacity:.72; cursor:wait; transform:none; box-shadow:none; }
.secondary-button:disabled { opacity:.62; cursor:wait; }
.content-wrap { width: min(1420px,100%); margin:0 auto; padding:38px clamp(24px,4vw,64px) 72px; }
.welcome { position:relative; overflow:hidden; display:flex; align-items:center; min-height:174px; padding:34px 40px; border:1px solid rgba(255,255,255,.86); border-radius:26px; background:linear-gradient(112deg,rgba(255,255,255,.93),rgba(241,246,255,.84)); box-shadow:var(--shadow); }.eyebrow,.section-kicker { margin:0 0 7px; color:var(--blue); font-size:10px; font-weight:750; letter-spacing:.13em; text-transform:uppercase; }.welcome h1 { margin:0; font-size:clamp(29px,3vw,42px); font-weight:700; letter-spacing:-.045em; }.welcome p:last-child { margin:9px 0 0; color:var(--muted); font-size:15px; }.welcome-orb { position:absolute; right:50px; width:125px; height:125px; border-radius:40px; background:linear-gradient(145deg,#e6efff,#bfd4ff); transform:rotate(10deg); box-shadow:inset 0 1px 1px white,0 20px 50px rgba(36,104,223,.16); }.welcome-orb span { position:absolute; border-radius:50%; background:#fff; opacity:.75; }.welcome-orb span:nth-child(1){width:48px;height:48px;left:23px;top:24px}.welcome-orb span:nth-child(2){width:28px;height:28px;right:19px;bottom:26px;background:#5f91ed}.welcome-orb span:nth-child(3){width:12px;height:12px;left:30px;bottom:22px;background:#ffb299}
.section { margin-top:42px; }.section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:18px; }.section-heading h2 { margin:0; font-size:22px; letter-spacing:-.025em; }.text-button { padding:8px 0; border:0; color:var(--blue); background:none; font-size:12px; font-weight:650; cursor:pointer; }.text-button span { font-size:18px; vertical-align:-1px; }
.recent-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; }.recent-card { display:grid; grid-template-columns:72px 1fr auto; gap:15px; align-items:center; min-width:0; padding:14px; border:1px solid var(--line); border-radius:18px; background:var(--surface); box-shadow:0 7px 25px rgba(31,49,83,.045); cursor:pointer; transition:.2s ease; }.recent-card:hover { transform:translateY(-2px); box-shadow:0 12px 28px rgba(31,49,83,.09); }.recent-cover { height:92px; border-radius:10px; }.recent-copy { min-width:0; }.recent-copy small { color:var(--blue); font-size:9px; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }.recent-copy h3 { overflow:hidden; margin:6px 0 7px; font-size:14px; white-space:nowrap; text-overflow:ellipsis; }.recent-copy p { margin:0; color:var(--muted); font-size:10.5px; }.progress { height:3px; margin-top:11px; overflow:hidden; border-radius:3px; background:#e7ebf0; }.progress span { display:block; height:100%; border-radius:inherit; background:var(--blue); }.recent-arrow { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; color:var(--blue); background:var(--blue-soft); font-size:19px; }
.catalog-heading { align-items:center; }.segmented { display:flex; gap:3px; padding:4px; border:1px solid rgba(47,65,93,.08); border-radius:12px; background:rgba(231,235,241,.68); }.segmented button { min-width:60px; height:30px; padding:0 12px; border:0; border-radius:9px; color:var(--muted); background:transparent; font-size:11px; font-weight:600; cursor:pointer; }.segmented button.is-active { color:var(--ink); background:#fff; box-shadow:0 2px 8px rgba(31,49,83,.08); }.results-meta { min-height:18px; margin:-8px 0 15px; color:var(--muted); font-size:11px; }
.book-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:32px 24px; }.book-card { min-width:0; }.book-cover-button { display:block; width:100%; padding:0; border:0; background:none; cursor:pointer; text-align:left; }.book-cover { position:relative; aspect-ratio: .72; overflow:hidden; border-radius:12px 17px 17px 12px; color:white; background:var(--cover); box-shadow:0 13px 24px rgba(26,39,67,.18),inset 3px 0 0 rgba(255,255,255,.2); transition:transform .24s ease,box-shadow .24s ease; }.book-cover::before { content:""; position:absolute; z-index:1; inset:0; pointer-events:none; background:linear-gradient(120deg,rgba(255,255,255,.2),transparent 34%,rgba(0,0,0,.09)); }.book-cover::after { content:""; position:absolute; z-index:2; right:0; top:0; bottom:0; width:6px; pointer-events:none; background:linear-gradient(90deg,transparent,rgba(0,0,0,.12)); }.book-cover-image { background:#fff; }.book-cover-image img { display:block; width:100%; height:100%; object-fit:cover; object-position:center top; }.book-cover-button:hover .book-cover { transform:translateY(-5px) rotateY(-2deg); box-shadow:0 21px 34px rgba(26,39,67,.24),inset 3px 0 0 rgba(255,255,255,.2); }.cover-inner { position:absolute; inset:0; display:flex; flex-direction:column; padding:16px 15px; }.cover-publisher { font-size:7px; font-weight:750; letter-spacing:.14em; opacity:.85; text-transform:uppercase; }.cover-art { position:relative; flex:1; margin:12px 0; }.cover-art span { position:absolute; border-radius:50%; border:1px solid rgba(255,255,255,.55); }.cover-art span:nth-child(1) { width:65%; aspect-ratio:1; left:4%; top:7%; background:rgba(255,255,255,.12); }.cover-art span:nth-child(2) { width:40%; aspect-ratio:1; right:4%; bottom:2%; background:rgba(255,255,255,.25); }.cover-art span:nth-child(3) { width:17%; aspect-ratio:1; right:18%; top:15%; background:#fff; border:0; }.cover-level { align-self:flex-start; margin-bottom:9px; padding:4px 7px; border:1px solid rgba(255,255,255,.4); border-radius:10px; background:rgba(255,255,255,.14); font-size:7px; font-weight:700; backdrop-filter:blur(8px); }.cover-title { font-size:clamp(13px,1.35vw,19px); font-weight:750; line-height:.96; letter-spacing:-.04em; }.cover-subtitle { margin-top:5px; font-size:7px; opacity:.82; }.book-info { padding:12px 2px 0; }.book-meta { display:flex; align-items:center; gap:7px; color:var(--muted); font-size:9px; font-weight:600; }.audience-chip { width:6px; height:6px; border-radius:50%; }.book-info h3 { overflow:hidden; margin:5px 0 3px; font-size:13px; line-height:1.25; white-space:nowrap; text-overflow:ellipsis; }.book-info p { margin:0; color:var(--muted); font-size:10px; }
.book-info { position:relative; padding-right:28px; }.manage-book-button { position:absolute; right:-3px; bottom:-4px; width:28px; height:28px; padding:0 0 7px; border:0; border-radius:50%; color:#6f7b8e; background:transparent; font-size:15px; font-weight:700; letter-spacing:1px; cursor:pointer; }.manage-book-button:hover { color:var(--blue); background:var(--blue-soft); }
.theme-cobalt{--cover:linear-gradient(150deg,#225ed8,#173d91)}.theme-coral{--cover:linear-gradient(150deg,#ff8b70,#d94d58)}.theme-mint{--cover:linear-gradient(150deg,#3db8a5,#187b84)}.theme-violet{--cover:linear-gradient(150deg,#8d78ec,#4c3c9c)}.theme-amber{--cover:linear-gradient(150deg,#f2ab43,#c56b25)}.theme-sky{--cover:linear-gradient(150deg,#5aaee8,#1e6aa6)}.theme-slate{--cover:linear-gradient(150deg,#63748d,#26364e)}
.empty-state { padding:55px 20px; border:1px dashed #d5dbe5; border-radius:20px; text-align:center; }.empty-icon { width:48px; height:48px; display:grid; place-items:center; margin:0 auto 15px; border-radius:15px; color:var(--blue); background:var(--blue-soft); font-size:26px; }.empty-state h3{margin:0 0 6px}.empty-state p{margin:0 0 20px;color:var(--muted);font-size:13px}
.sheet-dialog { width:100%; height:100%; max-width:none; max-height:none; padding:0; border:0; background:transparent; }.sheet-dialog::backdrop { background:rgba(17,27,45,.38); backdrop-filter:blur(7px); }.dialog-panel { position:relative; border:1px solid rgba(255,255,255,.7); border-radius:25px; background:rgba(251,252,254,.97); box-shadow:0 35px 100px rgba(15,26,48,.25); }.sheet-dialog[open] .dialog-panel { animation:dialogIn .25s ease both; }@keyframes dialogIn{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
.dialog-close { position:absolute; z-index:2; right:18px; top:18px; color:#596579; background:#edf0f4; }.book-panel { width:min(720px,calc(100% - 32px)); min-height:400px; margin:8vh auto 0; padding:34px; }.book-detail { display:grid; grid-template-columns:190px 1fr; gap:34px; align-items:start; }.book-detail .book-cover { width:190px; }.book-detail-copy { padding-top:10px; }.book-detail-copy .section-kicker { margin-bottom:10px; }.book-detail-copy h2 { min-width:0; margin:0; padding-right:8px; font-size:30px; letter-spacing:-.04em; }.book-title-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-right:36px; }.edit-detail-button { flex:0 0 auto; height:34px; padding:0 11px; font-size:10px; }.book-detail-copy > p { margin:10px 0 24px; color:var(--muted); font-size:13px; line-height:1.55; }.edition-list { display:grid; gap:9px; }.edition-button { display:grid; grid-template-columns:34px 1fr auto; align-items:center; gap:12px; width:100%; padding:11px 12px; border:1px solid rgba(47,65,93,.1); border-radius:14px; background:#fff; cursor:pointer; text-align:left; transition:.17s ease; }.edition-button:hover { border-color:rgba(36,104,223,.26); box-shadow:0 5px 14px rgba(36,104,223,.08); }.edition-icon { display:grid; place-items:center; width:34px; height:34px; border-radius:10px; color:var(--blue); background:var(--blue-soft); font-size:15px; }.edition-button strong { display:block; font-size:12px; }.edition-button small { color:var(--muted); font-size:9px; }.edition-button > span:last-child { color:var(--blue); font-size:18px; }
.import-panel { width:min(690px,calc(100% - 32px)); margin:7vh auto 0; padding:34px; }.import-heading { display:grid; grid-template-columns:48px 1fr; gap:15px; padding-right:42px; }.import-icon { display:grid; place-items:center; width:48px; height:48px; border-radius:15px; color:var(--blue); background:var(--blue-soft); }.import-icon svg{width:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}.import-heading h2{margin:0;font-size:25px;letter-spacing:-.035em}.import-heading p:last-child{margin:7px 0 0;color:var(--muted);font-size:11px;line-height:1.45}.import-steps{display:flex;align-items:center;justify-content:center;margin:28px 0 23px}.import-steps span{display:grid;place-items:center;width:26px;height:26px;border:1px solid #dbe1e9;border-radius:50%;color:#9aa3b1;background:#fff;font-size:10px;font-weight:700}.import-steps span.is-active{border-color:var(--blue);color:#fff;background:var(--blue)}.import-steps i{width:56px;height:1px;background:#dde2e9}.drop-zone{display:grid;place-items:center;min-height:220px;padding:25px;border:1.5px dashed #bfc9d8;border-radius:18px;color:var(--muted);background:rgba(240,244,249,.65);text-align:center;cursor:pointer;transition:.18s ease}.drop-zone:hover,.drop-zone.is-dragging{border-color:var(--blue);background:var(--blue-soft)}.drop-zone svg{width:38px;margin-bottom:12px;fill:none;stroke:var(--blue);stroke-width:1.5}.drop-zone strong{color:var(--ink);font-size:14px}.drop-zone span{margin-top:5px;font-size:10px}.drop-zone em{margin-top:16px;padding:5px 9px;border-radius:8px;color:#69758a;background:#e7ebf1;font-size:9px;font-style:normal}.drop-zone input{position:absolute;width:1px;height:1px;opacity:0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form-grid label{display:grid;gap:7px}.form-grid label>span{color:#5e6a7d;font-size:10px;font-weight:650}.full-field{grid-column:1/-1}.form-grid input,.form-grid select{width:100%;height:44px;padding:0 12px;border:1px solid #dce2e9;border-radius:11px;color:var(--ink);background:white;font-size:12px}.review-check{display:flex;gap:14px;padding:18px;border-radius:16px;background:#eef8f2}.review-check>span{display:grid;place-items:center;flex:0 0 auto;width:34px;height:34px;border-radius:50%;color:#fff;background:#37a86d}.review-check h3{margin:0;font-size:14px}.review-check p{margin:5px 0 0;color:#587065;font-size:10px;line-height:1.5}.review-step dl{display:grid;grid-template-columns:auto 1fr;gap:10px 22px;margin:18px 4px 0;font-size:11px}.review-step dt{color:var(--muted)}.review-step dd{margin:0;font-weight:650;text-align:right}.dialog-actions{display:flex;align-items:center;gap:10px;margin-top:24px}.dialog-actions>span{flex:1}
.edit-layout { display:grid; grid-template-columns:120px 1fr; gap:22px; align-items:start; margin-top:26px; }.edit-cover-preview .book-cover { width:120px; }.file-management { display:grid; grid-template-columns:1fr auto; gap:6px 12px; align-items:center; margin-top:20px; padding:15px; border:1px solid var(--line); border-radius:14px; background:#fff; }.file-management label { grid-column:1/-1; }.file-management label strong,.file-management label span { display:block; }.file-management label strong { font-size:11px; }.file-management label span { margin-top:3px; color:var(--muted); font-size:9px; }.file-management input { min-width:0; font-size:10px; }.file-management .secondary-button { height:36px; font-size:10px; }.danger-button { height:40px; padding:0 13px; border:1px solid rgba(210,55,65,.16); border-radius:12px; color:#c7313d; background:#fff1f2; font-size:11px; font-weight:650; cursor:pointer; }.danger-button:hover { background:#ffe5e8; }.profile-panel { width:min(460px,calc(100% - 32px)); margin:15vh auto 0; padding:34px; }.profile-panel h2 { margin:0; font-size:25px; letter-spacing:-.035em; }.profile-panel>p:not(.section-kicker) { margin:8px 0 24px; color:var(--muted); font-size:11px; }.profile-name-field { display:grid; gap:7px; }.profile-name-field span { color:#5e6a7d; font-size:10px; font-weight:650; }.profile-name-field input { height:46px; padding:0 13px; border:1px solid #dce2e9; border-radius:11px; font-size:13px; }
.field-help { margin-top:-2px; color:var(--muted); font-size:9px; font-weight:400; line-height:1.4; }
.toast { position:fixed; z-index:80; left:50%; bottom:26px; max-width:min(420px,calc(100% - 32px)); padding:12px 16px; border-radius:13px; color:#fff; background:rgba(24,34,53,.92); box-shadow:0 12px 30px rgba(17,27,45,.2); font-size:11px; opacity:0; pointer-events:none; transform:translate(-50%,12px); transition:.2s ease; }.toast.is-visible{opacity:1;transform:translate(-50%,0)}
@media (max-width:1180px){.book-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 20px}.recent-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.recent-card:last-child{display:none}}
@media (max-width:900px){:root{--sidebar:232px}.content-wrap,.topbar{padding-left:24px;padding-right:24px}.book-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.welcome-orb{right:30px;transform:scale(.8) rotate(10deg);transform-origin:right center}.segmented button{min-width:auto}}
@media (max-width:740px){body{background:#f5f7fa}.sidebar{width:min(290px,84vw);transform:translateX(-105%);transition:transform .25s ease;box-shadow:20px 0 50px rgba(20,33,57,.12)}body.menu-open .sidebar{transform:none}.mobile-scrim{position:fixed;inset:0;z-index:15;background:rgba(17,27,45,.28)}.main-content{margin-left:0}.topbar{height:72px;padding:12px 16px;gap:10px}.mobile-menu{display:grid;flex:0 0 auto}.search-wrap kbd{display:none}.search-wrap input{height:44px;padding-right:12px}.import-button{width:44px;padding:0}.import-button span{display:none}.content-wrap{padding:24px 16px 56px}.welcome{min-height:142px;padding:25px 24px}.welcome h1{max-width:75%;font-size:29px}.welcome p:last-child{font-size:13px}.welcome-orb{right:10px;transform:scale(.6) rotate(10deg)}.section{margin-top:34px}.recent-grid{display:flex;overflow-x:auto;margin:0 -16px;padding:0 16px 10px;scroll-snap-type:x mandatory}.recent-card{flex:0 0 82%;scroll-snap-align:start}.recent-card:last-child{display:grid}.catalog-heading{align-items:flex-start;flex-direction:column}.segmented{width:100%;overflow:auto}.segmented button{flex:1}.book-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 16px}.book-cover{border-radius:10px 14px 14px 10px}.cover-title{font-size:17px}.book-panel,.import-panel{position:absolute;inset:auto 0 0;width:100%;margin:0;padding:26px 20px calc(22px + env(safe-area-inset-bottom));border-radius:25px 25px 0 0;max-height:92vh;overflow:auto}.book-detail{grid-template-columns:100px 1fr;gap:18px}.book-detail .book-cover{width:100px}.book-detail-copy{padding-top:0}.book-detail-copy h2{font-size:23px}.book-detail-copy>p{margin:8px 0 15px}.edition-button{grid-template-columns:30px 1fr auto}.edition-icon{width:30px;height:30px}.import-heading{grid-template-columns:40px 1fr;gap:12px}.import-icon{width:40px;height:40px}.form-grid{grid-template-columns:1fr}.full-field{grid-column:auto}.drop-zone{min-height:190px}}
@media (max-width:740px){.profile-panel{position:absolute;inset:auto 0 0;width:100%;margin:0;padding:28px 20px calc(22px + env(safe-area-inset-bottom));border-radius:25px 25px 0 0}.book-title-row{display:block;padding-right:34px}.edit-detail-button{margin-top:8px}.edit-layout{grid-template-columns:78px 1fr;gap:15px}.edit-cover-preview .book-cover{width:78px}.file-management{grid-template-columns:1fr}.file-management input,.file-management .secondary-button{width:100%}.dialog-actions{flex-wrap:wrap}.danger-button{order:3;width:100%}}
@media (max-width:390px){.book-grid{gap:22px 12px}.cover-inner{padding:13px 12px}.cover-title{font-size:15px}.book-detail{grid-template-columns:78px 1fr}.book-detail .book-cover{width:78px}.edition-button{padding:9px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}