:root{
  --ink:#2b2028;--muted:#7b6e75;--paper:#f7f2ea;--card:#fffdf9;--line:#e7ddd4;
  --rose:#d97978;--rose-soft:#f5d6cb;--plum:#6b405e;--sage:#8fa58a;--gold:#c89a58;
  --shadow:0 18px 50px rgba(61,38,48,.09);--serif:"Songti SC","STSong",Georgia,serif;
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--paper);color:var(--ink)}
body{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}.hidden{display:none!important}button,input,textarea,select{font:inherit}button{color:inherit}
.shell{min-height:100vh;display:grid;grid-template-columns:230px minmax(0,1fr)}
.sidebar{position:sticky;top:0;height:100vh;padding:30px 24px 24px;border-right:1px solid var(--line);background:#f3ece4;display:flex;flex-direction:column;z-index:20}
.logo{display:flex;align-items:center;gap:11px;border:0;background:transparent;padding:0;cursor:pointer;text-align:left}.logo-mark{width:36px;height:36px;position:relative;border-radius:11px;background:var(--ink);box-shadow:0 7px 16px #3d263421}.logo-mark:before,.logo-mark:after{content:"";position:absolute;top:10px;width:10px;height:17px;border:2px solid #f1bca8;border-radius:2px 6px 6px 2px}.logo-mark:before{left:7px}.logo-mark:after{right:7px;transform:scaleX(-1)}.logo strong{display:block;font-family:var(--serif);font-size:19px;letter-spacing:.03em}.logo small{display:block;margin-top:2px;color:#9b8d93;font-size:8px;letter-spacing:.14em;text-transform:uppercase}
.nav{display:grid;gap:7px;margin-top:45px}.nav button{height:44px;display:flex;align-items:center;gap:12px;padding:0 13px;border:0;border-radius:12px;background:transparent;color:#80727a;font-size:12px;cursor:pointer;transition:.18s}.nav button:hover{background:#eee4dc;color:var(--ink)}.nav button.active{background:#fffaf5;color:var(--plum);box-shadow:0 5px 14px rgba(61,38,48,.06);font-weight:700}.nav-icon{width:23px;height:23px;display:grid;place-items:center;border-radius:7px;background:#ebe1da;font-size:13px}.nav button.active .nav-icon{background:#f4d8cf;color:#a34f53}
.sidebar-card{margin-top:auto;padding:16px;border:1px solid #e5d8cf;border-radius:16px;background:#fff9f3}.sidebar-card .mini-label{color:#9b8c92;font-size:8px;letter-spacing:.1em}.sidebar-card strong{display:block;margin:8px 0 5px;font-family:var(--serif);font-size:14px}.sidebar-card p{margin:0;color:#8d7f86;font-size:9px;line-height:1.6}.sidebar-profile{display:flex;align-items:center;gap:9px;margin-top:17px;padding-top:15px;border-top:1px solid #e5d8cf}.avatar{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:var(--plum);color:#fff3ec;font-family:var(--serif);font-size:12px}.sidebar-profile span{display:block;font-size:10px;font-weight:700}.sidebar-profile small{display:block;margin-top:2px;color:#a09398;font-size:8px}
.main{min-width:0}.topbar{height:72px;position:sticky;top:0;z-index:15;padding:0 34px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(224,212,203,.85);background:rgba(247,242,234,.9);backdrop-filter:blur(16px)}.search{width:min(350px,40vw);height:38px;display:flex;align-items:center;gap:9px;padding:0 13px;border:1px solid var(--line);border-radius:11px;background:#fffaf5;color:#9b8e94;font-size:10px}.search input{width:100%;border:0;outline:0;background:transparent;color:var(--ink)}.search input::placeholder{color:#a99da2}.top-actions{display:flex;align-items:center;gap:9px}.top-actions button{height:37px;padding:0 14px;border-radius:10px;cursor:pointer;font-size:10px;font-weight:700}.outline-btn{border:1px solid var(--line);background:#fffaf5}.primary-btn{border:1px solid var(--ink);background:var(--ink);color:#fff7f1;box-shadow:0 6px 14px rgba(43,32,40,.16)}
.page{max-width:1370px;margin:0 auto;padding:36px 38px 60px}.welcome-row{display:flex;align-items:flex-start;justify-content:space-between;gap:30px;margin-bottom:26px}.kicker{color:#9a858e;font-size:9px;letter-spacing:.14em;text-transform:uppercase}.welcome-row h1{margin:7px 0 6px;font-family:var(--serif);font-size:31px;font-weight:600;letter-spacing:.02em}.welcome-row p{margin:0;color:var(--muted);font-size:11px}.date-chip{padding:9px 13px;border:1px solid var(--line);border-radius:99px;background:#fffaf5;color:#8f7f87;font-size:9px}
.mood-panel{position:relative;overflow:hidden;padding:24px 25px;border-radius:20px;background:var(--ink);color:#fff7f1;box-shadow:var(--shadow)}.mood-panel:after{content:"下\A一\A本";white-space:pre;position:absolute;right:34px;top:17px;color:rgba(255,255,255,.055);font-family:var(--serif);font-size:41px;line-height:.85}.mood-head{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center}.mood-head h2{margin:0;font-family:var(--serif);font-size:18px;font-weight:500}.mood-head span{color:#bbaeb5;font-size:9px}.tag-cloud{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.taste-tag{padding:8px 12px;border:1px solid rgba(255,255,255,.15);border-radius:99px;background:rgba(255,255,255,.05);color:#d8ced3;font-size:9px;cursor:pointer;transition:.18s}.taste-tag:hover{background:rgba(255,255,255,.1)}.taste-tag.selected{border-color:#f2bdac;background:#f1c5b4;color:#3c2732;font-weight:700}.mood-foot{position:relative;z-index:1;margin-top:16px;display:flex;align-items:center;justify-content:space-between}.selected-note{color:#b9acb3;font-size:9px}.selected-note b{color:#f1c5b4}.soft-btn{border:0;background:transparent;color:#d8cbd1;font-size:9px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;margin:31px 0 15px}.section-head h2{margin:0;font-family:var(--serif);font-size:20px;font-weight:600}.section-head p{margin:5px 0 0;color:#8e8087;font-size:9px}.section-tools{display:flex;align-items:center;gap:8px}.section-tools button{height:31px;padding:0 10px;border:1px solid var(--line);border-radius:9px;background:#fffaf5;color:#7f7078;font-size:9px;cursor:pointer}
.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:24px}.recommend-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.book-card{min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:17px;background:var(--card);box-shadow:0 10px 30px rgba(61,38,48,.055);transition:.2s}.book-card:hover{transform:translateY(-3px);box-shadow:0 16px 38px rgba(61,38,48,.09)}.book-visual{height:207px;position:relative;overflow:hidden;padding:20px;background:var(--cover);color:var(--coverInk,#fff)}.book-visual:before{content:"";position:absolute;inset:10px;border:1px solid rgba(255,255,255,.28);border-radius:4px}.book-visual:after{content:"";position:absolute;width:150px;height:150px;border:1px solid rgba(255,255,255,.22);border-radius:50%;right:-60px;bottom:-65px}.cover-type{position:relative;z-index:2;font-size:8px;letter-spacing:.15em;opacity:.8}.cover-title{position:absolute;left:22px;bottom:22px;z-index:2;max-width:85%;font-family:var(--serif);font-size:27px;line-height:1.15;letter-spacing:.06em}.cover-symbol{position:absolute;right:20px;top:17px;font-family:var(--serif);font-size:32px;opacity:.42}.match-pill{position:absolute;right:12px;bottom:12px;z-index:3;padding:5px 8px;border-radius:99px;background:rgba(255,253,249,.9);color:#5c3e50;font-size:8px;font-weight:800;box-shadow:0 4px 12px rgba(0,0,0,.09)}
.book-body{padding:15px}.book-title-row{display:flex;justify-content:space-between;gap:9px}.book-title-row h3{margin:0;font-family:var(--serif);font-size:16px}.book-title-row span{color:#a2939a;font-size:8px;white-space:nowrap}.author{margin:4px 0 0;color:#9a8c93;font-size:9px}.tags{display:flex;flex-wrap:wrap;gap:5px;margin:12px 0}.tags span{padding:4px 6px;border-radius:6px;background:#f5eee8;color:#775f6c;font-size:8px}.recommend-why{min-height:37px;margin:0;padding:9px 10px;border-left:2px solid #e7a995;background:#fff7f2;color:#826d77;font-size:8px;line-height:1.55}.recommend-why b{color:#b85e60}.book-meta{display:flex;gap:9px;margin:11px 0;color:#9c8e95;font-size:8px}.book-actions{display:grid;grid-template-columns:1fr 1fr 34px;gap:6px}.book-actions button{height:32px;border:1px solid var(--line);border-radius:8px;background:#fff;color:#776870;font-size:8px;cursor:pointer}.book-actions .want{border-color:#d9a091;background:#f7d8cd;color:#7e3d46;font-weight:700}.book-actions button:hover{filter:brightness(.98)}
.taste-aside{align-self:start;position:sticky;top:96px;border:1px solid var(--line);border-radius:18px;background:#fffaf5;padding:19px}.aside-head{display:flex;align-items:center;justify-content:space-between}.aside-head h3{margin:0;font-family:var(--serif);font-size:15px}.aside-head span{color:#a4979d;font-size:8px}.taste-bars{display:grid;gap:13px;margin-top:18px}.taste-row{display:grid;grid-template-columns:74px 1fr 28px;align-items:center;gap:7px;font-size:8px}.taste-row span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bar{height:5px;border-radius:99px;background:#eee4dd;overflow:hidden}.bar i{height:100%;display:block;border-radius:inherit;background:linear-gradient(90deg,#c77476,#e7ab96)}.taste-row b{color:#9b727e;font-size:8px;text-align:right}.trend{margin-top:19px;padding:12px;border-radius:12px;background:#f2ebe5}.trend small{color:#a08e96;font-size:7px;letter-spacing:.1em}.trend strong{display:block;margin:6px 0 4px;font-family:var(--serif);font-size:12px}.trend p{margin:0;color:#8c7d84;font-size:8px;line-height:1.55}.swipe-entry{margin-top:12px;width:100%;height:38px;border:0;border-radius:10px;background:var(--plum);color:#fff6f0;font-size:9px;font-weight:700;cursor:pointer}
.stats-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:22px}.stat{padding:15px 17px;border:1px solid var(--line);border-radius:14px;background:#fffaf5}.stat strong{display:block;font-family:var(--serif);font-size:23px;font-weight:500}.stat span{display:block;margin-top:3px;color:#94868d;font-size:8px}
.view-title{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:24px}.view-title h1{margin:0;font-family:var(--serif);font-size:28px;font-weight:600}.view-title p{margin:6px 0 0;color:var(--muted);font-size:10px}.empty{padding:70px 25px;text-align:center;border:1px dashed #d9ccc3;border-radius:18px;background:#fffaf5}.empty span{display:block;font-size:38px}.empty h3{margin:14px 0 7px;font-family:var(--serif)}.empty p{margin:0;color:#94868d;font-size:9px}
.shelf-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.shelf-card{display:flex;gap:12px;padding:13px;border:1px solid var(--line);border-radius:14px;background:#fffaf5}.mini-cover{width:62px;height:88px;flex:none;display:grid;place-items:center;padding:8px;border-radius:5px;background:var(--cover);color:var(--coverInk,#fff);font-family:var(--serif);font-size:13px;text-align:center;box-shadow:0 6px 12px rgba(61,38,48,.12)}.shelf-card h3{margin:5px 0 4px;font-family:var(--serif);font-size:13px}.shelf-card p{margin:0;color:#92848b;font-size:8px}.shelf-card button{margin-top:17px;padding:0;border:0;background:transparent;color:#a45155;font-size:8px;cursor:pointer}
.record-list{display:grid;gap:10px}.record-item{display:grid;grid-template-columns:54px minmax(0,1fr) 130px 80px;align-items:center;gap:14px;padding:12px 15px;border:1px solid var(--line);border-radius:14px;background:#fffaf5}.record-cover{width:44px;height:58px;display:grid;place-items:center;border-radius:4px;background:var(--cover);color:var(--coverInk,#fff);font-family:var(--serif);font-size:10px;text-align:center}.record-item h3{margin:0 0 4px;font-family:var(--serif);font-size:13px}.record-item p{margin:0;color:#93858c;font-size:8px}.record-tags{display:flex;gap:4px;flex-wrap:wrap}.record-tags span{padding:4px 6px;border-radius:5px;background:#f0e6df;color:#75616b;font-size:7px}.rating{color:#c17b58;font-size:11px;text-align:right}
.profile-hero{display:grid;grid-template-columns:1fr 1fr;gap:18px}.profile-card{padding:24px;border:1px solid var(--line);border-radius:18px;background:#fffaf5}.profile-card.dark{background:var(--ink);color:#fff7f1}.profile-card h2{margin:0;font-family:var(--serif);font-size:20px}.profile-card p{color:#92848b;font-size:9px;line-height:1.7}.profile-card.dark p{color:#c1b4ba}.big-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}.big-tags span{padding:8px 10px;border-radius:99px;background:#f1e6df;color:#6f5562;font-size:9px}.profile-card.dark .big-tags span{background:rgba(255,255,255,.1);color:#f0d5ca}.profile-chart{display:flex;align-items:flex-end;gap:9px;height:125px;margin-top:17px;padding-top:15px;border-top:1px solid rgba(255,255,255,.12)}.profile-chart div{flex:1;position:relative;height:var(--h);border-radius:5px 5px 2px 2px;background:linear-gradient(#edb5a2,#ac6670)}.profile-chart div span{position:absolute;bottom:-18px;left:50%;transform:translateX(-50%);font-size:7px;color:#c5b5bc}
.swipe-page{min-height:calc(100vh - 145px);display:grid;place-items:center}.swipe-wrap{text-align:center}.swipe-wrap h1{margin:0;font-family:var(--serif);font-size:28px}.swipe-wrap>p{margin:7px 0 20px;color:#8d8086;font-size:10px}.swipe-stack{width:320px;height:430px;position:relative;margin:auto}.swipe-card{position:absolute;inset:0;overflow:hidden;border:1px solid var(--line);border-radius:22px;background:#fffaf5;box-shadow:0 22px 60px rgba(61,38,48,.16);transition:.3s}.swipe-card.behind{transform:translate(9px,8px) rotate(2deg);opacity:.55}.swipe-cover{height:260px;position:relative;padding:24px;background:var(--cover);color:var(--coverInk,#fff);text-align:left}.swipe-cover strong{position:absolute;left:23px;bottom:22px;max-width:80%;font-family:var(--serif);font-size:32px;line-height:1.15}.swipe-info{padding:17px;text-align:left}.swipe-info h3{margin:0;font-family:var(--serif);font-size:18px}.swipe-info p{margin:7px 0;color:#8b7d84;font-size:9px;line-height:1.6}.swipe-actions{display:flex;justify-content:center;gap:12px;margin-top:18px}.swipe-actions button{width:48px;height:48px;border:1px solid var(--line);border-radius:50%;background:#fffaf5;font-size:17px;cursor:pointer;box-shadow:0 7px 16px rgba(61,38,48,.08)}.swipe-actions button:nth-child(2){width:58px;height:58px;margin-top:-5px;background:#f2c8ba;color:#8b3f48}.swipe-count{margin-top:13px;color:#a2949a;font-size:8px}
.modal-backdrop{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:18px;background:rgba(39,28,36,.48);backdrop-filter:blur(6px)}.modal{width:min(540px,100%);max-height:90vh;overflow:auto;padding:24px;border-radius:20px;background:#fffaf5;box-shadow:0 25px 80px rgba(31,19,27,.28)}.modal-head{display:flex;justify-content:space-between;align-items:flex-start}.modal h2{margin:0;font-family:var(--serif);font-size:21px}.modal-head p{margin:5px 0 0;color:#94868d;font-size:9px}.close{width:30px;height:30px;border:1px solid var(--line);border-radius:50%;background:#fff;cursor:pointer}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}.field{display:block;color:#796b73;font-size:9px}.field.full{grid-column:1/-1}.field input,.field textarea,.field select{width:100%;margin-top:6px;padding:10px 11px;border:1px solid var(--line);border-radius:9px;background:#fff;outline:0;color:var(--ink);font-size:10px}.field textarea{height:72px;resize:none}.field input:focus,.field textarea:focus,.field select:focus{border-color:#c9867d}.star-pick{display:flex;gap:5px;margin-top:7px}.star-pick button{padding:0;border:0;background:transparent;color:#d9c8bd;font-size:21px;cursor:pointer}.star-pick button.on{color:#c47a56}.form-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}.form-tags button{padding:6px 8px;border:1px solid var(--line);border-radius:99px;background:#fff;color:#81727a;font-size:8px;cursor:pointer}.form-tags button.on{border-color:#d69b8d;background:#f5d5ca;color:#87444d}.modal-submit{width:100%;height:42px;margin-top:20px;border:0;border-radius:11px;background:var(--ink);color:#fff;font-size:10px;font-weight:700;cursor:pointer}
.toast{position:fixed;left:50%;bottom:25px;z-index:100;display:flex;align-items:center;gap:9px;padding:10px 15px;border-radius:11px;background:#2b2028;color:#fff8f3;font-size:9px;box-shadow:0 12px 30px rgba(43,32,40,.25);transform:translateX(-50%);animation:toastIn .25s}.toast span{width:20px;height:20px;display:grid;place-items:center;border-radius:50%;background:#f0c6b5;color:#5c3447}.toast b{font-weight:600}@keyframes toastIn{from{opacity:0;transform:translate(-50%,8px)}}
@media(max-width:1100px){.shell{grid-template-columns:76px minmax(0,1fr)}.sidebar{padding:22px 13px}.logo-copy,.nav button>span:not(.nav-icon),.sidebar-card{display:none}.logo{justify-content:center}.nav button{justify-content:center;padding:0}.content-grid{grid-template-columns:1fr}.taste-aside{position:static;display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:12px;align-items:center}.taste-bars{grid-template-columns:1fr 1fr;margin-top:0}.trend{margin-top:0}.shelf-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.shell{display:block;padding-bottom:66px}.sidebar{width:100%;height:62px;position:fixed;inset:auto 0 0;display:block;padding:7px 10px;border:0;border-top:1px solid var(--line);background:#f7f1e9}.logo,.sidebar-profile{display:none}.nav{height:100%;margin:0;display:grid;grid-template-columns:repeat(5,1fr);gap:2px}.nav button{height:48px;display:grid;gap:0;place-items:center;font-size:7px}.nav button>span:not(.nav-icon){display:block}.nav-icon{width:24px;height:22px;background:transparent}.nav button.active{box-shadow:none;background:#f0ded5}.topbar{height:60px;padding:0 15px}.search{width:40px;padding:0;justify-content:center}.search input{display:none}.top-actions .outline-btn{display:none}.page{padding:24px 15px 40px}.welcome-row{display:block}.date-chip{display:none}.welcome-row h1{font-size:26px}.mood-panel{padding:21px 18px}.content-grid{display:block}.recommend-grid{grid-template-columns:1fr;gap:13px}.book-card{display:grid;grid-template-columns:130px 1fr}.book-visual{height:auto;min-height:250px}.cover-title{font-size:22px}.match-pill{right:8px;bottom:8px}.taste-aside{display:block;margin-top:16px}.taste-bars{display:grid;grid-template-columns:1fr 1fr;margin-top:17px}.trend{margin-top:17px}.stats-strip{grid-template-columns:1fr 1fr}.shelf-grid{grid-template-columns:1fr}.record-item{grid-template-columns:48px 1fr 70px}.record-tags{display:none}.profile-hero{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.swipe-stack{width:min(320px,calc(100vw - 40px))}}
