/* Floating books, with the original cover view one switch away. */
.shelf-view-toggle{display:inline-flex;gap:4px;padding:4px;border:1px solid var(--line,#33483b);border-radius:9px;margin:0 0 25px;background:#0b130f}
.shelf-view-toggle button{border:0;background:transparent;color:#9eafa3;padding:10px 14px;min-height:42px;font:12px ui-monospace,monospace;border-radius:6px}
.shelf-view-toggle button[aria-pressed=true]{background:#1f392a;color:#d9f6df}
.shelf-grid[data-view=floating]{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 38px;padding:14px 0 24px}
.shelf-grid[data-view=floating] .shelf-card{overflow:visible;background:transparent;border:0;border-radius:0;box-shadow:none;display:flex;flex-direction:column;align-items:stretch;perspective:1000px;min-width:0}
.shelf-grid[data-view=floating] .shelf-cover{width:76%;margin:0 auto 25px;aspect-ratio:5/7;max-width:310px;border:1px solid #adc6b54d;border-radius:5px 17px 17px 5px;box-shadow:-9px 1px 0 -2px color-mix(in srgb,var(--shelf-color) 68%,black),-10px 1px 0 -1px color-mix(in srgb,var(--shelf-color) 70%,white),7px 26px 25px -17px #000c,inset 12px 0 18px -14px #000;transform:rotateY(-9deg) rotateZ(-2deg);animation:shelf-float 7s ease-in-out infinite;transform-origin:50% 60%;border-bottom:1px solid #91ad9a60}
.shelf-grid[data-view=floating] .shelf-card:nth-child(even) .shelf-cover{animation-delay:-3.5s}
.shelf-grid[data-view=floating] .shelf-cover:hover{animation-play-state:paused;filter:brightness(1.08)}
.shelf-grid[data-view=floating] .shelf-cover-copy{padding:22px 20px 20px 30px;justify-content:space-between}
.shelf-grid[data-view=floating] .shelf-cover-copy>strong{font:550 clamp(19px,3vw,33px)/1.14 Arial,Helvetica,sans-serif;letter-spacing:-.045em;margin:auto 0;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.shelf-grid[data-view=floating] .shelf-cover-copy>span:not(.eyebrow):not(.shelf-open-label):not(.shelf-featured){display:none}
.shelf-grid[data-view=floating] .shelf-cover.has-art .shelf-cover-copy{justify-content:space-between;background:linear-gradient(#04130d20,#04130d12 25%,#04130deb)}
.shelf-grid[data-view=floating] .shelf-cover.has-art .shelf-cover-copy>strong{margin-top:auto;margin-bottom:18px}
.shelf-grid[data-view=floating] .shelf-featured{height:55px;margin-top:10px}
.shelf-grid[data-view=floating] .shelf-open-label{font-size:9px;margin-top:14px}.shelf-grid[data-view=floating] .shelf-cover-copy .eyebrow{font-size:8px;letter-spacing:.08em}
.shelf-grid[data-view=floating] .shelf-card-info{padding:0 0 22px;text-align:center;border-bottom:1px solid #6686723d}
.shelf-grid[data-view=floating] .shelf-card-info h2{font:500 18px/1.4 Arial,Helvetica,sans-serif;letter-spacing:-.025em}
.shelf-grid[data-view=floating] .shelf-card-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;max-width:350px;margin:auto}
.shelf-grid[data-view=floating] .shelf-card-actions .button{font-size:11px;padding:10px 3px;min-width:0;min-height:44px;gap:4px;background:transparent}
.shelf-grid[data-view=floating] .shelf-new{min-height:270px;margin:0 0 22px;background:transparent;border-color:#45665050;align-self:stretch}
.shelf-grid[data-view=floating] .shelf-reveal{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}
.shelf-grid[data-view=floating] .shelf-visible{opacity:1;transform:none}
.shelf-values{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:18px 0 22px;border-top:1px solid #42604c33;color:#d2e6d6}
.shelf-values p{font-size:14px;line-height:1.7;margin:0 0 5px}.shelf-values small{display:block;color:#8fa697;font:10px/1.6 ui-monospace,monospace}
.page-jump{display:inline-flex;align-items:center;gap:6px;margin-left:8px;padding-left:10px;border-left:1px solid var(--line,#3f5347)}
.page-jump label{font:10px ui-monospace,monospace;color:#9caf9f}.page-jump input{width:3.2em;min-width:0;padding:5px;border:1px solid #3d5946;border-radius:5px;background:#0b140f;color:#dcedde;text-align:center;font-size:16px;height:36px}.page-jump button{min-height:36px;min-width:32px;padding:5px}
body #card-dialog>.modal-top{background:var(--bg,#101413);border:0;border-radius:0;padding:10px 0 20px;margin:0 0 16px;gap:18px;align-items:center;box-shadow:none}
body #card-dialog .closer-look-title{font:italic 700 clamp(27px,5vw,40px)/1.18 Arial,Helvetica,sans-serif;letter-spacing:-.065em;text-transform:none;color:#e5f1e9;padding:0 6px 0 0;margin:0;overflow:visible}
body #card-dialog #close-card{flex:none;width:42px;height:42px;border:1px solid #50665666;border-radius:50%;padding:10px;background:transparent}
@keyframes shelf-float{0%,100%{transform:translateY(0) rotateY(-9deg) rotateZ(-2deg)}50%{transform:translateY(-9px) rotateY(-5deg) rotateZ(-1deg)}}
@media(max-width:600px){.shelf-grid[data-view=floating]{gap:30px 17px}.shelf-grid[data-view=floating] .shelf-cover{width:85%;margin-bottom:20px}.shelf-grid[data-view=floating] .shelf-cover-copy{padding:13px 10px 14px 18px}.shelf-grid[data-view=floating] .shelf-card-info h2{font-size:14px}.shelf-grid[data-view=floating] .shelf-card-info>p{font-size:10px;line-height:1.6}.shelf-grid[data-view=floating] .shelf-card-actions{gap:3px}.shelf-grid[data-view=floating] .shelf-card-actions .button{font-size:9px;padding:8px 1px;flex-direction:column;gap:3px}.shelf-grid[data-view=floating] .shelf-new{min-height:230px;padding:16px 9px}.shelf-grid[data-view=floating] .shelf-new>strong{font-size:20px}.shelf-grid[data-view=floating] .shelf-featured{height:33px}.shelf-grid[data-view=floating] .shelf-cover-copy .eyebrow{font-size:6px}.shelf-grid[data-view=floating] .shelf-open-label{font-size:7px}.shelf-values p{font-size:12px}.page-nav-main{flex-wrap:wrap}.page-jump{margin-left:2px;padding-left:6px;gap:4px}}
@media(prefers-reduced-motion:reduce){.shelf-grid[data-view=floating] .shelf-cover{animation:none}.shelf-grid[data-view=floating] .shelf-reveal{opacity:1;transform:none;transition:none}}

/* The narrow binding crease is a transparent material shade over the saved artwork. */
.shelf-cover-spine{background:linear-gradient(90deg,#0002,transparent 65%,#ffffff12);pointer-events:none}
#cover-preview{height:auto!important;min-height:0!important;aspect-ratio:5/7;width:min(100%,240px)}
.cover-upload>small{font-size:10px;line-height:1.6;color:#a5b79c}.cover-upload input[type=range]{min-width:0;width:100%;min-height:32px}

/* Covers lead the shelf. Secondary tools share one keyboard-accessible drawer. */
body[data-site-view=shelf] .workspace{padding-top:20px}
#site-shelf .shelf-heading{display:flex;flex-direction:row;align-items:center;gap:16px;margin:0 0 16px}
#site-shelf .shelf-heading>div{width:auto;flex:1;min-width:0}
#site-shelf .shelf-heading h1{font-size:clamp(28px,4vw,38px);line-height:1.1;margin:0 0 6px}
#site-shelf .shelf-heading .shelf-count{display:block;padding:0;border:0;background:none;font:11px/1.5 var(--ui-mono,monospace);color:#9ab3a3}
#site-shelf #shelf-create{flex:none;min-height:44px;max-width:48%;padding:11px 15px;font-size:13px;gap:7px}
#shelf-tools{margin:0 0 22px;border:1px solid #2a3d31;border-radius:12px;background:#0c140f;min-width:0}
#shelf-tools>summary{display:flex;align-items:center;gap:9px;min-height:46px;padding:10px 13px;box-sizing:border-box;list-style:none;cursor:pointer;color:#d2e6d9;font:500 13px/1.5 var(--ui-sans,Arial,sans-serif)}
#shelf-tools>summary::-webkit-details-marker{display:none}
#shelf-tools>summary>.icon{width:17px;height:17px;flex:none;color:#9eb8a8}
#shelf-tools>summary small{font-size:11px;font-weight:400;color:#91a89a}
#shelf-tools .shelf-tools-chevron{margin-left:auto;font-size:18px;line-height:1;transition:transform .15s}
#shelf-tools[open] .shelf-tools-chevron{transform:rotate(180deg)}
#shelf-tools>summary:focus-visible{outline:2px solid var(--lime,#00c853);outline-offset:4px;border-radius:10px}
#shelf-tools[open]>summary{border-bottom:1px solid #2a3d31}
#shelf-tools .shelf-tools-content{display:grid;gap:18px;padding:16px;min-width:0}
#shelf-tools .shelf-tools-content>div{min-width:0}
#shelf-tools .shelf-label-search{border:0;border-radius:0;padding:0;margin:0}
#shelf-tools .shelf-label-search>summary{font-size:13px;min-height:36px}
#shelf-tools .shelf-label-search>summary span{font-size:11px}
#shelf-tools .shelf-label-controls input,#shelf-tools .shelf-label-controls select{width:100%;min-width:0;box-sizing:border-box}
#shelf-tools .shelf-label-actions>span{flex-wrap:wrap}
#shelf-tools .shelf-values{max-width:none;gap:12px;margin:0;padding:16px 0;border-block:1px solid #2a3d31}
#shelf-tools .shelf-values p{margin:0 0 5px;font-size:13px}
#shelf-tools .shelf-values small{font:11px/1.6 var(--ui-sans,Arial,sans-serif)}
#shelf-tools .shelf-values .button{min-height:44px;font-size:12px}
#shelf-tools .shelf-toolbar{display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:0;border:0}
#shelf-tools .shelf-backup-actions{display:flex;flex:1 1 260px;flex-wrap:wrap;gap:8px;margin:0}
#shelf-tools .shelf-backup-actions>.button{flex:1;white-space:nowrap}
#shelf-tools .shelf-toolbar .button{min-height:44px;width:auto;padding:10px;font-size:12px}
#shelf-tools .shelf-history-actions{margin-left:auto;gap:6px}
#shelf-tools .shelf-history-label{position:static;width:auto;height:auto;margin:0;overflow:visible;clip-path:none;white-space:normal}
#shelf-tools .shelf-view-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
#shelf-tools .shelf-tool-label{font-size:12px;color:#a1b8a9}
#shelf-tools .shelf-view-toggle{margin:0;max-width:100%}
#shelf-tools .shelf-view-toggle button{min-height:44px;font:12px/1.4 var(--ui-sans,Arial,sans-serif);padding:9px 13px}
#shelf-tools .bp-shopping-tools{margin:0}
#site-shelf>#shelf-note{margin:8px 0 18px;font-size:12px}
#site-shelf>#guest-recovery{padding:14px;border:1px solid #9a783c;border-radius:10px;background:#241e11;color:#f4e5c6}
@media(max-width:600px){
 body[data-site-view=shelf] .workspace{padding-top:16px}
 #site-shelf .shelf-heading{gap:10px;margin-bottom:14px}
 #site-shelf .shelf-heading h1{font-size:28px}
 #site-shelf #shelf-create{padding:10px 12px;font-size:12px}
 #shelf-tools{margin-bottom:18px}
 #shelf-tools .shelf-tools-content{padding:12px}
 #shelf-tools .shelf-label-controls{grid-template-columns:repeat(2,minmax(0,1fr))}
 #shelf-tools .shelf-label-controls>label:first-child{grid-column:1/-1}
}
@media(prefers-reduced-motion:reduce){#shelf-tools .shelf-tools-chevron{transition:none}}