:root{--ink: #241910;--ink-soft: #6d5c4d;--paper: #efe4d4;--paper-deep: #e6d8c4;--surface: #fffaf3;--surface-soft: rgba(255, 250, 243, .92);--line: #ddcbb6;--line-strong: #e0b2a6;--accent: #8f2f1d;--accent-deep: #742617;--accent-soft: #f3e4dc;--banner-bg: #fff4e8;--banner-line: #efd0b4;--banner-ink: #6a3b22;--shadow-soft: 0 8px 22px rgba(60, 32, 16, .1);--shadow-press: 0 2px 8px rgba(60, 32, 16, .12);--ease-out: cubic-bezier(.22, 1, .36, 1);--ease-spring: cubic-bezier(.34, 1.3, .64, 1);--tap: .16s;--page-max: 26rem;color:var(--ink);background:var(--paper);font-family:Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;font-size:16px;line-height:1.5;-webkit-tap-highlight-color:transparent}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:radial-gradient(ellipse 90% 50% at 50% -8%,rgba(255,248,236,.95),transparent 55%),linear-gradient(180deg,#f3e9db 0%,var(--paper) 40%,#e9dcc8 100%)}button,input,select{font:inherit}button{cursor:pointer;touch-action:manipulation;transition:background-color var(--tap) var(--ease-out),border-color var(--tap) var(--ease-out),color var(--tap) var(--ease-out),box-shadow var(--tap) var(--ease-out),transform var(--tap) var(--ease-out),opacity var(--tap) var(--ease-out)}button:active:not(:disabled){transform:scale(.97)}#root{min-height:100vh}.app{width:min(100%,var(--page-max));max-width:var(--page-max);margin:0 auto;min-height:100vh;padding:1.25rem 1rem 6rem}.screen-enter{animation:screen-in .38s var(--ease-out) both}@keyframes screen-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}h1,h2{font-family:Palatino,Palatino Linotype,Songti SC,serif;font-weight:600}h1{margin:0 0 .35rem;font-size:2rem;letter-spacing:.04em}h2{margin:0 0 .75rem;font-size:1.35rem}.lede{margin:0 0 1.25rem;color:var(--ink-soft)}.stack{display:grid;gap:.75rem}label{display:grid;gap:.35rem;font-size:.92rem;color:var(--ink-soft)}input,select{width:100%;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:.8rem;padding:.8rem .9rem;transition:border-color var(--tap) var(--ease-out),box-shadow var(--tap) var(--ease-out),background-color var(--tap) var(--ease-out)}input:hover,select:hover{border-color:#d0baa0}input:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #8f2f1d29;background:#fffdf8}.primary,.ghost,.danger,.soft,.text-button{border-radius:999px;padding:.85rem 1.1rem;border:0}.primary{background:var(--accent);color:#fff8f2;box-shadow:0 6px 16px #8f2f1d38}.primary:hover:not(:disabled){background:var(--accent-deep);box-shadow:0 8px 20px #8f2f1d47}.primary:active:not(:disabled){box-shadow:var(--shadow-press)}.ghost,.text-button{background:transparent;color:var(--accent)}.ghost{border:1px solid var(--line-strong)}.ghost:hover:not(:disabled),.soft:hover:not(:disabled){background:#8f2f1d0f;border-color:#d19a8c}.file-button{position:relative;display:block;text-align:center}.file-button input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.danger{background:var(--accent-soft);color:var(--accent)}.danger:hover:not(:disabled){background:#edd5ca}.text-button{padding-inline:0;width:fit-content}.text-button:hover{opacity:.78}.text-button:active{transform:none;opacity:.6}.primary:disabled{opacity:.45;cursor:default;box-shadow:none}.card{background:var(--surface-soft);border:1px solid rgba(221,203,182,.9);border-radius:1.1rem;padding:.9rem;transition:transform var(--tap) var(--ease-out),box-shadow var(--tap) var(--ease-out),border-color var(--tap) var(--ease-out),background-color var(--tap) var(--ease-out)}.banner{background:var(--banner-bg);border:1px solid var(--banner-line);color:var(--banner-ink);border-radius:.9rem;padding:.75rem .9rem;animation:banner-in .32s var(--ease-out) both}@keyframes banner-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}.error{color:var(--accent);margin:0;animation:banner-in .28s var(--ease-out) both}.topbar{display:flex;justify-content:space-between;gap:.75rem;align-items:center;margin-bottom:1rem}.topbar-actions{display:flex;align-items:center;gap:.55rem;flex-shrink:0}.topbar-add{padding:.55rem .95rem;font-size:.92rem;box-shadow:0 4px 12px #8f2f1d2e}.session-chip{border:1px solid transparent;background:var(--surface);color:var(--ink);border-radius:999px;padding:.55rem .85rem;text-align:left;box-shadow:0 1px #3c20100a}.session-chip:hover{border-color:var(--line);box-shadow:var(--shadow-soft)}.chips{display:flex;flex-wrap:wrap;gap:.5rem}.chip{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:.55rem .85rem;transition:background-color .2s var(--ease-out),border-color .2s var(--ease-out),color .2s var(--ease-out),transform .2s var(--ease-spring),box-shadow .2s var(--ease-out)}.chip:hover{border-color:#d0baa0}.chip[aria-pressed=true]{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 4px 12px #8f2f1d38;transform:scale(1.03)}.chip[aria-pressed=true]:active{transform:scale(.98)}.shelf-home{padding-bottom:1.5rem}.spine-home{padding-bottom:2rem}.spine-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;margin-bottom:.85rem}.spine-brand{margin:0;font-size:.82rem;letter-spacing:.08em;color:var(--ink-soft)}.spine-hero h1{margin:.15rem 0 0;font-size:2.05rem}.spine-hero-side{display:grid;justify-items:end;gap:.45rem}.spine-count{display:inline-flex;align-items:center;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:.35rem .7rem;font-size:.8rem;color:var(--ink-soft);box-shadow:0 1px #3c20100a}.spine-search{display:grid;gap:.4rem;margin:.35rem 0 .75rem;font-size:.9rem;color:var(--ink-soft)}.spine-search input{border-radius:999px;padding:.85rem 1rem}.spine-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.55rem;margin-bottom:.75rem}.spine-member{border-radius:999px;padding:.7rem .9rem}.spine-add{white-space:nowrap;border-radius:999px;padding:.7rem 1rem}.spine-view-bar{margin:0 0 .65rem}.spine-views{display:inline-grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.25rem;padding:.28rem;border-radius:999px;background:#fffaf3b8;border:1px solid var(--line);min-width:10.5rem}.spine-view{border:0;border-radius:999px;padding:.5rem .9rem;background:transparent;color:var(--ink-soft);font-size:.84rem}.spine-view[aria-selected=true]{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-soft)}.spine-modes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.25rem;margin:.2rem 0 .85rem;padding:.28rem;border-radius:999px;background:#fffaf3b8;border:1px solid var(--line)}.spine-mode{border:0;border-radius:999px;padding:.55rem .15rem;background:transparent;color:var(--ink-soft);font-size:.78rem}.spine-mode[aria-selected=true]{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-soft)}.spine-locations{display:flex;flex-wrap:wrap;gap:.4rem;margin:-.35rem 0 .95rem}.spine-location{display:inline-flex;align-items:center;gap:.35rem;border:1px solid var(--line);border-radius:999px;padding:.42rem .85rem;background:#fffaf3b8;color:var(--ink-soft);font-size:.82rem}.spine-location[aria-selected=true]{background:var(--surface);color:var(--ink);border-color:transparent;box-shadow:var(--shadow-soft)}.spine-location-count{font-size:.72rem;opacity:.72}.spine-bays{display:grid;gap:1.35rem}.spine-bay-head{display:flex;align-items:baseline;justify-content:space-between;gap:.75rem;margin-bottom:.35rem}.spine-bay-head h2{margin:0;font-size:1.1rem}.spine-hint{margin:0 0 .55rem;font-size:.82rem;color:var(--ink-soft)}.shelf-pager{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.65rem;margin:1.15rem 0 .35rem}.shelf-pager .ghost:first-child{justify-self:start}.shelf-pager .ghost:last-child{justify-self:end}.shelf-pager-status{font-size:.88rem;color:var(--ink-soft);letter-spacing:.04em}.spine-case{position:relative;width:100%;max-width:100%;border-radius:1rem;padding:.75rem .7rem .55rem;background:linear-gradient(180deg,#fffcf68c,#ece0ce59),#e8dcc8;border:1px solid rgba(160,130,96,.28);box-shadow:inset 0 1px #ffffff73;overflow:visible}.spine-case-layered{display:flex;flex-direction:column;gap:0}.spine-layer{position:relative;margin-top:-.45rem;padding-top:.35rem;animation:spine-layer-in .46s var(--ease-out) both;filter:drop-shadow(0 8px 12px rgba(50,30,14,.1))}.spine-layer:first-child{margin-top:0;padding-top:.15rem}.spine-layer:nth-child(odd) .spine-row{transform:translate(0)}.spine-layer:nth-child(2n) .spine-row{transform:translate(.35rem)}.spine-rail{position:absolute;left:.15rem;right:.15rem;top:0;height:.45rem;border-radius:.2rem;background:linear-gradient(180deg,#c9ae88,#a88458);opacity:.85;z-index:0}.spine-row{position:relative;z-index:1;display:flex;align-items:flex-end;flex-wrap:nowrap;gap:.28rem;min-height:9.8rem;padding:.55rem .1rem .2rem;overflow:visible}@keyframes spine-layer-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.spine{flex:0 0 auto;width:2.35rem;height:9.6rem;border:0;border-radius:.28rem .28rem .12rem .12rem;padding:.62rem .28rem .5rem;display:flex;flex-direction:column;justify-content:space-between;align-items:center;gap:.35rem;box-shadow:inset 1px 0 #ffffff2e,inset -2px 0 #0003,0 8px 14px #28180c29;animation:spine-in .42s var(--ease-out) both;transition:transform .18s var(--ease-spring),box-shadow .18s var(--ease-out),filter .18s var(--ease-out);cursor:pointer}.spine-title,.spine-author{writing-mode:vertical-rl;text-orientation:upright;overflow:hidden;text-overflow:clip;max-height:100%;font-family:"Noto Serif SC",Songti SC,STSong,"Source Han Serif SC",Palatino,serif;line-height:1;letter-spacing:.14em}.spine-title{flex:1 1 auto;min-height:0;font-size:.86rem;font-weight:700;letter-spacing:.16em}.spine-author{flex:0 1 auto;max-height:34%;font-size:.58rem;font-weight:500;letter-spacing:.06em;opacity:.78}.spine-author.is-short{flex:0 0 auto;white-space:nowrap;max-height:none}.spine:hover{transform:translateY(-4px)}.spine.is-lifted,.spine.is-dragging{transform:translateY(-10px) scale(1.04);box-shadow:inset 1px 0 #fff3,inset -2px 0 #0003,0 16px 24px #28180c47;z-index:2;filter:brightness(1.05)}.spine-plank{height:.7rem;margin-top:.15rem;border-radius:.18rem;background:linear-gradient(180deg,tan,#b0895b 55%,#8f6640);box-shadow:0 1px #fff6e859 inset,0 6px 14px #3c20101f}@keyframes spine-in{0%{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}.shelf-filters{display:grid;gap:.55rem;margin:.85rem 0 1.15rem}.bookshelf{display:grid;gap:1.65rem;margin:.35rem 0 1rem}.shelf-bay{animation:list-in .42s var(--ease-out) both}.shelf-bay:nth-child(2){animation-delay:50ms}.shelf-bay:nth-child(3){animation-delay:.1s}.shelf-bay:nth-child(n+4){animation-delay:.14s}.shelf-bay-head{display:flex;align-items:baseline;justify-content:space-between;gap:.75rem;margin-bottom:.55rem}.shelf-bay-head h2{margin:0;font-size:1.15rem}.shelf-plank{height:.45rem;margin-top:.55rem;border-radius:.18rem;background:linear-gradient(180deg,tan,#b0895b 55%,#94683f);box-shadow:0 1px #fff6e866 inset,0 5px 12px #3c20101a}.cover-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.95rem .7rem}.shelf-book{color:inherit;text-decoration:none;transition:transform .2s var(--ease-out)}.shelf-book img{display:block;width:100%;aspect-ratio:2 / 3;height:auto;object-fit:cover;background:#e7d7c4;border-radius:.28rem;box-shadow:0 6px 14px #3c201024;transition:transform .22s var(--ease-out),box-shadow .22s var(--ease-out)}.shelf-book:hover{transform:translateY(-2px)}.shelf-book:hover img{box-shadow:0 10px 18px #3c20102e}.shelf-book:active{transform:scale(.98)}.shelf-book-title,.shelf-book-meta{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;margin-top:.4rem;line-height:1.3}.shelf-book-title{-webkit-line-clamp:2;font-size:.8rem;color:var(--ink)}.shelf-book-meta{-webkit-line-clamp:1;margin-top:.12rem;font-size:.72rem;color:var(--ink-soft)}.shelf-expand{display:block;width:100%;margin-top:.65rem;border:0;border-radius:999px;padding:.65rem 1rem;background:transparent;color:var(--accent);text-align:center}.shelf-expand:hover{background:#8f2f1d0f}@keyframes list-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.cover,.cover-lg{width:100%;object-fit:cover;background:#e7d7c4;border-radius:.45rem;transition:transform .28s var(--ease-out)}.cover{height:6.2rem}.cover-lg{width:min(16.5rem,78%);height:auto;aspect-ratio:2 / 3;object-fit:cover;border-radius:.7rem;box-shadow:0 14px 32px #3c201024}.detail-head .cover-lg{width:min(18rem,88%);justify-self:center}.meta{margin:.15rem 0 0;color:var(--ink-soft);font-size:.92rem}.dock{position:fixed;left:50%;bottom:0;transform:translate(-50%);width:min(100%,var(--page-max));max-width:var(--page-max);padding:.75rem 1rem calc(.75rem + env(safe-area-inset-bottom));background:linear-gradient(transparent,rgba(239,228,212,.72) 18%,var(--paper) 42%);pointer-events:none;animation:dock-in .42s var(--ease-out) both}.dock>*{pointer-events:auto}@keyframes dock-in{0%{opacity:0;transform:translate(-50%,12px)}to{opacity:1;transform:translate(-50%)}}.row-actions,.inline-form{display:flex;gap:.5rem;align-items:center}.detail-head{display:grid;justify-items:center;text-align:center;gap:.55rem;margin:.85rem 0 1.15rem;animation:screen-in .38s var(--ease-out) both}.detail-actions{display:grid;gap:.65rem;margin-top:1.35rem}.detail-actions .primary{width:100%}.detail-secondary{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}.detail-secondary button,.soft{width:100%;background:var(--surface);color:var(--accent);border:1px solid var(--line-strong)}.inline-form input{flex:1}.manage-item{display:grid;gap:.55rem;margin-bottom:.75rem}.loading-pulse{display:inline-flex;align-items:center;gap:.55rem}.loading-pulse:before{content:"";width:.65rem;height:.65rem;border-radius:50%;background:var(--accent);animation:pulse-dot 1s var(--ease-out) infinite}@keyframes pulse-dot{0%,to{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1.1)}}.empty-state{margin-top:2.5rem;text-align:center;color:var(--ink-soft);animation:screen-in .42s var(--ease-out) both}.empty-state .lede{margin-bottom:0}@media(hover:none){.shelf-book:hover,.chip:hover,.session-chip:hover,.ghost:hover:not(:disabled),.soft:hover:not(:disabled),.primary:hover:not(:disabled){transform:none;box-shadow:inherit}.shelf-book:hover img{transform:none}.shelf-book:active{transform:scale(.97)}.primary:active:not(:disabled){background:var(--accent-deep)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}