/* A · Warm Gallery. Only the presentation layer; shared positions stay intact. */
:root{--paper:#faf8f5;--page:#fffdf8;--ink:#302c30;--muted:#766570;--line:#e2dad6;--pink:#c67c99;--serif:Georgia,'Songti SC','STSong',SimSun,serif;--sans:Arial,'Microsoft YaHei',sans-serif}
body{font-family:var(--sans);background:var(--paper);color:var(--ink)}
header{width:calc(100% - clamp(40px,10vw,144px));max-width:1232px;margin-inline:auto;height:88px;border-color:var(--line)}
main{max-width:1360px;padding-inline:clamp(20px,5vw,72px)}
.wordmark{font-family:var(--serif)}
.studio,.scene-loading{background:var(--paper)}
.studio{height:clamp(440px,51vw,690px);border-radius:10px;margin-top:12px}
@media(min-width:761px) and (min-height:600px){.studio{max-height:calc(100dvh - 160px)}}
button:focus-visible,a:focus-visible{outline:1px solid #9b7a8c;outline-offset:4px}
footer{margin-top:0;padding:12px 0 28px;font-size:10px;color:var(--muted);letter-spacing:.08em}
footer .text-button{font-size:12px;color:var(--ink)}
.footer-actions{display:flex;align-items:center;gap:22px}
.breeze-button{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:#927985;cursor:pointer;transition:color .2s,background .2s}
.breeze-button svg{transition:transform .25s}
.breeze-button:hover:enabled{color:#a65e7c;background:#eecedb38}
.breeze-button:hover:enabled svg{transform:translateX(2px)}
.breeze-button.is-blowing{color:#b46e8c;background:#eecedb45}
.breeze-button:disabled{cursor:default;opacity:.48}
.breeze-button.is-blowing:disabled{opacity:1}
@media(max-width:760px){.footer-actions{gap:12px}}
@media(prefers-reduced-motion:reduce){.breeze-button,.breeze-button svg{transition:none}.breeze-button:hover:enabled svg{transform:none}}
.text-button>span:first-child{margin-left:0}
.language-switch,.book-actions .language-switch button{font-family:var(--sans);font-size:11px;letter-spacing:.02em}
.language-switch button{color:var(--muted)}
.language-switch button[aria-pressed=true]{color:var(--ink)}
.preview{width:304px;background:var(--page);border:1px solid #e5dcd8;border-radius:10px;box-shadow:0 14px 44px #46313d17,0 3px 10px #46313d08}
#preview-art{height:168px}
.preview-copy{padding:22px 24px 20px}
.preview-copy>span{font:10px/1.5 var(--sans);letter-spacing:.13em;color:#8f526d;font-variant-numeric:tabular-nums}
.preview h2{font:400 29px/1.2 var(--serif);letter-spacing:-.025em;margin:12px 0 10px;color:var(--ink)}
.preview p{font:12px/1.85 var(--sans);color:#6b5e66}
.preview-bottom{margin-top:20px;padding-top:16px;border-color:var(--line);font:10px/1.5 var(--sans);color:var(--muted);gap:12px}
.preview-bottom b{color:#9a5573}
#book-opening{background:rgb(250 248 245 / var(--opening-shade))}
#book-opening::backdrop{background:rgb(250 248 245 / var(--opening-shade))}
.book-toolbar{top:16px;left:4%;right:4%;padding:12px 16px;background:#faf8f5ed;border-radius:9px;color:var(--ink);gap:20px}
.book-toolbar h2{font:400 23px/1.25 var(--serif);letter-spacing:0;margin:0 0 7px}
.book-toolbar h2::before{content:attr(data-number) ' / ';font:11px var(--sans);font-variant-numeric:tabular-nums;letter-spacing:.08em;color:var(--muted);vertical-align:middle;margin-right:6px}
.book-toolbar #book-author{font:11px/1.5 var(--sans);color:var(--muted)}
.book-actions{gap:22px}
.book-actions button,.book-actions a{font:12px/1.5 var(--sans);color:#6e5865;padding:9px 0}
.book-pagination{background:#faf8f5ed;color:#6e5865;font:12px/1.5 var(--sans);padding:6px 12px;gap:22px;bottom:20px}
.book-pagination button{width:44px;height:42px;background:#eedee655}
#book-page{font-variant-numeric:tabular-nums;min-width:190px}
.book-pagination #book-next.book-return{font:12px/1.5 var(--sans);padding-inline:18px;min-width:94px}
dialog{background:var(--page);border-color:var(--line);border-radius:12px;box-shadow:0 20px 70px #46313d24}
.reader-toolbar{background:#faf8f5f5;font-size:11px;padding:16px 28px}
.panel-content p{font-size:14px;color:#625760;line-height:1.9}
.panel-content h2,.poetry-page h2{font-family:var(--serif);color:var(--ink)}
.poem-original{font-family:'Songti SC','STSong',SimSun,serif;color:var(--ink)}
.guest-page{color:var(--ink);background:var(--page)}
.guest-write{background:linear-gradient(to left,#58413408,transparent 7%),var(--page)}
.guest-draw{background:linear-gradient(to right,#58413408,transparent 7%),var(--page)}
.guest-label{font-family:'Songti SC','STSong',SimSun,serif;font-size:1.12em;color:#6e5865;letter-spacing:.06em}
.guest-name{font-family:var(--sans);font-size:.8em;border-color:var(--line);color:var(--ink)}
.guest-name::placeholder,.guest-write textarea::placeholder{color:#8d7c86}
.guest-stream{font-family:'Songti SC','STSong',SimSun,serif;line-height:1.95;scrollbar-color:#d9ccd2 transparent}
.guest-entry pre,.guest-write textarea{color:var(--ink);line-height:1.95}
.guest-entry small{font-family:var(--sans);font-size:.72em;color:var(--muted)}
.guest-note{font-family:var(--sans);font-size:.72em;color:var(--muted);line-height:1.65}
.guest-draw-tools{font-family:var(--sans);font-size:.78em;gap:6%}
.guest-draw-tools button{color:#765d6b}
.guest-draw-tools .ink-color[aria-pressed=true]{box-shadow:0 0 0 3px var(--page),0 0 0 4px #9e7186}
@media(max-width:760px){
  header{height:76px;width:calc(100% - 40px)}main{padding-inline:12px}
  .studio{height:auto;aspect-ratio:1.48;min-height:0;margin-top:16px;overflow:hidden}
  footer{margin-inline:8px;padding-top:18px;font-size:9px}footer .text-button{font-size:11px}
  .book-toolbar{top:10px;left:3%;right:3%;padding:10px 12px;gap:12px;align-items:flex-start}
  .book-toolbar h2{font-size:18px;margin-bottom:4px}.book-toolbar h2::before{font-size:9px;margin-right:3px}
  .book-toolbar #book-author{font-size:10px}.book-actions{gap:6px 14px;max-width:245px}
  .book-actions button,.book-actions a{font-size:11px;padding:5px 0}
  .book-pagination{font-size:11px;gap:10px;padding:5px 9px;bottom:16px}
  #book-page{min-width:150px}.book-pagination #book-next.book-return{font-size:11px;min-width:82px;padding-inline:12px}
  .guest-name{font-size:.85em}.guest-note{font-size:.78em}.guest-draw-tools{font-size:.75em}
}
@media(max-width:420px){.book-actions{max-width:185px}.book-toolbar h2{font-size:16px}.book-toolbar h2::before{display:block;margin:0 0 3px}.book-pagination{gap:7px}#book-page{min-width:130px;font-size:10px}}

/* Bound editions: subtle stock, cloth and a quieter reading surface. */
.preview{width:316px;border-color:#dfd4d3;box-shadow:0 20px 58px #46313d17,0 3px 12px #46313d08}
.preview-copy{position:relative;isolation:isolate;padding:23px 25px 21px}
.preview-copy::before,.guest-page::after{content:'';position:absolute;inset:0;background-image:var(--paper-grain);opacity:.6;pointer-events:none;z-index:-1}
.preview h2{font-size:31px;line-height:1.22;margin-block:13px 11px}
.preview-copy>span{font-size:10px;letter-spacing:.12em}
.preview p{font-size:13px;line-height:1.8}
.preview-bottom{font-size:10px;line-height:1.65;margin-top:21px;padding-top:16px}
#preview-art{height:177px}
.preview[data-kind=poetry] #preview-art,.preview[data-kind=guestbook] #preview-art{padding:18px 24px;background:#efe7e7}
.preview[data-kind=poetry] #preview-art>.art,.preview[data-kind=guestbook] #preview-art>.art{overflow:visible;background:none;min-height:0;height:100%}
.jacket-preview{align-self:start;position:relative;width:150px;height:200px;padding:15px 17px;background:#f2cfdd;border-radius:2px 5px 5px 2px;box-shadow:inset 6px 0 7px #503b4910,6px 8px 15px #503b4915;color:#48343f;transform:rotate(-3deg);text-align:left}
.jacket-preview::before{content:'';position:absolute;inset:0;pointer-events:none;background:var(--paper-grain);border-left:1px solid #fff9;border-radius:inherit}
.jacket-meta{display:flex;justify-content:space-between;padding-bottom:9px;border-bottom:1px solid #76536330;font:8px/1 var(--sans);letter-spacing:.1em;color:#755668}
.jacket-preview strong{display:block;font:400 23px/1.4 'Songti SC','STSong',SimSun,serif;margin-top:22px;white-space:nowrap;letter-spacing:.04em;text-shadow:.5px 1px #fff6}
.jacket-preview small{display:block;font:11px var(--serif);margin-top:54px;color:#755668}
.jacket-preview.guestbook{background:#efbdcc;transform:rotate(3deg)}
.notebook-lines{height:48px;margin-top:20px;background:repeating-linear-gradient(transparent 0 15px,#76566725 15px 16px)}
.book-toolbar{background:#faf8f5f2;padding:13px 17px;box-shadow:0 1px 0 #8a6e7b0a}
.book-actions button,.book-actions a{transition:color .16s,transform .16s}
.book-actions button:hover:enabled,.book-actions a:hover{transform:translateY(-1px)}
.book-actions button:active:enabled{transform:translateY(1px)}
.book-pagination{box-shadow:0 3px 16px #46313d08;border:1px solid #e8ded957}
.book-pagination button{transition:background .2s,transform .2s}
.book-pagination button:hover:enabled{transform:translateY(-1px)}
.book-pagination button:active:enabled{transform:translateY(1px)}
.guest-page{isolation:isolate}
.guest-page::after{z-index:0}
.guest-write>*{position:relative;z-index:1}
.guest-write{gap:3.6%}
.guest-label{font-size:clamp(11px,1.08em,19px);letter-spacing:.04em;color:#5d4854}
.guest-name{border-bottom:1px dotted #bfa9b3;font-size:.77em;padding:.5em 0 .35em}
.guest-name:focus{border-bottom-style:solid;border-color:#a85f7c}
.guest-stream{scrollbar-width:thin;scrollbar-color:#bcaab450 transparent;padding-right:.45em}
.guest-stream:hover,.guest-stream:focus-within{scrollbar-color:#bcaab4a0 transparent}
.guest-stream::-webkit-scrollbar{width:3px}.guest-stream::-webkit-scrollbar-thumb{background:#bcaab466;border-radius:8px}
.guest-entry{padding-bottom:1.4em}.guest-entry small{font-size:.68em;letter-spacing:.035em}
.guest-entry pre{margin-top:.42em}.guest-composer{padding-bottom:1.2em}
.guest-write textarea{border-bottom:1px solid #bfa9b32b;min-height:4em;font-size:1em}
.guest-note{font-size:clamp(9px,.7em,12px);line-height:1.65;padding-left:1.1em;position:relative;color:#806a76}
.guest-note::before{content:'';position:absolute;left:0;top:.55em;width:.4em;height:.4em;border-radius:50%;background:#b39ca7}
.guest-note[data-sync=synced]::before{background:#7c9986}.guest-note[data-sync=saving]::before,.guest-note[data-sync=pending]::before{background:#c78da7}.guest-note[data-sync=offline]::before{background:#b88065}
.guest-draw::before{content:'';position:absolute;left:8%;top:18%;width:84%;height:74%;background:radial-gradient(#a78f9b35 .65px,transparent .85px) 0 0 / 18px 18px;pointer-events:none;z-index:0}
#book-opening .guest-draw canvas{z-index:1}
.guest-draw-tools{z-index:2;gap:6%;font-size:clamp(8px,.74em,13px)}
.guest-draw-tools button{min-height:30px;transition:color .16s,box-shadow .16s}
.guest-draw-tools .ink-color{width:1.25em;height:1.25em}
.guest-draw-tools [data-undo]{margin-left:auto;font-size:.95em;letter-spacing:0}
.guest-draw-tools [data-undo]:disabled{opacity:.32}
@media(max-width:760px){
  header{height:72px}.studio{aspect-ratio:1.42;margin-top:12px}
  footer{padding-top:10px;padding-bottom:24px}
  .book-toolbar{padding:10px 12px}.book-actions{gap:4px 12px}
  .book-actions button,.book-actions a{min-height:30px;display:inline-flex;align-items:center}
  .book-actions .language-switch button{min-height:30px}
  .book-pagination{bottom:12px}.book-pagination button{min-height:40px}
  .guest-write{gap:3%}.guest-name{font-size:.85em}.guest-stream{padding-right:.25em}
  .guest-entry small{font-size:.77em}.guest-note{font-size:9px;line-height:1.5}
  .guest-draw-tools{font-size:9px;gap:6%}
}
@media(prefers-reduced-motion:reduce){.book-actions button,.book-actions a,.book-pagination button,.guest-draw-tools button{transition:none!important;transform:none!important}}
/* The opening uses its own transparent 3D stage; the live shelf stays behind it. */
html[data-opening-pending="true"] body::before{content:"";position:fixed;inset:0;background:#faf8f5;z-index:98;pointer-events:none}
#portfolio-intro{position:fixed;inset:0;z-index:100;overflow:hidden;isolation:isolate;color:#49373f;font-family:Arial,"Microsoft YaHei",sans-serif}
#portfolio-intro .intro-backdrop{position:absolute;inset:0;background:radial-gradient(ellipse at 48% 42%,#fffefa 0,#faf8f5 75%);z-index:-1}
#portfolio-intro canvas{display:block;width:100%;height:100%;cursor:pointer;touch-action:manipulation}
#portfolio-intro button{color:inherit;cursor:pointer;font:inherit;outline-offset:6px}
#portfolio-intro .intro-skip{position:absolute;right:max(28px,env(safe-area-inset-right));top:max(28px,env(safe-area-inset-top));border:0;background:rgba(250,248,245,.78);border-radius:30px;padding:12px 18px;font-size:12px;letter-spacing:.04em;backdrop-filter:blur(8px)}
#portfolio-intro .intro-skip span{margin-left:14px}
#portfolio-intro .intro-invitation{position:absolute;left:50%;bottom:max(8vh,30px);transform:translateX(-50%);text-align:center;white-space:nowrap;transition:opacity .35s,transform .6s}
#portfolio-intro .intro-play{display:inline-flex;align-items:center;gap:15px;border:1px solid #dfc3cd;background:rgba(255,253,249,.92);border-radius:40px;padding:16px 26px;font-size:14px;box-shadow:0 6px 30px #9e748010;transition:background .2s,transform .2s}
#portfolio-intro .intro-play:not(:disabled):hover{background:#f5e4eb;transform:translateY(-2px)}
#portfolio-intro .intro-play:disabled{opacity:.45;cursor:wait}
#portfolio-intro .intro-play-symbol{color:#af7189;font-size:20px;line-height:1}
#portfolio-intro .intro-invitation p{font-size:8px;letter-spacing:.24em;color:#a18c95;margin:17px 0 0}
#portfolio-intro.is-playing .intro-invitation{opacity:0;transform:translate(-50%,12px);pointer-events:none}
#portfolio-intro.is-playing .intro-play{display:none}
#portfolio-intro .intro-state{position:absolute;left:50%;bottom:25px;transform:translateX(-50%);font-size:12px;color:#a18c95}
@media(max-width:600px){#portfolio-intro .intro-skip{right:16px;top:18px}#portfolio-intro .intro-invitation{bottom:9vh}}

html.intro-active,html.intro-active body{overflow:hidden}