:root{--bg-color: #f5f0e6;--text-main: #3e2723;--text-light: #5d4037;--accent-color: #8b4513;--gold-primary: #cda434;--gold-light: #e8d8a6;--card-bg: rgba(253, 251, 247, .9);--shadow-soft: 0 10px 30px rgba(139, 69, 19, .08);--border-radius: 8px;--font-serif: "Georgia", "Times New Roman", STZhongsong, serif;--font-sans: system-ui, -apple-system, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);color:var(--text-main);background-color:var(--bg-color);overflow-x:hidden}.global-bg-pattern{position:fixed;top:0;left:0;width:100vw;height:100vh;background-image:radial-gradient(var(--gold-light) 1px,transparent 1px),radial-gradient(var(--gold-light) 1px,transparent 1px);background-size:40px 40px;background-position:0 0,20px 20px;opacity:.3;z-index:-1;pointer-events:none}.museum-app{min-height:100vh;display:flex;flex-direction:column}.museum-header{display:flex;justify-content:space-between;align-items:center;padding:16px 32px;background:#f5f0e6d9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:2px solid var(--accent-color);position:sticky;top:0;z-index:100;box-shadow:0 4px 20px #0000000d}.header-left{display:flex;align-items:center;gap:12px;cursor:pointer}.header-left h1{font-family:var(--font-serif);font-size:24px;color:var(--accent-color);margin:0;letter-spacing:2px}.logo-icon{color:var(--accent-color)}.cloud-badge{display:flex;align-items:center;gap:4px;font-size:12px;background:#8b45131a;padding:4px 10px;border-radius:20px;color:var(--accent-color);margin-left:8px;border:1px solid rgba(139,69,19,.2)}.spin{animation:spin 2s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.header-search{display:flex;align-items:center;background:#fff;padding:8px 16px;border-radius:4px;border:1px solid var(--gold-light);width:300px;transition:all .3s;box-shadow:inset 0 2px 4px #00000005}.header-search:focus-within{border-color:var(--accent-color);box-shadow:0 0 0 2px #8b45131a}.header-search input{border:none;outline:none;background:transparent;margin-left:8px;width:100%;font-size:14px;color:var(--text-main)}.header-nav{display:flex;gap:16px}.header-nav button{display:flex;align-items:center;gap:6px;background:none;border:none;color:var(--text-light);cursor:pointer;font-size:15px;padding:6px 12px;border-radius:4px;transition:all .2s;font-family:var(--font-serif)}.header-nav button:hover,.header-nav button.active{background:#8b451314;color:var(--accent-color)}.museum-main{padding:40px 32px;max-width:1200px;margin:0 auto;width:100%;flex:1}.gallery-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px;flex-wrap:wrap;gap:16px}.filter-tags{display:flex;gap:12px;flex-wrap:wrap}.filter-tag{background:transparent;border:1px solid var(--accent-color);color:var(--accent-color);padding:6px 18px;border-radius:4px;cursor:pointer;font-family:var(--font-serif);transition:all .3s}.filter-tag.active{background:var(--accent-color);color:#fff;box-shadow:0 4px 12px #8b45134d}.random-btn{display:flex;align-items:center;gap:8px;background:var(--bg-color);color:var(--accent-color);border:1px dashed var(--accent-color);padding:8px 20px;border-radius:4px;cursor:pointer;font-family:var(--font-serif);transition:all .2s}.random-btn:hover{background:#8b45130d;transform:translateY(-2px)}.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:30px}.person-card{background:var(--card-bg);border-radius:var(--border-radius);overflow:hidden;box-shadow:var(--shadow-soft);cursor:pointer;border:1px solid #e0d5c1;display:flex;flex-direction:column;position:relative}.card-img-wrapper{position:relative;height:180px;width:100%;overflow:hidden;background:#dcd3c0}.card-img-wrapper img{width:100%;height:100%;object-fit:cover;filter:sepia(.3) contrast(1.1);transition:transform .8s ease}.person-card:hover .card-img-wrapper img{transform:scale(1.05)}.img-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom,transparent 50%,rgba(62,39,35,.8) 100%)}.fav-btn-overlay{position:absolute;top:12px;right:12px;background:#fff3;border:1px solid rgba(255,255,255,.4);border-radius:50%;width:36px;height:36px;display:flex;justify-content:center;align-items:center;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:all .2s}.fav-btn-overlay:hover{background:#fff6}.card-content{padding:20px;flex:1;display:flex;flex-direction:column;position:relative;z-index:1;background:var(--card-bg)}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.card-header h3{font-family:var(--font-serif);font-size:22px;margin:0;color:var(--accent-color);letter-spacing:1px}.era-badge{font-size:12px;border:1px solid var(--accent-color);color:var(--accent-color);padding:2px 6px;border-radius:2px;font-family:var(--font-serif)}.category-text{font-size:13px;color:var(--text-light);margin-bottom:12px;display:inline-block;border-bottom:1px dotted var(--text-light);padding-bottom:2px}.card-content p{font-size:14px;line-height:1.6;color:var(--text-main);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.card-footer-deco{height:4px;width:100%;background:repeating-linear-gradient(45deg,var(--accent-color),var(--accent-color) 10px,transparent 10px,transparent 20px);opacity:.5}.person-card.mini .card-img-wrapper{height:120px}.person-card.mini .card-content{padding:16px}.detail-view{background:var(--card-bg);border-radius:4px;padding:40px;box-shadow:0 20px 40px #0000001a;border:1px solid #e0d5c1;position:relative}.detail-view:before{content:"";position:absolute;top:10px;bottom:10px;left:10px;right:10px;border:1px solid rgba(139,69,19,.2);pointer-events:none}.back-btn{display:flex;align-items:center;gap:8px;background:none;border:none;color:var(--accent-color);cursor:pointer;font-size:16px;margin-bottom:32px;padding:8px 0;font-family:var(--font-serif)}.back-btn:hover{text-decoration:underline}.detail-container{display:flex;gap:48px;position:relative;z-index:1}@media (max-width: 768px){.detail-container{flex-direction:column}}.detail-left{width:320px;flex-shrink:0;display:flex;flex-direction:column;gap:20px}.detail-portrait-frame{width:100%;aspect-ratio:4/3;position:relative;padding:12px;background:#fff;box-shadow:0 4px 15px #0000001a;border:1px solid #eee}.detail-portrait-frame img{width:100%;height:100%;object-fit:cover;filter:sepia(.2)}.frame-border{position:absolute;top:16px;right:16px;bottom:16px;left:16px;border:1px dashed rgba(255,255,255,.5);pointer-events:none}.action-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px;border-radius:4px;border:1px solid var(--accent-color);background:transparent;color:var(--accent-color);font-family:var(--font-serif);cursor:pointer;transition:all .2s}.action-btn.active{background:var(--accent-color);color:#fff}.detail-right{flex:1}.detail-title-area{margin-bottom:32px;border-bottom:2px solid var(--accent-color);padding-bottom:16px}.detail-title-area h2{font-family:var(--font-serif);font-size:42px;color:var(--text-main);margin-bottom:16px;letter-spacing:2px}.badges{display:flex;gap:12px}.cat-badge{font-size:14px;background:#8b45131a;color:var(--accent-color);padding:4px 12px;border-radius:2px;font-family:var(--font-serif)}.detail-content{display:flex;flex-direction:column;gap:32px}.info-section h3{display:flex;align-items:center;gap:10px;font-family:var(--font-serif);color:var(--accent-color);margin-bottom:16px;font-size:22px;border-bottom:1px dashed rgba(139,69,19,.3);padding-bottom:8px;display:inline-flex}.info-section p{line-height:1.8;font-size:16px;text-align:justify;color:var(--text-main);text-indent:2em}.info-section ul{list-style-type:none;padding-left:0}.info-section ul li{position:relative;padding-left:28px;margin-bottom:16px;line-height:1.6;color:var(--text-main)}.info-section ul li:before{content:"";position:absolute;left:0;top:8px;width:8px;height:8px;background:var(--gold-primary);transform:rotate(45deg)}.highlight-box{background:#cda4341a;padding:24px;border-left:4px solid var(--gold-primary);border-radius:0 4px 4px 0}.highlight-box p{text-indent:0;font-style:italic}.list-header{display:flex;align-items:center;gap:24px;margin-bottom:32px}.list-header h2{font-family:var(--font-serif);color:var(--accent-color);font-size:28px}.empty-state{text-align:center;padding:80px;color:var(--text-light);font-size:16px;background:transparent;border:1px dashed var(--accent-color);border-radius:4px;font-family:var(--font-serif)}.toast{position:fixed;bottom:40px;left:50%;transform:translate(-50%);background:var(--accent-color);color:#fff;padding:12px 24px;border-radius:4px;box-shadow:0 10px 25px #8b45134d;z-index:1000;font-family:var(--font-serif);letter-spacing:1px}
