:root{--ink:#2c1820;--wine:#6c2737;--wine2:#9b4457;--paper:#fbf6ef;--card:#fffaf4;--gold:#bd9255;--muted:#74636a;--shadow:0 18px 45px rgba(74,34,47,.13)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(180deg,#efe5db,#fbf7f2 30%);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}.app-shell{max-width:520px;margin:auto;min-height:100vh;background:var(--paper);box-shadow:0 0 80px rgba(50,20,30,.16);padding-bottom:92px}.hero{background:#201118;color:white}.topbar{height:58px;padding:env(safe-area-inset-top) 20px 0;display:flex;align-items:center;justify-content:space-between;position:absolute;z-index:5;width:min(100%,520px)}.brand{font-family:serif;letter-spacing:.18em;font-weight:700}.icon-btn,.glass{border:1px solid rgba(255,255,255,.45);background:rgba(255,255,255,.12);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:white;border-radius:999px}.icon-btn{width:42px;height:42px;font-size:18px}.hero-art{height:670px;position:relative;overflow:hidden}.hero-art img{width:100%;height:100%;object-fit:cover;object-position:58% center;filter:saturate(.9) contrast(1.03)}.veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(26,8,15,.05) 28%,rgba(28,10,17,.88) 84%)}.hero-copy{position:absolute;left:24px;right:24px;bottom:42px}.eyebrow{font-size:12px;letter-spacing:.22em;color:#e7cba7}.hero h1{font:500 64px/1 serif;margin:12px 0}.hero p{max-width:330px;color:#f1e8e2;line-height:1.7}.hero-actions{display:flex;gap:10px;margin-top:22px}.primary,.glass,.pill,.text-btn,.fan-card button{padding:12px 16px;border-radius:999px;border:0;font-weight:700}.primary{background:#f3dcc0;color:#532234}.glass{background:rgba(255,255,255,.1)}main{padding:0 18px}.notice{margin:-16px 0 18px;position:relative;background:#fff7e8;border:1px solid #ead7b8;border-radius:16px;padding:12px;font-size:12px;line-height:1.6;color:#725a3f}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.stats div{background:white;border:1px solid #eee3da;border-radius:17px;padding:14px 6px;text-align:center}.stats b{display:block;font-family:serif;color:var(--wine);font-size:16px}.stats span{font-size:10px;color:var(--muted)}.section{padding:34px 2px 4px;scroll-margin-top:12px}.section-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:18px}.section-head small{color:var(--wine2);font-weight:800;letter-spacing:.18em}.section h2{font:700 28px/1.2 serif;margin:5px 0}.seal{display:grid;place-items:center;width:44px;height:44px;border:2px solid var(--wine);color:var(--wine);font-family:serif;transform:rotate(-4deg)}.lead{font-size:16px;line-height:1.95}.quote{margin-top:18px;padding:20px;background:linear-gradient(135deg,#6b2838,#8e4150);color:white;border-radius:22px;font:18px/1.7 serif;box-shadow:var(--shadow)}.quote span{display:block;font:11px sans-serif;opacity:.7;margin-top:8px}.work-scroll{display:flex;gap:12px;overflow:auto;scroll-snap-type:x mandatory;padding-bottom:6px}.work{min-width:76%;height:230px;border-radius:24px;position:relative;overflow:hidden;scroll-snap-align:start;background:#512331;color:white;box-shadow:var(--shadow)}.work .art{position:absolute;inset:0;background:radial-gradient(circle at 75% 30%,#d2a16e,transparent 27%),linear-gradient(135deg,#8d3a52,#28111b)}.work:nth-child(2) .art{background:radial-gradient(circle at 25% 35%,#91a9ae,transparent 28%),linear-gradient(135deg,#2b5961,#14282e)}.work:nth-child(3) .art{background:radial-gradient(circle at 70% 30%,#e8d5a5,transparent 26%),linear-gradient(135deg,#735a2d,#241e13)}.work-copy{position:absolute;inset:auto 18px 18px}.work h3{font:700 28px serif;margin:0}.work p{margin:6px 0;opacity:.8}.text-btn{background:none;color:var(--wine)}.pill{background:#eadbd2;color:var(--wine);min-width:88px}.pill:disabled{opacity:.55}.status{font-size:12px;color:var(--muted);margin-bottom:5px;line-height:1.6}.freshness{font-size:11px;color:var(--wine2);margin:0 0 14px}.feed{display:grid;gap:12px}.feed-item{background:white;border:1px solid #eee2d8;border-radius:20px;padding:16px}.feed-meta{display:flex;justify-content:space-between;align-items:center}.feed-meta time{font-size:11px;color:var(--wine2)}.feed-meta span{font-size:10px;color:var(--wine);background:#f4e4e8;border-radius:999px;padding:4px 8px}.feed-item h3{font-size:17px;margin:8px 0}.feed-item p{margin:0;color:var(--muted);line-height:1.6;font-size:13px}.feed-item a{display:inline-block;margin-top:10px;color:var(--wine);font-weight:700;text-decoration:none}.interest-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.interest{min-height:135px;padding:18px;border-radius:22px;background:white;border:1px solid #eee2d8}.interest span{font-size:28px}.interest h3{margin:12px 0 5px}.interest p{font-size:12px;color:var(--muted);line-height:1.5}.footnote{font-size:11px;color:var(--muted)}.fan-card{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,#f1dfcb,#fff8ed);padding:20px;border-radius:24px;border:1px solid #e8d2ba}.fan-card h3{margin:0}.fan-card p{margin:7px 0 0;color:var(--wine)}.fan-card button{background:var(--wine);color:white}.fan-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.fan-grid button{border:0;background:white;border-radius:20px;padding:18px;text-align:left;border:1px solid #eee2d8;min-height:130px}.fan-grid span{font-size:24px;color:var(--wine)}.fan-grid b,.fan-grid em{display:block;margin-top:8px}.fan-grid em{font-size:11px;color:var(--muted);font-style:normal}.hot-card{display:flex;gap:18px;padding:20px;background:#201118;color:white;border-radius:24px}.hot-index{font:42px serif;color:#d7b37c}.hot-card h3{margin:4px 0}.hot-card p{font-size:13px;opacity:.75;line-height:1.6}.hot-card a{color:#f4d5a5;text-decoration:none}.sources{font-size:13px;line-height:1.7;color:var(--muted)}.sources h2{color:var(--ink)}.tabbar{position:fixed;z-index:10;bottom:0;width:min(100%,520px);height:78px;padding-bottom:env(safe-area-inset-bottom);display:grid;grid-template-columns:repeat(4,1fr);background:rgba(255,250,244,.9);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-top:1px solid #eadfd6}.tabbar button{border:0;background:none;color:#8a777e;font-size:19px}.tabbar span{display:block;font-size:10px;margin-top:4px}.tabbar .active{color:var(--wine)}.modal{position:fixed;inset:0;z-index:50;background:rgba(20,8,13,.56);display:grid;place-items:end center;padding:18px;padding-bottom:calc(18px + env(safe-area-inset-bottom))}.modal-card{width:min(100%,500px);max-height:min(84vh,760px);overflow:auto;-webkit-overflow-scrolling:touch;background:var(--paper);border-radius:28px 28px 18px 18px;padding:28px 26px 26px;position:relative;box-shadow:0 26px 80px rgba(0,0,0,.35)}.close{position:sticky;float:right;right:0;top:0;border:0;background:#eee1d8;border-radius:50%;width:44px;height:44px;font-size:28px;line-height:1;z-index:3;color:#1677d2}.modal textarea{width:100%;min-height:150px;border:1px solid #ddcec4;border-radius:16px;padding:14px;font:inherit;background:white;color:var(--ink)}.action,.secondary-action{min-height:52px;padding:14px 18px;border:0;border-radius:16px;font-weight:800;font-size:15px}.action{background:var(--wine);color:white}.secondary-action{background:#eee4df;color:var(--ink)}.full{width:100%;margin-top:10px}.form-actions,.quiz-actions{display:grid;grid-template-columns:1fr 1.35fr;gap:10px;margin-top:14px}.quiz{padding-top:20px}.quiz-top{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}.quiz-progress{height:7px;background:#eadfd8;border-radius:999px;overflow:hidden;margin:10px 0 22px}.quiz-progress i{display:block;height:100%;background:linear-gradient(90deg,var(--wine2),var(--wine));border-radius:inherit}.quiz-question{font-size:20px;line-height:1.55;margin:20px 0}.quiz-options{display:grid;gap:10px}.quiz-option{width:100%;min-height:58px;border:1px solid #e2d4cc;border-radius:17px;background:white;color:var(--ink);font-size:16px;font-weight:700}.quiz-option.correct{background:#e8f5ea;border-color:#5d9b67;color:#245d2f}.quiz-option.wrong{background:#fae7e7;border-color:#c36b6b;color:#812f2f}.quiz-feedback{margin-top:14px;padding:14px;border-radius:15px;display:grid;gap:4px}.quiz-feedback.ok{background:#eaf5eb;color:#285e31}.quiz-feedback.no{background:#faeaea;color:#7b3030}.quiz-feedback span{font-size:13px;line-height:1.5}.quiz-result{text-align:center;padding-top:32px}.result-ring{width:132px;height:132px;border-radius:50%;display:grid;place-content:center;margin:0 auto 24px;background:conic-gradient(var(--wine) 0 72%,#eadfd8 72% 100%);box-shadow:inset 0 0 0 12px var(--paper)}.result-ring b{font-size:44px}.result-ring span{font-size:13px;color:var(--muted)}.quiz-result .action{width:100%;margin-top:18px}.share-card{padding:32px;border-radius:24px;background:linear-gradient(135deg,#70283b,#27131b);color:white;text-align:center}.share-card h1{font-family:serif;font-size:48px;margin:10px 0}.toast{position:fixed;z-index:80;left:50%;bottom:calc(96px + env(safe-area-inset-bottom));transform:translateX(-50%);background:#24151c;color:white;border-radius:999px;padding:12px 18px;box-shadow:0 12px 35px rgba(0,0,0,.25);font-size:13px;white-space:nowrap}.dark{--ink:#f5eae5;--paper:#1c1116;--card:#24151c;--muted:#bdaeb4;background:#120b0e}.dark .app-shell{background:var(--paper)}.dark .stats div,.dark .feed-item,.dark .interest,.dark .fan-grid button,.dark .quiz-option,.dark .modal textarea{background:#281820;border-color:#3a252e}.dark .notice{background:#2b2116;border-color:#534028;color:#e4cfae}.dark .fan-card{background:linear-gradient(135deg,#38251f,#23161a);border-color:#51352e}.dark .tabbar{background:rgba(28,17,22,.92);border-color:#3b2730}.dark .secondary-action{background:#39252e}.modal[hidden],.toast[hidden],#quizFeedback[hidden],#nextQuiz[hidden]{display:none!important}html.modal-open,body.modal-open{overflow:hidden;touch-action:none}.modal,.modal-card,.close,button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #d7a85d;outline-offset:3px}@media(max-height:700px){.hero-art{height:590px}.modal-card{max-height:88vh}}@media(max-width:370px){.hero h1{font-size:54px}.stats{grid-template-columns:1fr 1fr}.fan-grid{grid-template-columns:1fr}.modal{padding:10px}.modal-card{padding:22px 18px}.quiz-actions,.form-actions{grid-template-columns:1fr}}