/* The back cover is a single leather surface; the shelf keeps clue order. */
body:has(.notebook.finale){background:#101010}
.notebook.finale{width:min(1100px,100%);min-height:0;height:auto;padding:28px 24px 34px;overflow:visible;background:var(--tex-leather),radial-gradient(ellipse at 45% 22%,#242424,#111 72%);background-blend-mode:soft-light,normal}
.notebook.finale:before{inset:12px;border:1px solid #ffffff18;box-shadow:inset 0 1px #000,0 1px #000;z-index:0}
.notebook.finale:after,.notebook.finale>.spine,.notebook.finale>.shelf,.notebook.finale>.ribbon,.notebook.finale>.bin-area,.notebook.finale>.gold-rim{display:none}
.final-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center}
.final-shelf{width:min(100%,384px);--final-height:min(190px,40vw);--final-width:min(58px,calc((100vw - 48px)/6 - 2px))}
.final-row{display:grid;grid-template-columns:repeat(6,minmax(44px,1fr));align-items:end;justify-items:center;gap:0;min-height:var(--final-height);border-bottom:2px solid #403327;box-shadow:0 3px 3px #000a;margin-bottom:12px}
.final-shelf .slot.final-slot{position:relative;display:flex;justify-content:end;width:100%;height:var(--final-height);min-width:44px;gap:0;background:none}
.final-shelf .slot .book,.final-empty{width:var(--final-width);height:min(var(--height),var(--final-height));max-width:none;flex:none}
.final-shelf .slot .book{animation:none;transition:none;text-decoration:none}
.final-shelf .slot:hover .book,.final-shelf .slot:focus-within .book{transform:none}
.final-shelf .book:focus-visible{outline:3px solid #f4d98f;outline-offset:3px;z-index:2}
.final-empty{border-radius:4px;background:linear-gradient(90deg,#0009,#181818 35%,#0b0b0b);box-shadow:inset 2px 2px 4px #000,inset -1px -1px #ffffff18,0 1px #ffffff10}
.final-flat{height:64px;display:grid;place-items:center}
.final-shelf .final-flat .slot.final-slot{width:var(--final-height);height:64px;min-width:0;display:block}
.final-flat .book,.final-flat .final-empty{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(90deg)!important;transform-origin:center}
.final-greeting{text-align:center;margin:18px 0 0;color:#d6ae52;font-family:'EB Garamond',Georgia,serif;line-height:1.05}
.final-greeting p{position:relative;isolation:isolate;margin:0;font-size:clamp(28px,5vw,46px);font-weight:600;letter-spacing:.025em}
.final-greeting p+p{font-size:clamp(21px,3.5vw,31px);margin-top:8px;font-style:italic}
/* Keep the engraved shadows on the solid base; the clipped gold sits above them. */
.final-greeting p{text-shadow:0 1px 0 #000,0 -1px 0 #fff5}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
 .final-greeting p::after{content:'Happy Birthday';position:absolute;inset:0;text-shadow:none;background:linear-gradient(calc(98deg + var(--mx, .3)*64deg + var(--my, .3)*26deg),#cba851,#f9e9aa,#d5b662,#f5df99,#cba851);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;pointer-events:none}
 .final-greeting p+p::after{content:'- from Auny'}
}
@media(max-width:600px){.notebook.finale{padding:20px 16px 28px;min-height:0}.final-shelf{--final-width:min(50px,calc((100vw - 32px)/6 - 2px))}.final-greeting{margin-top:12px}}

/* Each row grows for its longest title, rather than clipping it. */
.final-row{grid-template-columns:repeat(6,minmax(0,1fr));min-height:var(--row-height)}
.final-row .slot.final-slot{height:var(--row-height);min-width:0}
.final-row .slot .book,.final-row .final-empty{width:calc(100% - 2px);height:var(--row-height)}
.final-shelf .final-book{position:relative;overflow:hidden}
.final-book .final-cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.final-book .final-scrim{position:absolute;inset:0;left:0;transform:none;background:rgba(0,0,0,.78)}
.final-book .final-title{position:absolute;inset:10px 2px;left:2px;transform:none;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:1px;color:#fff0c4;font:700 var(--title-size)/1.05 'Source Serif 4',Georgia,serif;text-shadow:0 1px 2px #000}
.final-book .final-title span{position:static;display:block;writing-mode:vertical-rl;transform:rotate(180deg);white-space:pre;overflow:visible;font:inherit;letter-spacing:normal}
.final-flat{height:120px}
.final-shelf .final-flat .slot.final-slot{width:min(190px,100%);height:120px}
.final-flat .final-book,.final-flat .final-empty{width:110px!important;height: min(190px, 100vw - 64px)!important}
.final-shelf .final-flat .final-book{position:absolute}
.final-flat .final-book .final-title{inset:4px;transform:rotate(-90deg);width:182px;height:102px;left:50%;top:50%;margin:-51px 0 0 -91px;display:flex;flex-direction:column;gap:0;text-align:center}
.final-flat .final-book .final-title span{writing-mode:horizontal-tb;transform:none;white-space:normal;overflow-wrap:anywhere}

/* Center short finales and let longer shelves grow in normal flow. */
.notebook.finale{min-height:calc(100dvh - var(--nav-h, 0px));padding:28px 24px}
.notebook.finale #screen{flex:1 0 auto}
.notebook.finale .final-content{margin:auto;width:100%}
@media(max-width:600px){.notebook.finale{padding:24px 16px}}
