/* Locked reference composition. All rules are isolated to the book component. */
@font-face { font-family:"Book ribbon title"; font-weight:400; font-style:normal; font-display:swap; src:url('/assets/book-title-anton.ttf') format('truetype'); }
@font-face { font-family:"Book editorial"; font-weight:400; font-style:normal; font-display:swap; src:url('/assets/book-editorial-regular.ttf') format('truetype'); }
@font-face { font-family:"Book editorial"; font-weight:400; font-style:italic; font-display:swap; src:url('/assets/book-editorial-italic.ttf') format('truetype'); }
#book.book-ribbon { display:grid; grid-template-rows:auto auto; margin:0; padding:0; background:#1b1c19; color:var(--paper); isolation:isolate; }
#book .book-ribbon-main { display:grid; grid-template-columns:minmax(0,28fr) minmax(0,72fr); align-items:center; gap:clamp(2rem,3.5vw,4rem); width:100%; max-width:none; margin:0; padding:2.5rem 4vw 1.5rem; }
#book .book-ribbon-copy { min-width:0; margin:0; padding:0; }
#book .book-ribbon-copy .section-number { margin:0 0 .6rem; padding:0; color:#bdbab1; font:500 .65rem/1.3 var(--sans); letter-spacing:.14em; }
#book .book-ribbon-copy h2 { margin:0 0 1rem; padding:0; color:var(--paper); font:400 clamp(3rem,7.7vw,9.5rem)/1.02 "Book ribbon title",var(--sans); letter-spacing:-.025em; }
#book .book-ribbon-intro { max-width:none; margin:0; padding:0; color:var(--paper); font:italic 400 clamp(1.4rem,2.35vw,3rem)/1.24 "Book editorial",Georgia,serif; letter-spacing:0; }
#book .book-ribbon-intro>span { display:block; }
#book .book-ribbon-details { display:grid; grid-template-columns:1.05fr 1.2fr .9fr; align-items:start; gap:clamp(1rem,1.8vw,2rem); margin:clamp(1.5rem,2.6vw,3rem) 0 0; padding:0; }
#book .book-ribbon-details>div { min-width:0; margin:0; padding:0; }
#book .book-ribbon-details>div+div { border-left:1px solid #c75b32; padding-left:clamp(1rem,1.8vw,2rem); }
#book .book-ribbon-details h3 { margin:0 0 .55rem; padding:0; color:#e96532; font:600 clamp(1.2rem,2vw,2rem)/1.12 var(--serif); }
#book .book-ribbon-details p { margin:0; padding:0; color:var(--paper); font:400 clamp(1rem,1.75vw,1.75rem)/1.28 "Book editorial",Georgia,serif; }
#book .book-ribbon-buy { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:.8rem; align-self:center; }
#book .book-ribbon-buy a { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; min-height:2.75rem; margin:0; padding:.65rem 1rem; border:0; border-radius:.3rem; background:var(--paper); color:var(--ink); font:600 clamp(1rem,1.5vw,1.5rem)/1.2 var(--serif); text-align:center; text-decoration:none; }
#book .book-ribbon-buy a:hover { background:#fffaf0; }
#book .book-ribbon-buy>span { display:block; margin:0; color:#c4c1b8; font:400 clamp(.65rem,1vw,.95rem)/1.35 var(--sans); }
#book a:focus-visible { outline:2px solid #e96532; outline-offset:5px; }
#book .book-ribbon-responses { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:center; gap:2.25rem; width:100%; max-width:none; margin:0; padding:2.25rem 4vw; background:var(--paper); color:var(--ink); }
#book .book-ribbon-responses blockquote { position:relative; min-width:0; margin:0; padding:0 0 0 2.75rem; border:0; align-self:stretch; display:flex; flex-direction:column; justify-content:center; }
#book .book-ribbon-responses blockquote::before { content:'“'; position:absolute; left:0; top:calc(50% - 3.5rem); color:#c75b32; font:700 4rem/1 var(--serif); }
#book .book-ribbon-responses blockquote+blockquote { border-left:1px solid #c75b32; padding-left:3rem; }
#book .book-ribbon-responses blockquote+blockquote::before { left:.4rem; }
#book .book-ribbon-responses p { margin:0; padding:0; border:0; font:400 clamp(1.15rem,1.9vw,2.15rem)/1.24 "Book editorial",Georgia,serif; color:var(--ink); }
#book .book-ribbon-attribution { display:block; margin:.75rem 0 0; padding:0; border:0; background:transparent; color:var(--ink); text-align:left; }
#book .book-ribbon-attribution cite { display:block; margin:0; padding:0; font:600 clamp(1.05rem,1.5vw,1.6rem)/1.15 var(--serif); color:#b94d28; letter-spacing:0; }
#book .book-ribbon-attribution>span { display:block; margin:.25rem 0 0; padding:0; color:var(--ink); font:400 clamp(.85rem,1.2vw,1.15rem)/1.2 "Book editorial",Georgia,serif; }
@media(min-width:1101px) and (min-height:700px) {
 #book.book-ribbon { height:auto; min-height:0; grid-template-rows:auto minmax(30svh,max-content); }
 #book .book-ribbon-main { min-height:0; padding-top:3svh; padding-bottom:1.5svh; }
 #book .book-ribbon-copy h2 { font-size:clamp(3rem,min(7.7vw,12svh),9.5rem); }
 #book .book-ribbon-intro { font-size:clamp(1.4rem,min(2.35vw,3.7svh),3rem); }
 #book .book-ribbon-details { margin-top:clamp(1.5rem,3.5svh,3rem); }
 #book .book-ribbon-details h3 { font-size:clamp(1.2rem,min(2vw,3svh),2rem); }
 #book .book-ribbon-details p { font-size:clamp(1rem,min(1.75vw,2.7svh),1.75rem); }
 #book .book-ribbon-responses { min-height:0; padding-block:3svh; }
 #book .book-ribbon-responses p { font-size:clamp(1.15rem,min(1.9vw,3.1svh),2.15rem); }
}
@media(max-width:1100px), (max-height:699px) {
 #book.book-ribbon { height:auto; }
 #book .book-ribbon-intro>span { display:inline; }
 #book .book-ribbon-details { grid-template-columns:1fr 1fr; }
 #book .book-ribbon-details>.book-ribbon-buy { grid-column:1/-1; border-left:0; padding:0; flex-direction:row; align-items:center; justify-content:flex-start; }
}
@media(max-width:760px) {
 #book .book-ribbon-main { grid-template-columns:1fr; gap:1.75rem; padding:2rem 1.25rem; }
 #book .book-ribbon-copy h2 { font-size:clamp(2.8rem,10vw,4.5rem); }
 #book .book-ribbon-intro { font-size:1.4rem; }
 #book .book-ribbon-responses { grid-template-columns:1fr; gap:1.5rem; padding:1.75rem 1.25rem; }
 #book .book-ribbon-responses blockquote { padding:0 0 0 2.25rem; }
 #book .book-ribbon-responses blockquote+blockquote { border-left:0; border-top:1px solid #c75b3266; padding:1.5rem 0 0 2.25rem; }
 #book .book-ribbon-responses blockquote::before { top:-.25rem; font-size:3rem; }
 #book .book-ribbon-responses blockquote+blockquote::before { top:1.25rem; left:0; }
 #book .book-ribbon-responses p { font-size:1.3rem; }
}
@media(max-width:380px) { #book .book-ribbon-details { grid-template-columns:1fr; } #book .book-ribbon-details>div+div { border-left:0; border-top:1px solid #c75b3266; padding:1rem 0 0; } #book .book-ribbon-details>.book-ribbon-buy { grid-column:auto; flex-wrap:wrap; } }

/* Preserve the accepted background and quotation treatment. */
#book .book-ribbon-main { background:radial-gradient(ellipse at 24% 44%,#292923 0%,#1b1c19 64%); }
#book .book-ribbon-responses { background:linear-gradient(180deg,#e6e1d6 0%,var(--paper) 28%); }
#book .book-ribbon-responses blockquote { display:grid; grid-template-columns:2.25rem minmax(0,1fr); grid-template-rows:auto auto; align-content:center; align-items:start; justify-content:normal; padding-left:0; }
#book .book-ribbon-responses blockquote::before { position:static; grid-column:1; grid-row:1; margin-top:-.25rem; }
#book .book-ribbon-responses blockquote+blockquote { padding-left:1.5rem; }
#book .book-ribbon-responses p { grid-column:2; grid-row:1; }
#book .book-ribbon-attribution { grid-column:2; grid-row:2; }
@media(max-width:760px) {
 #book .book-ribbon-responses blockquote+blockquote { padding:1.5rem 0 0; }
 #book .book-ribbon-responses blockquote+blockquote::before { position:static; margin-top:-.25rem; }
}

/* Screenshot-led correction: retain the approved quote strip verbatim. */
#book .book-ribbon-details h3 { color:var(--red); }
#book .book-ribbon-details>div+div { border-left-color:var(--red); }
@media(min-width:900px) {
 #book .book-ribbon-main { grid-template-columns:minmax(0,30fr) minmax(0,70fr); gap:2.5vw; min-height:0; padding-top:clamp(2.5rem,4svh,3.5rem); padding-bottom:0; }
 #book .book-ribbon-intro { font-size:clamp(1.15rem,2.1vw,2.65rem); line-height:1.25; }
 #book .book-ribbon-intro>span { display:block; text-wrap:balance; }
 #book .book-ribbon-details { grid-template-columns:minmax(0,1.05fr) minmax(0,1.2fr) minmax(0,.9fr); gap:1.5vw; }
 #book .book-ribbon-details>div+div { padding-left:1.5vw; }
 #book .book-ribbon-details h3 { font-size:clamp(1rem,1.65vw,1.75rem); }
 #book .book-ribbon-details p { font-size:clamp(.95rem,1.55vw,1.65rem); line-height:1.28; text-wrap:pretty; }
 #book .book-ribbon-details>.book-ribbon-buy { grid-column:auto; border-left:0; padding-left:0; flex-direction:column; align-items:flex-start; justify-content:center; }
 #book .book-ribbon-buy a { width:max-content; max-width:100%; padding:.75rem 1.25rem; font-size:clamp(.95rem,1.5vw,1.5rem); }
 #book .book-ribbon-buy>span { white-space:nowrap; font-size:clamp(.55rem,.85vw,.9rem); }
}

/* Physical book: one size definition per breakpoint, with two independent floor shadows.
   Only the image is clipped. Both shadows sit behind the unfiltered link and remain
   above the next row because the figure owns its stacking context. */
#book .book-ribbon-main { overflow:visible; }
#book .book-ribbon-object { position:relative; z-index:1; isolation:isolate; overflow:visible; align-self:end; justify-self:center; min-width:0; width:100%; max-width:22rem; height:auto; aspect-ratio:420/640; margin:0 0 -2rem; }
#book .book-ribbon-object a { position:relative; z-index:1; display:block; width:100%; height:auto; filter:none; }
#book .book-ribbon-object img { display:block; width:100%; height:auto; max-height:none; object-fit:contain; filter:none; clip-path:polygon(3.3% 4.2%,10.2% 2.3%,96% 4.5%,96% 95.9%,10.2% 97.7%,3.3% 96.2%); }
/* The vector contains only floor shadows, mapped to the untouched 420 x 640 image.
   Its contact path follows the spine corner; its projected footprint fades left. */
#book .book-ribbon-object::before { content:""; position:absolute; z-index:0; pointer-events:none; left:-28.57142857%; top:90.625%; width:128.57142857%; height:12.8125%; background:url('/assets/book-floor-shadow.svg?v=37') center / 100% 100% no-repeat; }
#book .book-ribbon-object::after { content:none; }
@media(min-width:900px) {
 #book .book-ribbon-object { width:min(90%,calc((63svh + .9rem)*.65625)); max-width:none; }
 /* Keep the physical base 6.5% of the image height onto the cream surface.
    Translation preserves grid sizing, section height and all text positions. */
 #book .book-ribbon-object { transform:translateY(max(0px,calc(8.8% - 2rem))); }
}
@media(max-width:760px) {
 #book .book-ribbon-object { width:min(65vw,16rem); margin:0; }
}

/* Match the approved component’s anchor offset without changing other sections. */
#book.book-ribbon { scroll-margin-top:2rem; }