.formula-page{--paper-50:#fefdfb;--paper-100:#f9f6f0;--paper-200:#f0ebe0;--ink-300:#8c8478;--ink-500:#5c5549;--ink-700:#3a342b;--ink-900:#1a1612;--jade-400:#3ba68f;--jade-500:#2d8f7b;--jade-600:#247a69;--jade-700:#1b6455;--gold-400:#d4b87a;--gold-500:#c9a96e;--gold-600:#b8953a;--vermilion-500:#c73c3c;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--shadow-sm:0 1px 3px #00000014;--shadow-md:0 4px 12px #0000001a;--shadow-lg:0 8px 30px #0000001f;background:var(--paper-100);color:var(--ink-700);min-height:100vh;font-family:Noto Serif SC,STSong,serif;line-height:1.7}.formula-page .navbar{background:var(--paper-50);border-bottom:1px solid var(--paper-200);z-index:100;justify-content:space-between;align-items:center;height:52px;padding:0 32px;display:flex;position:sticky;top:0}.formula-page .navbar-brand{color:var(--ink-900);cursor:pointer;align-items:center;gap:8px;font-size:16px;font-weight:700;text-decoration:none;display:flex}.formula-page .nav-links{gap:20px;display:flex}.formula-page .nav-links a{color:var(--ink-500);font-size:13px;text-decoration:none;transition:all .2s}.formula-page .nav-links a:hover,.formula-page .nav-links a.active{color:var(--jade-500);font-weight:600}.fm-header{text-align:center;background:linear-gradient(180deg,var(--paper-50),var(--paper-100));padding:108px 24px 32px}.fm-header h1{color:var(--ink-900);letter-spacing:2px;margin-bottom:8px;font-size:28px}.fm-header .subtitle{color:var(--ink-300);font-size:14px}.fm-stats{justify-content:center;gap:32px;margin-top:16px;display:flex}.fm-stat{text-align:center}.fm-stat-num{color:var(--gold-600);font-size:24px;font-weight:700}.fm-stat-label{color:var(--ink-300);font-size:11px}.fm-filter{max-width:1100px;margin:0 auto 24px;padding:0 24px}.fm-search{background:var(--paper-50);border:1px solid var(--paper-200);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);align-items:center;gap:8px;padding:8px 16px;display:flex}.fm-search input{color:var(--ink-700);background:0 0;border:none;outline:none;flex:1;font-family:inherit;font-size:14px}.fm-search-btn{border-radius:var(--radius-sm);background:var(--gold-600);color:#fff;cursor:pointer;white-space:nowrap;border:none;padding:5px 16px;font-family:inherit;font-size:13px;transition:all .2s}.fm-search-btn:hover{background:var(--gold-500)}.fm-tabs{flex-wrap:wrap;justify-content:center;gap:6px;margin-top:12px;display:flex}.fm-tab{cursor:pointer;border:1px solid var(--paper-200);background:var(--paper-50);color:var(--ink-500);border-radius:20px;padding:4px 12px;font-size:11px;transition:all .2s}.fm-tab:hover,.fm-tab.active{background:var(--gold-600);color:#fff;border-color:var(--gold-600)}.fm-tab .tab-count{opacity:.7;margin-left:2px;font-size:9px}.fm-source-tabs{flex-wrap:wrap;justify-content:center;gap:6px;margin-top:8px;display:flex}.fm-source-tab{cursor:pointer;color:var(--jade-600);background:#2d8f7b0d;border:1px solid #2d8f7b33;border-radius:16px;padding:3px 10px;font-size:10px;transition:all .2s}.fm-source-tab:hover,.fm-source-tab.active{background:var(--jade-500);color:#fff;border-color:var(--jade-500)}.fm-grid-wrap{max-width:1200px;margin:0 auto;padding:0 24px 40px}.fm-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;display:grid}.fm-card{background:var(--paper-50);border:1px solid var(--paper-200);border-radius:var(--radius-lg);cursor:pointer;padding:20px;transition:all .3s;position:relative;overflow:hidden}.fm-card:hover{box-shadow:var(--shadow-lg);border-color:var(--gold-500);transform:translateY(-3px)}.fm-card:before{content:"";background:linear-gradient(90deg,var(--gold-500),var(--gold-400));opacity:0;height:3px;transition:all .3s;position:absolute;top:0;left:0;right:0}.fm-card:hover:before{opacity:1}.fm-card-head{align-items:baseline;gap:8px;margin-bottom:8px;display:flex}.fm-name{color:var(--ink-900);font-size:18px;font-weight:700}.fm-cat{color:var(--gold-600);background:#b8953a1a;border-radius:10px;padding:2px 8px;font-size:10px;font-weight:600;display:inline-block}.fm-source{color:var(--ink-300);margin-bottom:6px;font-size:11px}.fm-source em{color:var(--jade-600);font-style:normal}.fm-comp{color:var(--ink-500);-webkit-line-clamp:2;border-radius:var(--radius-sm);border-left:3px solid var(--gold-500);background:#c9a96e0f;-webkit-box-orient:vertical;margin-bottom:8px;padding:8px 12px;font-size:12px;line-height:1.6;display:-webkit-box;overflow:hidden}.fm-indications{flex-wrap:wrap;gap:4px;display:flex}.fm-ind-tag{color:var(--vermilion-500);background:#c73c3c0f;border:1px solid #c73c3c1f;border-radius:12px;padding:2px 8px;font-size:10px}.fm-loading{text-align:center;color:var(--ink-300);padding:80px 24px}.fm-loading .spinner{border:3px solid var(--paper-200);border-top-color:var(--gold-500);border-radius:50%;width:32px;height:32px;margin-bottom:12px;animation:.8s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.fm-empty{text-align:center;color:var(--ink-300);padding:60px}.fm-pager{justify-content:center;align-items:center;gap:8px;padding:24px;display:flex}.fm-pager button{border-radius:var(--radius-sm);border:1px solid var(--paper-200);background:var(--paper-50);color:var(--ink-500);cursor:pointer;padding:6px 14px;font-family:inherit;font-size:13px;transition:all .2s}.fm-pager button:hover:not(:disabled){background:var(--gold-600);color:#fff;border-color:var(--gold-600)}.fm-pager button:disabled{opacity:.4;cursor:default}.fm-pager .page-info{color:var(--ink-300);font-size:12px}.fm-overlay{z-index:200;background:#00000080;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.fm-overlay.show{display:flex}.fm-modal{background:var(--paper-50);border-radius:var(--radius-lg);width:92%;max-width:680px;max-height:85vh;box-shadow:var(--shadow-lg);position:relative;overflow-y:auto}.fm-modal-header{border-bottom:1px solid var(--paper-200);background:var(--paper-50);z-index:1;border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding:24px 28px 16px;position:sticky;top:0}.fm-modal-close{background:var(--paper-200);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:16px;transition:all .2s;display:flex;position:absolute;top:16px;right:16px}.fm-modal-close:hover{background:var(--vermilion-500);color:#fff}.fm-modal-name{color:var(--ink-900);font-size:24px;font-weight:700}.fm-modal-meta{color:var(--ink-300);margin-top:4px;font-size:12px}.fm-modal-body{padding:20px 28px 28px}.fm-detail-sec{margin-bottom:20px}.fm-detail-label{color:var(--gold-600);align-items:center;gap:6px;margin-bottom:6px;font-size:12px;font-weight:600;display:flex}.fm-detail-label:before{content:"";background:var(--gold-500);border-radius:2px;width:3px;height:14px;display:inline-block}.fm-detail-text{color:var(--ink-700);font-size:14px;line-height:1.8}.fm-detail-comp{border-radius:var(--radius-md);color:var(--ink-900);background:linear-gradient(135deg,#c9a96e0f,#c9a96e1f);border:1px solid #c9a96e33;padding:14px 18px;font-size:14px;line-height:1.8}.fm-detail-pills{flex-wrap:wrap;gap:6px;display:flex}.fm-detail-pill{color:var(--vermilion-500);background:#c73c3c14;border:1px solid #c73c3c26;border-radius:16px;padding:4px 12px;font-size:12px}.fm-detail-source{background:var(--paper-200);border-radius:var(--radius-md);color:var(--ink-500);padding:10px 16px;font-size:13px;font-style:italic}.fm-cat-nav{max-width:1100px;margin:0 auto 16px;padding:0 24px}.fm-cat-nav-title{color:var(--ink-700);letter-spacing:1px;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:14px;font-weight:600;display:flex}.fm-cat-all-btn{color:var(--vermilion-500);cursor:pointer;letter-spacing:0;background:#c73c3c0f;border:1px solid #c73c3c26;border-radius:12px;padding:3px 12px;font-size:11px;font-weight:500;transition:all .2s}.fm-cat-all-btn:hover{background:#c73c3c1f}.fm-cat-grid{grid-template-columns:repeat(8,1fr);gap:8px;display:grid}.fm-cat-cell{border-radius:var(--radius-md);cursor:pointer;background:var(--paper-50);border:1px solid var(--paper-200);flex-direction:column;justify-content:center;align-items:center;min-height:72px;padding:12px 4px;transition:all .25s;display:flex;position:relative}.fm-cat-cell:hover{box-shadow:var(--shadow-md);border-color:var(--gold-400);transform:translateY(-2px)}.fm-cat-cell.active{border-color:var(--gold-500);background:linear-gradient(135deg,#b8953a26,#b8953a0d);box-shadow:0 0 0 2px #b8953a26}.fm-cat-icon{margin-bottom:4px;font-size:22px}.fm-cat-label{color:var(--ink-700);white-space:nowrap;font-size:12px;font-weight:600}.fm-cat-count{color:var(--ink-300);margin-top:2px;font-size:10px}.fm-cat-cell.active .fm-cat-label{color:var(--gold-600)}.fm-uncat-bar{border-radius:var(--radius-sm);cursor:pointer;background:linear-gradient(90deg,#c9a96e0f,#c9a96e05);border:1px dashed #b8953a40;align-items:center;gap:10px;margin-top:10px;padding:10px 16px;transition:all .25s;display:flex}.fm-uncat-bar:hover{background:#8c847814;border-color:#8c847859}.fm-uncat-bar.active{border-color:var(--gold-500);background:#b8953a14;border-style:solid}.fm-uncat-icon{font-size:16px}.fm-uncat-text{color:var(--ink-500);flex:1;font-size:12px}.fm-uncat-text strong{color:var(--ink-700);font-weight:700}.fm-uncat-action{color:var(--gold-600);white-space:nowrap;font-size:11px;font-weight:600}.fm-dynasty-bar{flex-wrap:wrap;align-items:center;gap:8px;max-width:1100px;margin:0 auto 16px;padding:8px 24px;display:flex}.fm-dynasty-title{color:var(--ink-500);white-space:nowrap;margin-right:4px;font-size:12px;font-weight:600}.fm-dynasty-tag{cursor:pointer;color:var(--jade-600);white-space:nowrap;background:#2d8f7b0f;border:1px solid #2d8f7b26;border-radius:14px;padding:3px 10px;font-size:11px;transition:all .2s}.fm-dynasty-tag:hover{background:var(--jade-500);color:#fff;border-color:var(--jade-500)}.fm-dy-cnt{opacity:.6;font-size:10px}.fm-active-filters{flex-wrap:wrap;align-items:center;gap:6px;margin-top:10px;display:flex}.fm-filter-chip{color:var(--gold-600);background:#b8953a1a;border:1px solid #b8953a33;border-radius:14px;align-items:center;gap:4px;padding:3px 12px;font-size:11px;display:inline-flex}.fm-chip-x{cursor:pointer;opacity:.6;margin-left:2px;font-size:10px}.fm-chip-x:hover{opacity:1;color:var(--vermilion-500)}.fm-clear-all{color:var(--vermilion-500);cursor:pointer;background:#c73c3c0f;border-color:#c73c3c26}.fm-clear-all:hover{background:#c73c3c1f}.fm-footer{text-align:center;color:var(--vermilion-500);background:var(--paper-200);border-top:1px solid var(--paper-200);padding:24px;font-size:11px}@media (max-width:768px){.fm-grid{grid-template-columns:1fr}.fm-stats{flex-wrap:wrap;gap:16px}.fm-modal-header{padding:16px 20px 12px}.fm-modal-body{padding:16px 20px 20px}.fm-modal-name{font-size:20px}.fm-search{padding:6px 12px}.fm-search input{font-size:13px}.fm-header{padding:88px 16px 24px}.fm-grid-wrap{padding:0 16px 32px}.fm-cat-grid{grid-template-columns:repeat(4,1fr);gap:6px}.fm-cat-cell{min-height:60px;padding:8px 2px}.fm-cat-icon{font-size:18px}.fm-cat-label{font-size:11px}.fm-cat-nav{padding:0 16px}.fm-dynasty-bar{padding:8px 16px}}@media (max-width:767px){.fm-header{padding:76px 16px 20px}.fm-header h1{letter-spacing:1px;font-size:24px}.fm-header .subtitle{font-size:12px}.fm-stats{gap:12px;margin-top:10px}.fm-stat-num{font-size:20px}.fm-stat-label{font-size:10px}.fm-filter{padding:0 16px}.fm-search input{font-size:16px}.fm-tabs{scrollbar-width:none;flex-wrap:nowrap;justify-content:flex-start;padding-bottom:4px;overflow-x:auto}.fm-tabs::-webkit-scrollbar{display:none}.fm-tab{flex-shrink:0;font-size:11px}.fm-source-tabs{scrollbar-width:none;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto}.fm-source-tabs::-webkit-scrollbar{display:none}.fm-source-tab{flex-shrink:0}.fm-cat-grid{grid-template-columns:repeat(4,1fr);gap:6px}.fm-cat-cell{min-height:56px;padding:8px 2px}.fm-cat-icon{margin-bottom:2px;font-size:16px}.fm-cat-label{font-size:10px}.fm-cat-count{font-size:9px}.fm-cat-nav{padding:0 16px}.fm-dynasty-bar{scrollbar-width:none;flex-wrap:nowrap;padding:6px 16px;overflow-x:auto}.fm-dynasty-bar::-webkit-scrollbar{display:none}.fm-dynasty-tag{flex-shrink:0}.fm-grid-wrap{padding:0 16px 32px}.fm-grid{grid-template-columns:1fr;gap:10px}.fm-card{padding:14px}.fm-card:hover{transform:none}.fm-name{font-size:16px}.fm-comp{padding:6px 10px;font-size:11px}.fm-ind-tag{font-size:9px}.fm-modal{border-radius:16px 16px 0 0;max-width:100%;max-height:88vh;position:fixed;bottom:0;left:0;right:0}.fm-footer{padding:14px 16px;font-size:10px}}