:root{color:#deddd8;font-synthesis:none;text-rendering:optimizelegibility;background:#11110f;font-family:Inter,Helvetica Neue,PingFang SC,Microsoft YaHei,sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;min-width:320px;height:100%;margin:0}body{background:#11110f;overflow:hidden}button{font:inherit}.portfolio{isolation:isolate;background:radial-gradient(circle at 50% 44%,#ffffff0b,#0000 43%),linear-gradient(135deg,#151513 0%,#0e0e0d 100%);grid-template-rows:auto 1fr auto auto;width:100%;height:100%;min-height:500px;display:grid;position:relative;overflow:hidden}.portfolio:before{content:"";z-index:-1;opacity:.16;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");position:absolute;inset:0}.topbar{z-index:5;justify-content:space-between;align-items:center;padding:clamp(18px,3vh,34px) clamp(20px,4vw,64px) 8px;display:flex}.identity{align-items:center;gap:13px;display:flex}.identity__mark{background:#b39a6a;width:2px;height:29px}.identity p{margin:0}.identity__title{letter-spacing:.22em;font-size:11px;font-weight:500}.identity__subtitle{color:#76756f;letter-spacing:.12em;font-family:Georgia,serif;font-size:10px;margin-top:5px!important}.icon-button,.nav-button{color:#c9c8c3;cursor:pointer;background:#ffffff06;border:1px solid #ffffff24;justify-content:center;align-items:center;transition:border-color .25s,color .25s,background .25s,opacity .25s;display:inline-flex}.icon-button:hover,.nav-button:hover:not(:disabled){color:#fff;background:#ffffff0f;border-color:#ffffff52}.icon-button:focus-visible,.nav-button:focus-visible{outline-offset:3px;outline:1px solid #b39a6a}.fullscreen-button{letter-spacing:.1em;gap:8px;height:36px;padding:0 13px;font-size:10px}.viewer{place-items:center;min-height:0;padding:12px clamp(16px,4vw,72px) 52px;display:grid}.book-stage{perspective:2400px;place-items:center;width:100%;height:100%;min-height:0;display:grid;position:relative}.book-stage:after{content:"";z-index:-1;filter:blur(24px);opacity:.62;background:#000;border-radius:50%;width:70%;height:7%;position:absolute;bottom:1.5%;left:15%}.flip-book{filter:drop-shadow(0 16px 18px #0000005c)}.stf__parent{margin:auto}.stf__block{transform-style:preserve-3d}.page{background:#e7e4dc;overflow:hidden}.page__paper{background:#f4f1e9;width:100%;height:100%;position:relative;overflow:hidden}.page__paper:after{content:"";pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 1px #00000073,inset 0 0 14px #392f2412}.page__paper:before{content:"";z-index:2;pointer-events:none;mix-blend-mode:multiply;opacity:.72;background:linear-gradient(90deg,#19161238,#1916120f 38%,#0000);width:14px;position:absolute;top:0;bottom:0;left:0}.stf__item:nth-child(2n) .page__paper:before{left:auto;right:0;transform:scaleX(-1)}.page__image{object-fit:cover;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:100%;height:100%;display:block}.page__edge{pointer-events:none;mix-blend-mode:multiply;opacity:.45;background:linear-gradient(270deg,#1f1c1729,#1f1c170b 20%,#0000);width:9%;position:absolute;inset:0 0 0 auto}.stf__item:nth-child(2n) .page__edge{left:0;right:auto;transform:scaleX(-1)}.loading{color:#77766f;letter-spacing:.14em;place-items:center;gap:16px;font-size:11px;display:grid}.loading__line{background:#ffffff1a;width:64px;height:1px;overflow:hidden}.loading__line:after{content:"";background:#b39a6a;width:45%;height:100%;animation:1.2s ease-in-out infinite alternate loading;display:block}@keyframes loading{to{transform:translate(122%)}}.controls{z-index:5;justify-content:center;align-items:center;gap:22px;padding:6px 20px 5px;display:flex}.nav-button{border-radius:50%;width:34px;height:34px;padding:0}.nav-button:disabled{opacity:.22;cursor:default}.pagination{font-variant-numeric:tabular-nums;justify-content:center;align-items:center;gap:11px;min-width:104px;font-family:Georgia,Times New Roman,serif;display:flex}.pagination__current{color:#e2e0d9;letter-spacing:.08em;font-size:15px}.pagination__divider{background:#4e4d48;width:25px;height:1px}.pagination__total{color:#6f6e68;font-size:11px}.progress{background:#ffffff14;width:min(300px,40vw);height:1px;margin:1px auto 0}.progress span{background:#9e895e;height:100%;transition:width .45s;display:block}.hint{margin:8px 0 max(12px, env(safe-area-inset-bottom));color:#5f5e59;text-align:center;letter-spacing:.13em;font-size:9px}.hint span{color:#3f3e3a;margin:0 5px}.portfolio:fullscreen{background:#0c0c0b}@media (width<=700px){.portfolio{grid-template-rows:auto 1fr auto auto}.topbar{padding:max(16px, env(safe-area-inset-top)) 16px 4px}.identity__title{letter-spacing:.16em;font-size:9px}.identity__subtitle{font-size:8px}.identity__mark{height:25px}.fullscreen-button{width:36px;padding:0}.fullscreen-button span{display:none}.viewer{padding:8px 12px 4px}.controls{padding-top:4px}.hint{font-size:8px}}@media (height<=650px){.topbar{padding-top:12px}.identity__subtitle,.hint{display:none}.controls{padding-block:3px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}