:root{--paper:#efede6;--ink:#101010;--ash:#8a8984;--red:#8d1d19;--stage:#242424;--edge:#171717;--page-w:148mm;--page-h:210mm}
*{box-sizing:border-box}html,body{margin:0;background:var(--stage);color:var(--ink);font-family:Arial,"Noto Sans",sans-serif}button{font:inherit}.appbar{height:52px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;color:#d8d6d0;background:#1a1a1a;border-bottom:1px solid #3a3a3a;letter-spacing:.08em;font-size:12px}.appbar strong{font-weight:500}.appbar nav{display:flex;gap:8px}.appbar button,.appbar a{color:inherit;background:transparent;border:1px solid #555;padding:7px 10px;text-decoration:none;cursor:pointer}.appbar button:hover,.appbar a:hover{background:#303030}.reader-shell{min-height:calc(100vh - 52px);display:grid;place-items:center;padding:28px 72px 58px;overflow:hidden}.book-stage{position:relative;width:296mm;height:210mm;perspective:2400px;transform-origin:center}.spread{position:absolute;inset:0;display:none;filter:drop-shadow(0 18px 30px #0008)}.spread.active,.spread.under{display:flex}.spread.under{z-index:0}.spread.active{z-index:1}.sheet{position:relative;width:var(--page-w);height:var(--page-h);overflow:hidden;flex:none;background:var(--paper)}.sheet.left{box-shadow:inset -1px 0 0 #0002}.sheet.right{box-shadow:inset 1px 0 0 #fff3}.sheet.black{background:#0d0d0d;color:var(--paper)}.sheet::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.09;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='90'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.74' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E")}.page-no{position:absolute;z-index:8;font:6.5pt "Courier New",monospace;letter-spacing:.1em}.page-no.red{color:var(--red)}img{display:block}.bleed{position:absolute;width:100%;height:100%;object-fit:cover}.meta{font:6.7pt "Courier New",monospace;letter-spacing:.1em;line-height:1.45;text-transform:uppercase}.red{color:var(--red)}.rule{height:1px;background:var(--red)}
/* p01 — typography as object */
.p01{background:var(--paper)}.p01 .seven{position:absolute;left:-6mm;top:14mm;font-size:59pt;line-height:.8;font-weight:700;letter-spacing:-.065em}.p01 .winters{position:absolute;left:19mm;bottom:-7mm;font-size:49pt;line-height:.8;font-weight:700;letter-spacing:-.06em;transform:rotate(-1deg)}.p01 .ru{position:absolute;left:18mm;top:82mm;font-size:13pt;letter-spacing:.14em;writing-mode:vertical-rl}.p01 .dates{position:absolute;right:10mm;top:15mm;font:8pt "Courier New",monospace;writing-mode:vertical-rl}.p01 .slash{position:absolute;left:10mm;top:111mm;width:52mm;transform:rotate(-8deg)}
.p02 .moscow{position:absolute;right:8mm;bottom:11mm}.p02 .reg{position:absolute;width:5mm;height:5mm;left:13mm;top:14mm;border-left:1px solid var(--red);border-top:1px solid var(--red)}
.p03{background:#0d0d0d}.p03 .year{position:absolute;color:var(--paper);font-size:118pt;font-weight:700;letter-spacing:-.1em;line-height:.75;left:-12mm;bottom:-2mm}.p03 .arrival-word{position:absolute;color:var(--red);right:9mm;top:11mm;font:7pt "Courier New",monospace;writing-mode:vertical-rl;letter-spacing:.14em}
.p04 .airport-small{position:absolute;width:78mm;height:52mm;object-fit:cover;left:13mm;top:74mm;transform:rotate(-1.2deg);border:1mm solid #fff}.p04 .meta{position:absolute;left:14mm;top:132mm}.p04 .index{position:absolute;right:8mm;top:12mm;font-size:30pt;font-weight:700;color:#d0cdc5}
.p05 .arrival-detail{position:absolute;left:-57mm;top:0;width:220mm;height:210mm;object-fit:cover;object-position:32% center;filter:contrast(1.04) saturate(.82)}.p05 .date-stamp{position:absolute;left:8mm;bottom:10mm;color:#fff}.p05 .edgeword{position:absolute;right:-3mm;top:22mm;color:#fff;font-size:34pt;font-weight:700;writing-mode:vertical-rl;opacity:.88}
.p06 .rain{left:-9mm;top:-5mm;width:166mm;height:220mm;filter:saturate(.72) contrast(1.08)}.p06 .coords{position:absolute;left:7mm;bottom:7mm;color:#eee}.p06 .coldline{position:absolute;right:6mm;top:7mm;color:#fff;font-size:7pt;writing-mode:vertical-rl;letter-spacing:.12em}
.p07 .room{position:absolute;left:20mm;top:22mm;width:137mm;height:161mm;object-fit:cover;object-position:center;transform:rotate(.8deg);box-shadow:-5mm 5mm 0 #171717}.p07 .roomtag{position:absolute;left:7mm;top:12mm;transform:rotate(-90deg);transform-origin:left top}.p07 .roomno{position:absolute;left:6mm;bottom:7mm;font-size:37pt;font-weight:700;color:#cbc8c0}
/* snow spread: one image, two page slices */
.snow-slice{position:absolute;top:0;height:210mm;width:296mm;max-width:none;object-fit:cover}.p08 .snow-slice{left:0;object-position:center}.p09 .snow-slice{left:-148mm;object-position:center}.p08 .temp{position:absolute;left:6mm;top:8mm;color:#fff}.p09 .winter{position:absolute;right:-2mm;bottom:6mm;color:#fff;font-size:35pt;font-weight:700;writing-mode:vertical-rl;opacity:.8}.p09 .page-no{right:6mm;top:7mm;color:var(--red)}
.p10 .food-a{position:absolute;width:92mm;height:61mm;object-fit:cover;left:-5mm;top:20mm;transform:rotate(-1deg)}.p10 .food-b{position:absolute;width:63mm;height:84mm;object-fit:cover;right:8mm;bottom:15mm;object-position:28% center;border:1mm solid var(--paper);transform:rotate(1.1deg)}.p10 .receipt{position:absolute;left:15mm;top:89mm;width:52mm;padding:4mm 3mm;border-top:1px solid #555;border-bottom:1px solid #555}.p10 .receipt strong{font-size:18pt;letter-spacing:-.05em}.p10 .page-no{left:6mm;bottom:6mm}
.p11{background:#111;color:var(--paper)}.p11 .market-wide{position:absolute;left:-15mm;top:44mm;width:172mm;height:70mm;object-fit:cover}.p11 .market-detail{position:absolute;right:-9mm;bottom:9mm;width:75mm;height:76mm;object-fit:cover;object-position:92% center;border:1px solid #ddd}.p11 .market-copy{position:absolute;left:8mm;top:12mm;color:#ddd}.p11 .big22{position:absolute;left:6mm;bottom:-7mm;font-size:60pt;font-weight:700;color:#292929}.p11 .page-no{right:6mm;top:7mm}
.p12 .grass{position:absolute;left:-4mm;top:33mm;width:102mm;height:71mm;object-fit:cover;transform:rotate(-1.6deg)}.p12 .birthday-frag{position:absolute;right:-18mm;bottom:-8mm;width:94mm;height:104mm;object-fit:cover;object-position:left center;transform:rotate(1.2deg);border:1.5mm solid #fff}.p12 .together{position:absolute;left:9mm;top:112mm;font-size:27pt;font-weight:700;line-height:.82;letter-spacing:-.05em}.p12 .meta{position:absolute;right:7mm;top:8mm;text-align:right}.p12 .page-no{left:6mm;bottom:6mm}
.p13 .birthday{position:absolute;left:-18mm;top:-6mm;width:180mm;height:222mm;object-fit:cover;object-position:center;filter:contrast(1.06)}.p13 .grass-frag{position:absolute;right:-8mm;top:9mm;width:68mm;height:48mm;object-fit:cover;border:1mm solid #fff;transform:rotate(1.5deg)}.p13 .flash{position:absolute;left:7mm;bottom:7mm;color:#fff}.p13 .page-no{right:6mm;bottom:6mm;color:#fff}
.p14 .years{position:absolute;left:18mm;top:83mm;font:12pt "Courier New",monospace;letter-spacing:.16em;line-height:2.1}.p14 .years b{font-weight:400;color:var(--red)}.p14 .page-no{right:6mm;bottom:6mm}
.p15 .strip{position:absolute;left:13mm;top:88mm;display:flex;gap:2mm;transform:rotate(-1deg)}.p15 .strip img{width:31mm;height:22mm;object-fit:cover;border:1.2mm solid #fff;box-shadow:0 0 0 .3mm #111}.p15 .strip img:nth-child(2){object-position:20% center}.p15 .frame-index{position:absolute;left:13mm;top:116mm}.p15 .page-no{right:6mm;bottom:6mm}
.p16{background:#101010}.p16 .metro{position:absolute;left:12mm;top:-12mm;width:120mm;height:234mm;object-fit:cover;object-position:68% center;transform:rotate(-1deg)}.p16 .trackno{position:absolute;left:-5mm;bottom:-9mm;color:var(--paper);font-size:64pt;font-weight:700;opacity:.85}.p16 .meta{position:absolute;right:6mm;top:7mm;color:#fff;writing-mode:vertical-rl}.p16 .page-no{left:6mm;top:7mm;color:#fff}
.p17 .train{position:absolute;left:-3mm;top:13mm;width:151mm;height:119mm;object-fit:cover;object-position:center}.p17 .bus{position:absolute;right:9mm;bottom:13mm;width:84mm;height:58mm;object-fit:cover;transform:rotate(1.3deg);border:1mm solid #fff}.p17 .route{position:absolute;left:7mm;bottom:9mm;font-size:32pt;font-weight:700;letter-spacing:-.08em;writing-mode:vertical-rl;transform:rotate(180deg)}.p17 .meta{position:absolute;left:7mm;top:7mm}.p17 .page-no{right:6mm;bottom:6mm}
.p18{background:#0c0d0d}.p18 .desk{position:absolute;left:-30mm;top:15mm;width:198mm;height:179mm;object-fit:cover;object-position:center;filter:brightness(.74) contrast(1.15)}.p18 .clock{position:absolute;left:7mm;top:7mm;color:#fff;font-size:8pt}.p18 .page-no{right:6mm;bottom:6mm;color:#fff}
.p19{background:#0c0d0d;color:#eee}.p19 .desk-detail{position:absolute;left:-148mm;top:0;width:296mm;height:210mm;max-width:none;object-fit:cover;object-position:center;filter:brightness(.58) contrast(1.22)}.p19 .thesis{position:absolute;right:6mm;top:9mm;text-align:right}.p19 .crop-line{position:absolute;left:11mm;top:24mm;height:153mm;width:1px;background:var(--red)}.p19 .page-no{left:6mm;bottom:6mm;color:#fff}
.p20 .tram{position:absolute;left:-19mm;top:-4mm;width:179mm;height:218mm;object-fit:cover;object-position:center;filter:saturate(.8)}.p20 .ordinary{position:absolute;left:7mm;top:7mm;color:#fff}.p20 .year26{position:absolute;right:4mm;bottom:-11mm;font-size:62pt;font-weight:700;color:#fff;opacity:.78}.p20 .page-no{right:6mm;top:7mm;color:var(--red)}
.p21 .hall{position:absolute;left:17mm;top:23mm;width:143mm;height:145mm;object-fit:cover;object-position:left center;transform:rotate(.6deg);box-shadow:-5mm 5mm 0 #1a1a1a}.p21 .apt{position:absolute;left:6mm;bottom:9mm}.p21 .number{position:absolute;right:7mm;top:7mm;font-size:42pt;font-weight:700;color:#cfccc4}.p21 .page-no{right:6mm;bottom:6mm}
.p22 .later{position:absolute;left:16mm;top:96mm;font:7pt "Courier New",monospace;letter-spacing:.2em}.p22 .tiny-red{position:absolute;left:16mm;top:92mm;width:7mm}.p22 .page-no{right:6mm;bottom:6mm}
.p23 .morning{position:absolute;left:18mm;top:74mm;width:79mm;height:53mm;object-fit:cover;transform:rotate(-.7deg)}.p23 .morning-meta{position:absolute;left:18mm;top:132mm}.p23 .window-word{position:absolute;right:6mm;top:9mm;font-size:27pt;font-weight:700;color:#d1cec7;writing-mode:vertical-rl}.p23 .page-no{right:6mm;bottom:6mm}
.final-slice{position:absolute;top:0;width:296mm;height:210mm;max-width:none;object-fit:cover}.p24 .final-slice{left:0}.p25 .final-slice{left:-148mm}.p24 .final-year{position:absolute;left:7mm;bottom:7mm;color:#fff}.p25 .page-no{right:6mm;bottom:6mm;color:#fff}
.p26 .backmeta{position:absolute;left:12mm;bottom:12mm}.p26 .backline{position:absolute;left:0;bottom:20mm;width:7mm}.p26 .archive-code{position:absolute;right:8mm;top:10mm;color:#b5b2ab;writing-mode:vertical-rl}
.overview-shell{padding:28px;display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:38px 24px;align-items:start}.overview-spread{position:relative;display:flex;justify-content:center;filter:drop-shadow(0 10px 15px #0007)}.overview-spread .sheet{width:148mm;height:210mm;transform-origin:top left;zoom:.5}.overview-spread .page-no-ui{position:absolute;left:50%;top:calc(105mm + 7px);transform:translateX(-50%);color:#aaa;font:11px "Courier New",monospace}
.reader-controls{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:20;display:flex;align-items:center;gap:12px;color:#ddd;background:#151515e8;border:1px solid #444;padding:8px 10px}.reader-controls button{width:34px;height:30px;color:#ddd;background:#222;border:1px solid #555;cursor:pointer}.reader-controls button:disabled{opacity:.28;cursor:default}.reader-controls span{min-width:80px;text-align:center;font:11px "Courier New",monospace}.reader-hint{position:fixed;right:18px;bottom:18px;color:#888;font:10px "Courier New",monospace;letter-spacing:.08em}.book-stage .sheet.left{cursor:w-resize}.book-stage .sheet.right{cursor:e-resize}.flip-leaf{position:absolute;top:0;width:148mm;height:210mm;z-index:9;transform-style:preserve-3d;pointer-events:none;filter:drop-shadow(0 10px 14px #0008);overflow:hidden;background:var(--paper);backface-visibility:hidden}.flip-leaf.next{left:50%;transform-origin:left center;animation:turn-next 760ms cubic-bezier(.34,.02,.18,1) forwards}.flip-leaf.prev{right:50%;transform-origin:right center;animation:turn-prev 760ms cubic-bezier(.34,.02,.18,1) forwards}.flip-leaf::before{content:"";position:absolute;inset:0;z-index:20;background:linear-gradient(90deg,#0000 55%,#0007);opacity:0;animation:leaf-shade 760ms ease-in-out}.flip-leaf.prev::before{background:linear-gradient(270deg,#0000 55%,#0007)}@keyframes turn-next{0%{transform:rotateY(0)}100%{transform:rotateY(-180deg)}}@keyframes turn-prev{0%{transform:rotateY(0)}100%{transform:rotateY(180deg)}}@keyframes leaf-shade{0%,100%{opacity:0}45%,60%{opacity:1}}
@media(max-width:1250px){.reader-shell{padding:18px 12px 62px}.book-stage{transform:scale(.72)}}@media(max-width:820px){.book-stage{transform:scale(.5)}.appbar{font-size:10px}.appbar strong span{display:none}.reader-hint{display:none}}
@page{size:A5 portrait;margin:0}@media print{html,body{background:transparent}.appbar,.reader-controls,.reader-hint,.flip-leaf{display:none!important}.reader-shell{display:block;padding:0;overflow:visible}.book-stage{display:block;width:auto;height:auto;transform:none!important;perspective:none}.spread,.spread.active,.spread.under{position:static;display:block!important;filter:none;transform:none!important}.spread .sheet{display:block;width:148mm;height:210mm;box-shadow:none;break-after:page;page-break-after:always;transform:none!important;zoom:1!important}.spread:last-child .sheet:last-child{break-after:auto;page-break-after:auto}.spread .empty-sheet{display:none}.sheet::after{opacity:.06}}
.book-stage::before{content:"";position:absolute;z-index:8;left:50%;top:0;width:7mm;height:100%;transform:translateX(-50%);pointer-events:none;background:linear-gradient(90deg,#0003,#0000 43%,#fff2 54%,#0002)}.book-stage::after{content:"";position:absolute;z-index:-1;left:2mm;right:2mm;bottom:-2.5mm;height:4mm;background:repeating-linear-gradient(180deg,#d1cec6 0,#d1cec6 .35mm,#8d8b86 .45mm,#ece9e1 .65mm);box-shadow:0 12px 28px #000a;transform:perspective(500px) rotateX(55deg)}
@media print{.book-stage::before,.book-stage::after{display:none}}