/*! 世界历史沙盘 · © 2026 保留所有权利 All rights reserved.
 * 本文件为专有软件，未经书面许可不得复制、分发、修改或用于衍生作品。
 * 内容（疆域/朝代/事件/导览/词条）同受著作权保护。
 * build 20261101-55d755
 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;
border:1px solid var(--border);background:var(--panel2);color:var(--ink);
padding:8px 14px;border-radius:9px;font-size:var(--fs-body);font-weight:600;transition:.15s;font-family:inherit}
.btn:hover{border-color:#4a5c8c;background:#22305a}
.btn.primary{background:var(--accent);color:var(--on-accent,#241a02);border-color:var(--accent)}
.btn.primary:hover{filter:brightness(1.06)}
.btn.ghost{background:transparent}
.btn.big{width:100%;padding:12px;font-size:var(--fs-h2);margin:8px 0}
.btn:disabled{opacity:.45;cursor:default}
.mini{cursor:pointer;border:1px solid var(--line);background:var(--panel2);color:var(--ink);
padding:4px 9px;border-radius:7px;font-size:var(--fs-sm);font-weight:600;font-family:inherit;transition:.15s}
.mini:hover{border-color:#4a5c8c}
.mini.danger{color:#ff9b9b;border-color:#5a2c34}
.muted{color:var(--muted)}
.small{font-size:var(--fs-sm)}
.tag,.free-tag,.pro-tag{display:inline-block;font-size:var(--fs-xs);font-weight:700;padding:1px 7px;border-radius:20px;margin-left:6px;vertical-align:middle}
.tag{background:var(--accent);color:var(--on-accent,#241a02)}
.free-tag{background:#1d3a2a;color:#7fe0a8}
.pro-tag{background:#3a2f14;color:var(--accent)}
.chip{cursor:pointer;border:1px solid var(--line);background:var(--panel2);color:var(--ink);
padding:6px 10px;border-radius:20px;font-size:var(--fs-sm);font-family:inherit}
.chip:hover{border-color:var(--accent)}
.fld{display:flex;flex-direction:column;gap:4px;font-size:var(--fs-body);color:var(--muted);margin:8px 0}
.fld input{background:var(--panel);border:1px solid var(--line);border-radius:8px;color:var(--ink);padding:9px 11px;font-size:var(--fs-body);font-family:inherit}
.fld input:focus{outline:none;border-color:var(--accent)}
#featurebar{display:flex;flex-wrap:wrap;gap:5px;padding:2px 6px 6px;border-bottom:1px solid var(--line);margin-bottom:2px}
.feat-btn{display:inline-flex;align-items:center;gap:5px;cursor:pointer;border:1px solid var(--line);
background:var(--panel);color:var(--ink);padding:6px 9px;border-radius:8px;font-size:var(--fs-sm);font-weight:600;
position:relative;font-family:inherit;transition:.15s}
.feat-btn:hover{border-color:var(--accent);background:var(--panel2)}
.feat-btn .fi{font-size:var(--fs-body)}
.feat-btn .pro-dot{color:var(--accent);font-size:var(--fs-xs);position:absolute;top:2px;right:3px}
#acctbar{display:flex;justify-content:center;padding:8px 6px 4px;border-bottom:1px solid var(--line);margin-bottom:4px}
.feat-btn.acct{background:var(--panel2);padding:8px 22px}
#tabbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:55;
background:rgba(11,16,32,.96);backdrop-filter:blur(8px);border-top:1px solid var(--line);
justify-content:space-around;padding:4px 2px calc(4px + env(safe-area-inset-bottom))}
.tab-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:none;
color:var(--muted);font-size:var(--fs-xs);padding:5px 0;font-family:inherit;cursor:pointer}
.tab-btn .ti{font-size:var(--fs-h1)}
.tab-btn:active{color:var(--accent)}
#panel-root{position:fixed;inset:0;z-index:70;pointer-events:none}
#panel-root.open{pointer-events:auto}
.panel-backdrop{position:absolute;inset:0;background:rgba(3,6,15,.55);opacity:0;transition:.25s}
#panel-root.open .panel-backdrop{opacity:1}
.panel{position:absolute;top:0;right:0;bottom:0;width:420px;max-width:92vw;background:var(--bg);
border-left:1px solid var(--line);box-shadow:-16px 0 48px rgba(0,0,0,.5);
transform:translateX(100%);transition:transform .28s cubic-bezier(.3,.8,.3,1);display:flex;flex-direction:column}
.panel.wide{width:640px}
#panel-root.open .panel{transform:none}
.panel header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--line);flex:0 0 auto}
.panel header h2{margin:0;font-size:var(--fs-h2)}
.panel-close{background:none;border:none;color:var(--muted);font-size:var(--fs-h1);cursor:pointer;padding:2px 6px}
.panel-close:hover{color:var(--ink)}
.panel-body{padding:14px 16px;overflow-y:auto;flex:1 1 auto}
.panel-body::-webkit-scrollbar{width:8px}
.panel-body::-webkit-scrollbar-thumb{background:#2c3a60;border-radius:4px}
#toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%,20px);z-index:90;
background:#182240;border:1px solid var(--border);color:var(--ink);padding:10px 18px;border-radius:24px;
font-size:var(--fs-body);font-weight:600;opacity:0;pointer-events:none;transition:.25s;box-shadow:0 8px 30px rgba(0,0,0,.4)}
#toast.show{opacity:1;transform:translate(-50%,0)}
#onb{position:fixed;inset:0;z-index:95}
.onb-mask{position:absolute;inset:0;background:rgba(3,6,15,.55)}
.onb-hole{position:absolute;border:2px solid var(--accent);border-radius:10px;
box-shadow:0 0 0 9999px rgba(3,6,15,.68);transition:.25s;pointer-events:none}
.onb-tip{position:absolute;width:300px;background:var(--panel);border:1px solid var(--border);
border-radius:12px;padding:14px;box-shadow:0 12px 40px rgba(0,0,0,.5)}
.onb-tip .onb-t{font-weight:800;font-size:var(--fs-h2);margin-bottom:5px}
.onb-tip .onb-d{color:var(--muted);font-size:var(--fs-body);line-height:1.5}
.onb-bar{display:flex;align-items:center;justify-content:space-between;margin-top:12px}
.onb-idx{color:var(--muted);font-size:var(--fs-sm)}
.onb-btns{display:flex;gap:6px}
.acct-card{text-align:center;padding:10px 0 4px}
.acct-ava{font-size:46px}
.acct-name{font-weight:800;font-size:var(--fs-h1);margin-top:4px}
.acct-sub{color:var(--muted);font-size:var(--fs-body)}
.acct-badge{display:inline-block;margin-top:8px;padding:3px 12px;border-radius:20px;background:var(--panel2);border:1px solid var(--line);font-size:var(--fs-sm)}
.acct-badge.pro{background:#3a2f14;color:var(--accent);border-color:var(--accent)}
.oauth{display:flex;gap:8px;margin-top:8px}
.oauth .btn{flex:1}
.pw-hook{background:#3a2f14;color:var(--accent);border-radius:9px;padding:9px 12px;font-weight:700;margin-bottom:10px}
.pw-feats{list-style:none;padding:0;margin:0 0 14px;display:grid;grid-template-columns:1fr 1fr;gap:6px}
.pw-feats li{font-size:var(--fs-sm);color:#cfe}
.plans{display:flex;gap:8px;margin-bottom:8px}
.pw-ch{display:flex;gap:8px;margin:0 0 10px}
.pw-ch .ch{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;
padding:9px 10px;border:1px solid var(--line);border-radius:9px;background:var(--panel2);
cursor:pointer;font-size:var(--fs-sm);font-weight:600;transition:.16s}
.pw-ch .ch input{position:absolute;opacity:0;pointer-events:none}
.pw-ch .ch:hover{border-color:var(--line2)}
.pw-ch .ch.on{border-color:var(--accent);background:#3a2f14;color:var(--accent)}
.qr-wrap{display:flex;flex-direction:column;align-items:center;gap:8px;
padding:16px 12px;background:var(--panel2);border:1px solid var(--line);border-radius:10px;margin-bottom:10px}
.qr-img{width:220px;height:220px;background:#fff;padding:8px;border-radius:8px;display:block}
.qr-tip{margin:0;font-size:var(--fs-body);font-weight:600}
.qr-tip b{color:var(--accent)}
.qr-cd{margin:0}
.qr-cd b{font-variant-numeric:tabular-nums;color:var(--accent)}
.plan{flex:1;position:relative;border:2px solid var(--line);border-radius:11px;padding:11px 9px;cursor:pointer;text-align:center;transition:.15s}
.plan:hover{border-color:#4a5c8c}
.plan.best{border-color:var(--line)}
.plan input{position:absolute;opacity:0;pointer-events:none}
.plan:focus-within{outline:2px solid var(--accent);outline-offset:2px}
.plan.sel{border-color:var(--accent);background:#3a2f14;box-shadow:0 0 0 3px rgba(255,204,92,.15)}
.plan.sel .pp{color:var(--accent)}
.plan.sel::after{content:'✓';position:absolute;top:7px;left:9px;width:18px;height:18px;
line-height:18px;text-align:center;border-radius:50%;
background:var(--accent);color:var(--on-accent,#241a02);font-size:12px;font-weight:900}
.pw-ch1{margin:10px 0 2px;text-align:center;font-size:var(--fs-sm);color:var(--muted)}
.pw-ch1 b{color:var(--ink);font-weight:700}
.plan-h b{font-size:var(--fs-body)}
.plan-h .tag{position:absolute;top:-9px;right:8px}
.plan-p{margin:6px 0 2px}
.plan-p .pp{font-size:22px;font-weight:800}
.plan-p .pu{font-size:var(--fs-sm);color:var(--muted)}
.pw-alt{display:flex;gap:8px;margin-top:8px}
.pw-alt .btn{flex:1}
.share-card{background:radial-gradient(120% 120% at 50% -10%,#1a2a55 0%,#0b1020 100%);border:1px solid var(--border);
border-radius:14px;padding:22px;text-align:center;margin-bottom:12px}
.share-yr{font-size:40px;font-weight:800}
.share-yr small{font-size:var(--fs-h2);color:var(--muted);margin-left:6px}
.share-era{color:var(--accent);font-weight:600;margin-top:4px}
.share-url{display:flex;gap:6px;margin:10px 0}
.share-url input{flex:1;background:var(--panel);border:1px solid var(--line);border-radius:8px;color:var(--ink);padding:9px 11px;font-size:var(--fs-sm)}
.share-more{display:flex;gap:8px}.share-more .btn{flex:1}
.bm-list{margin-top:10px;display:flex;flex-direction:column;gap:8px}
.bm{display:flex;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px}
.bm-yr{font-weight:800;color:var(--accent);min-width:56px}
.bm-main{flex:1}
.bm-era{font-size:var(--fs-body);margin-bottom:4px}
.bm-note{width:100%;min-height:34px;resize:vertical;background:var(--panel2);border:1px solid var(--line);border-radius:7px;color:var(--ink);padding:6px 8px;font-size:var(--fs-sm);font-family:inherit}
.bm-act{display:flex;flex-direction:column;gap:4px}
.cmp-head{position:sticky;top:-14px;background:var(--bg);padding:6px 0 10px;z-index:2;border-bottom:1px solid var(--line);margin-bottom:10px}
.cmp-yrbox{font-size:var(--fs-h1);font-weight:800;margin-bottom:6px}
.cmp-yrbox em{color:var(--accent);font-size:var(--fs-body);font-style:normal;font-weight:600;margin-left:6px}
#cmp-slider{width:100%}
.cmp-jump{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.cmp-group{margin-bottom:14px}
.cmp-group h3{font-size:var(--fs-body);color:var(--muted);margin:0 0 7px;border-left:3px solid var(--accent);padding-left:8px}
.cmp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.cmp-card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px;cursor:pointer;transition:.15s}
.cmp-card:hover{border-color:var(--accent)}
.cmp-reg{font-weight:800;font-size:var(--fs-body)}
.cmp-pol{font-size:var(--fs-sm);color:#bcd;margin-top:2px}
.cmp-ruler{font-size:var(--fs-sm);color:var(--accent);margin-top:3px}
.cmp-ev{list-style:none;padding:0;margin:6px 0 0;font-size:var(--fs-xs);color:var(--muted)}
.cmp-ev li{margin-top:2px}
.cmp-ev b{color:#cdd}
.tour-list{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.tour-card{display:flex;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px;cursor:pointer;transition:.15s}
.tour-card:hover{border-color:var(--accent);transform:translateY(-1px)}
.tour-emoji{font-size:30px}
.tour-title{font-weight:800;font-size:var(--fs-h2)}
.tour-desc{font-size:var(--fs-sm);margin:3px 0;line-height:1.5}
#tourplayer{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);z-index:65;width:min(680px,94vw);
background:rgba(15,22,44,.97);backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:14px;
box-shadow:0 16px 50px rgba(0,0,0,.55);overflow:hidden}
.tp-top{display:flex;justify-content:space-between;align-items:center;padding:9px 14px;border-bottom:1px solid var(--line);font-weight:700}
.tp-top button{background:none;border:none;color:var(--muted);font-size:var(--fs-h2);cursor:pointer}
.tp-body{padding:12px 16px}
#tp-step{font-size:var(--fs-body);margin-bottom:5px}
#tp-step .tp-yr{color:var(--accent);font-weight:800;margin-right:6px}
#tp-text{font-size:var(--fs-body);color:#cfd6ea;line-height:1.6}
.tp-ctrl{display:flex;align-items:center;gap:8px;padding:10px 14px;border-top:1px solid var(--line)}
.tp-ctrl #tp-dots{flex:1;display:flex;gap:4px;justify-content:center}
#tp-dots i{width:7px;height:7px;border-radius:50%;background:var(--line)}
#tp-dots i.on{background:var(--accent)}
.quiz-stat{display:flex;gap:8px;margin-bottom:12px}
.quiz-stat>div{flex:1;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:12px;text-align:center}
.quiz-stat b{display:block;font-size:22px;color:var(--accent)}
.quiz-stat span{font-size:var(--fs-xs);color:var(--muted)}
.q-progress{height:5px;background:var(--panel2);border-radius:3px;overflow:hidden;margin-bottom:12px}
.q-progress i{display:block;height:100%;background:var(--accent);transition:.3s}
.q-q{font-size:var(--fs-h2);font-weight:700;line-height:1.5;margin-bottom:14px}
.q-opts{display:flex;flex-direction:column;gap:8px}
.q-opt{text-align:left;padding:12px 14px;border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:10px;cursor:pointer;font-size:var(--fs-body);font-family:inherit;transition:.12s}
.q-opt:hover:not(:disabled){border-color:var(--accent)}
.q-opt.right{border-color:#3ea36a;background:#173626}
.q-opt.wrong{border-color:#a3434a;background:#331a1e}
.q-exp{margin:12px 0;padding:12px;border-radius:10px;font-weight:700}
.q-exp.ok{background:#153020}.q-exp.no{background:#301a1e}
.q-exp p{font-weight:400;color:#cdd;font-size:var(--fs-body);margin:6px 0 8px;line-height:1.5}
.quiz-result{text-align:center;padding:16px 0}
.qr-score{font-size:44px;font-weight:800;color:var(--accent)}
.qr-pct{color:var(--muted);margin:4px 0}
.qr-msg{font-size:var(--fs-h2);margin-top:8px}
.wiki-regions{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px;margin-top:8px}
.wiki-r{display:flex;flex-direction:column;gap:2px;align-items:flex-start;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 12px;cursor:pointer;color:var(--ink);font-weight:700;font-family:inherit}
.wiki-r:hover{border-color:var(--accent)}
.wiki-periods{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.wiki-p{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:9px;padding:10px 12px;cursor:pointer;color:var(--ink);font-family:inherit}
.wiki-p:hover{border-color:var(--accent)}
.wiki-yr{color:var(--accent);font-weight:700;font-size:var(--fs-sm);min-width:96px}
.wiki-page h2{margin:10px 0 2px}
.wiki-sub{font-size:var(--fs-sm);margin-bottom:10px}
.wiki-lead{font-size:var(--fs-body);line-height:1.6;color:#cfd6ea}
.wiki-key{background:var(--panel2);border-radius:8px;padding:8px 12px;margin:8px 0}
.wiki-page h3{font-size:var(--fs-body);color:var(--muted);border-left:3px solid var(--accent);padding-left:8px;margin:16px 0 8px}
.wiki-rulers{margin:0;padding-left:18px;font-size:var(--fs-body);line-height:1.7}
.wiki-ev{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}
.wiki-ev li{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:var(--fs-body);cursor:pointer}
.wiki-ev li:hover{border-color:var(--accent)}
.wiki-ev li b{color:var(--accent);margin-right:6px}
.wiki-ev li span{display:block;color:var(--muted);font-size:var(--fs-xs);margin-top:2px}
.wiki-fade{margin-top:8px;padding:10px;text-align:center;color:var(--muted);font-size:var(--fs-sm);background:linear-gradient(transparent,var(--panel2));border-radius:8px}
.les-list{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.les{display:flex;justify-content:space-between;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 12px;flex-wrap:wrap}
.les-act{display:flex;gap:5px;flex-wrap:wrap}
.les-steps{display:flex;flex-direction:column;gap:6px;margin:10px 0}
.les-step{display:flex;gap:6px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:7px 9px}
.les-yr{color:var(--accent);font-weight:700;font-size:var(--fs-sm);min-width:50px}
.les-note{flex:1;background:var(--panel2);border:1px solid var(--line);border-radius:6px;color:var(--ink);padding:5px 8px;font-size:var(--fs-sm);font-family:inherit}
.les-foot{display:flex;gap:8px}.les-foot .btn{flex:1}
#classbar{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);z-index:65;width:min(640px,94vw);display:flex;align-items:center;gap:10px;
background:rgba(15,22,44,.97);backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:14px;padding:10px 14px;box-shadow:0 16px 50px rgba(0,0,0,.5)}
.cb-mid{flex:1}
#cb-title{font-size:var(--fs-body);font-weight:700}#cb-title b{color:var(--accent)}
#cb-note{font-size:var(--fs-sm);color:var(--muted);margin-top:2px}
#classbar #cb-close{background:none;border:none;color:var(--muted);font-size:var(--fs-h2);cursor:pointer}
.ai-out{height:min(46vh,340px);overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:4px 2px;margin-bottom:8px}
.ai-msg{max-width:88%;padding:9px 12px;border-radius:12px;font-size:var(--fs-body);line-height:1.6}
.ai-msg.you{align-self:flex-end;background:var(--accent);color:var(--on-accent,#241a02);font-weight:600}
.ai-msg.bot{align-self:flex-start;background:var(--panel);border:1px solid var(--line)}
.ai-msg.loading{color:var(--muted)}
.ai-sug{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.ai-in{display:flex;gap:6px}
.ai-in input{flex:1;background:var(--panel);border:1px solid var(--line);border-radius:9px;color:var(--ink);padding:10px 12px;font-size:var(--fs-body);font-family:inherit}
.ai-in input:focus{outline:none;border-color:var(--accent)}
#sidetoggle{display:none;position:fixed;left:12px;top:12px;z-index:50;width:42px;height:42px;border-radius:11px;
background:rgba(20,27,48,.9);backdrop-filter:blur(6px);border:1px solid var(--border);color:var(--ink);font-size:var(--fs-h1);cursor:pointer}
#mobilebrief{ display:none; }
@media (max-width:1023px){
html, body{
overflow:auto;
height:auto; min-height:100%;
overscroll-behavior-x:none;
}
#app{
display:flex !important; flex-direction:column;
height:auto !important; min-height:100vh; min-height:100dvh;
gap:0 !important; padding:0 !important;
padding-bottom:var(--dock-h, 190px) !important;
}
#map-wrap  { order:1; }
#mobilebrief{ order:2; }
#side      { order:3; }
#controls  { order:4; }
#map-wrap{
border-radius:0 !important; border-left:none; border-right:none;
display:flex; flex-direction:column; flex:0 0 auto;
}
#mobilebrief{ flex:0 0 auto; }
#side{ flex:0 0 auto; }
#map-wrap svg#map{ flex:0 0 auto !important; height:52vw; max-height:44vh; min-height:150px; }
#side{
position:static !important; transform:none !important;
width:auto !important; max-width:none !important;
box-shadow:none !important; border-right:none !important;
border-top:1px solid var(--line);
padding:8px 10px 14px !important;
overflow:visible !important;
height:auto !important; min-height:0;
display:flex; flex-direction:column; gap:0;
}
#side > h1{ display:none; }
#sidetoggle{ display:none !important; }
#tabbar{ display:none !important; }
#segbar{ display:flex !important; }
#slicehost{ display:flex; overflow:visible; flex:0 0 auto; }
#regions{ overflow:visible; flex:0 0 auto; }
#featurebar{ flex-wrap:wrap; }
#moregrid{ grid-template-columns:repeat(4,1fr); }
#yearbadge{ position:static; padding:8px 12px 0; display:flex;
align-items:baseline; gap:10px; flex-wrap:wrap; }
#yearbadge .yr{ font-size:34px; }
#yearbadge .era{ margin-top:0; }
#focusbar{ position:static; margin:6px 0 4px; padding:0 10px 4px;
max-width:none !important; flex-wrap:nowrap; overflow-x:auto;
justify-content:flex-start; -webkit-overflow-scrolling:touch; scrollbar-width:none;
overscroll-behavior-x:contain;
-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);
mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent); }
#focusbar::-webkit-scrollbar{ height:0; }
.panel{ width:100%; max-width:100%; border-left:none; border-top:1px solid var(--line);
top:auto; height:88vh; height:88dvh; border-radius:16px 16px 0 0; transform:translateY(100%); }
.panel.wide{ width:100%; }
#panel-root.open .panel{ transform:none; }
#tourplayer,#classbar{ bottom:calc(var(--dock-h, 190px) + 10px); width:96vw; }
.pw-feats{ grid-template-columns:1fr; }
.plans{ flex-direction:column; }
.cmp-grid{ grid-template-columns:1fr 1fr; }
.kw-grid{ grid-template-columns:1fr; }
.cmdk-box{ margin-top:5vh; }
#mobilebrief{
display:block; padding:6px 10px; border-top:1px solid var(--line);
background:rgba(9,13,28,.6);
}
#mobilebrief #event{
position:static !important; transform:none !important; opacity:1 !important;
right:auto; bottom:auto; max-width:none !important;
margin:0; border-radius:12px; display:block;
max-height:none; overflow:visible;
}
#mobilebrief #event.stale{ opacity:.6 !important; filter:saturate(.7); }
#mobilebrief #event .ed{ max-height:none; }
#mobilebrief .mb-empty{
display:none; padding:10px 12px; border-radius:12px;
background:var(--panel); border:1px dashed var(--line);
color:var(--muted); font-size:var(--fs-sm);
}
#mobilebrief.empty #event{ display:none; }
#mobilebrief.empty .mb-empty{ display:block; }
#controls{
position:fixed !important; left:0; right:0; bottom:0; z-index:55;
background:rgba(11,16,32,.97); backdrop-filter:blur(8px);
border:none; border-top:1px solid var(--line); border-radius:0;
padding:5px 10px calc(4px + env(safe-area-inset-bottom)); gap:2px;
}
#controls .ctrow{ gap:6px; row-gap:4px; }
#controls .speed{ gap:3px; }
.hint{ display:none; }
#controls #legal-line{ display:none; }
#side #legal-line{ display:flex; padding-top:10px; font-size:var(--fs-micro); }
button.play{ min-width:84px; padding:0 14px; min-height:44px; }
#controls .ctrow > button{ min-height:44px; }
.speed button{ padding:0 12px; min-height:44px; }
#track input{ height:44px; top:0; }
#track input::-webkit-slider-thumb{ width:26px; height:26px; border-radius:50%; }
#track{ height:44px; margin-top:2px; }
#track .axis,#track .fill{ top:18px; }
#track .zero{ top:12px; }
.ticks{ top:30px; }
}
@media (max-width: 420px){ .cmp-grid{grid-template-columns:1fr} }
.quiz-modes{margin-bottom:10px}
.qm-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:6px 0}
.qm-label{color:var(--muted);font-size:var(--fs-sm);min-width:32px}
.chip.on{background:var(--accent);color:var(--on-accent,#241a02);border-color:var(--accent)}
.q-tags{display:flex;gap:6px;margin-bottom:8px}
.tag2{font-size:var(--fs-xs);background:var(--panel2);border:1px solid var(--line);border-radius:20px;padding:2px 9px;color:var(--muted)}
.switch-row{display:flex;align-items:center;justify-content:space-between;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:11px 13px;margin:6px 0;font-size:var(--fs-body)}
.switch-row input{width:40px;height:22px}
.cat-chips{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0}
.catchip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:20px;padding:6px 12px;font-size:var(--fs-body);cursor:pointer;font-family:inherit}
.catchip i{width:10px;height:10px;border-radius:50%;background:var(--cc)}
.catchip.on{color:var(--ink);border-color:var(--cc);background:color-mix(in srgb, var(--cc) 16%, transparent)}
.fl-list{margin-top:6px;display:flex;flex-direction:column;gap:4px}
.fl-count{margin:4px 0}
.fl-row{display:flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:var(--fs-body);cursor:pointer}
.fl-row:hover{border-color:var(--accent)}
.fl-row b{color:var(--accent)}
.fl-dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto}
.fl-cat{margin-left:auto;font-size:var(--fs-xs);color:var(--muted)}
#evlayer{position:absolute;left:0;right:0;top:-6px;height:12px;pointer-events:none;z-index:3}
#evlayer .evdot{position:absolute;width:8px;height:8px;border-radius:50%;transform:translateX(-50%);
box-shadow:0 0 6px rgba(0,0,0,.6);pointer-events:auto;cursor:pointer;border:1px solid rgba(0,0,0,.4)}
#evlayer .evdot:hover{width:12px;height:12px}
.prog-top{margin-bottom:12px}
.prog-streak{background:linear-gradient(160deg,#3a2f14,#1b2440);border:1px solid var(--border);border-radius:14px;padding:18px;text-align:center}
.ps-num{font-size:34px;font-weight:800;color:var(--accent)}
.prog-bars{display:flex;flex-direction:column;gap:10px;margin:12px 0}
.pbar-l{display:flex;justify-content:space-between;font-size:var(--fs-body);margin-bottom:4px}
.pbar-t{height:8px;background:var(--panel2);border-radius:5px;overflow:hidden}
.pbar-t i{display:block;height:100%;background:var(--accent)}
.prog-h{font-size:var(--fs-body);margin:14px 0 8px}
.badge-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.badge{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 8px;text-align:center;opacity:.42;filter:grayscale(1)}
.badge.got{opacity:1;filter:none;border-color:var(--accent)}
.badge-ic{font-size:28px}
.badge-n{font-size:var(--fs-sm);font-weight:700;margin-top:4px}
.badge-d{margin-top:2px;line-height:1.3}
.sc-preview{width:100%;border-radius:12px;border:1px solid var(--line)}
.sc-act{display:flex;gap:8px;margin:10px 0}
.sc-act .btn{flex:1}
.set-group{margin:10px 0}
.set-label{font-size:var(--fs-body);color:var(--muted);margin-bottom:6px}
.segwrap{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.segwrap button{background:var(--panel);color:var(--ink);border:none;border-right:1px solid var(--line);padding:9px 14px;font-size:var(--fs-body);cursor:pointer;font-family:inherit}
.segwrap button:last-child{border-right:none}
.segwrap button.on{background:var(--accent);color:var(--on-accent,#241a02)}
.look-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}
.look-opt{display:flex;flex-direction:column;align-items:stretch;gap:3px;padding:6px;border:1px solid var(--line);border-radius:10px;
background:var(--panel);color:var(--ink);cursor:pointer;font-family:inherit;text-align:left;min-height:44px}
.look-opt img{width:100%;height:auto;aspect-ratio:2/1;border-radius:6px;display:block;background:var(--ocean)}
.look-opt b{font-size:var(--fs-body);font-weight:600;margin-top:2px}
.look-opt span{font-size:var(--fs-sm);color:var(--muted);line-height:1.35}
.look-def{font-style:normal;font-size:var(--fs-xs);font-weight:600;color:var(--accent);border:1px solid var(--accent);border-radius:6px;padding:0 5px;margin-left:6px;vertical-align:1px}
.look-opt.on{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent) inset}
html[data-fs="s"] .panel-body{font-size:var(--fs-body)}
html[data-fs="l"] .panel-body{font-size:var(--fs-h2)}
html[data-fs="xl"] .panel-body{font-size:var(--fs-h1)}
html[data-fs="l"] .q-q,html[data-fs="xl"] .q-q{font-size:var(--fs-h1)}
html[data-fs="l"] .feat-btn,html[data-fs="xl"] .feat-btn{font-size:var(--fs-body)}
html.high-contrast{--muted:#c4cee6;--line:#5a6a92}
html.high-contrast .btn,html.high-contrast .feat-btn,html.high-contrast .card{border-width:2px}
html[data-theme="light"]{
--muted:#5b678a; --line:#d6ddec; --accent:#b5790a; --ocean:#ccdcf2; --land:#b9c8e2;
--border:#9fb0d0; --split:#e6e0f2; --river:#3f7fc2; --river-lbl:#1d5a9c; --river-halo:#fff;
}
html[data-theme="light"] body{background:var(--bg);color:var(--ink)}
html[data-theme="light"] #map-wrap{background:radial-gradient(130% 120% at 50% -10%,#dbe6f7 0%,#eef2fa 100%)}
html[data-theme="light"] .node .pow,html[data-theme="light"] .frag .sn{fill:#10203f;stroke:#fff}
html[data-theme="light"] .node .king,html[data-theme="light"] .node .reg{stroke:#fff}
html[data-theme="light"] .node .reg{fill:#34436b}
html[data-theme="light"] .node .king{fill:#8f5a00}
html[data-theme="light"] #toast{background:#fff;color:var(--ink)}
html[data-theme="light"] .btn.primary,html[data-theme="light"] .segwrap button.on,html[data-theme="light"] .chip.on{color:#fff}
html[data-theme="light"] .badge.got{box-shadow:none}
html[data-theme="light"] .plan.sel{box-shadow:0 0 0 3px rgba(181,121,10,.22)}
html[data-theme="light"] .plan.sel::after{color:#fff}
.wiki-intro{font-size:var(--fs-h2);line-height:1.7;color:#dbe3f4;background:var(--panel);border-left:3px solid var(--accent);border-radius:0 8px 8px 0;padding:10px 14px;margin:6px 0 4px}
.wiki-body p{font-size:var(--fs-body);line-height:1.75;color:#cfd6ea;margin:8px 0}
.wiki-body.clip{max-height:120px;overflow:hidden;-webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}
.wiki-sig{background:#22305a;border-radius:8px;padding:10px 13px;font-size:var(--fs-body);line-height:1.6;margin:10px 0}
.wiki-figs{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}
.wiki-figs li{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:8px 11px;font-size:var(--fs-body)}
.wiki-figs li b{color:var(--accent)}
.wiki-p .wiki-badge{margin-left:6px;font-size:var(--fs-xs);color:var(--accent)}
#event{max-width:380px !important;max-height:48vh}
#event .ed{max-height:40vh;overflow-y:auto}
#event .ed b{color:#2a1e02}
#tourpath .tour-route{ animation:routeFlow 1s linear infinite; }
@keyframes routeFlow{ to{ stroke-dashoffset:-18; } }
#tourpath .tour-pulse{ transform-box:fill-box; transform-origin:center; animation:routePulse 1.6s ease-out infinite; }
@keyframes routePulse{ 0%{ r:1; opacity:.9; } 100%{ r:4.5; opacity:0; } }
#warlist{display:flex;flex-direction:column;gap:6px}
.war-search input{width:100%;box-sizing:border-box;background:var(--panel2);border:1px solid var(--line);border-radius:8px;color:var(--ink);padding:8px 10px;font-size:var(--fs-sm);font-family:inherit}
.wchips{display:flex;flex-wrap:wrap;gap:4px;padding:0 2px}
.wchip{border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:20px;padding:4px 10px;font-size:var(--fs-xs);cursor:pointer;font-family:inherit}
.wchip.on{background:var(--accent);color:var(--on-accent,#241a02);border-color:var(--accent)}
.war-count{padding:0 6px}
.warcards{display:flex;flex-direction:column;gap:6px;padding:2px 0 8px}
.warcard{display:flex;gap:9px;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:9px 10px;cursor:pointer;transition:.15s;
width:100%;text-align:left;font-family:inherit;font-size:inherit;color:inherit;appearance:none;-webkit-appearance:none}
.warcard:hover{border-color:var(--accent);transform:translateY(-1px)}
.wc-emoji{font-size:22px}
.wc-name{font-weight:800;font-size:var(--fs-body)}
.wc-year{color:var(--accent);font-weight:700;font-size:var(--fs-sm);margin-left:4px}
.wc-vs{font-size:var(--fs-xs);margin:2px 0}
.wc-vs em{color:var(--muted);font-style:normal;font-size:var(--fs-xs);margin:0 2px}
.wc-place{font-size:var(--fs-xs)}
#warlayer .war-pulse{transform-box:fill-box;transform-origin:center;animation:warPulse 1.6s ease-out infinite}
@keyframes warPulse{0%{r:1;opacity:.9}100%{r:5;opacity:0}}
#warlayer .war-arrow-active{animation:warFlow 1s linear infinite}
@keyframes warFlow{to{stroke-dashoffset:-16}}
#wardossier{display:flex;flex-direction:column;gap:8px}
.wd-back{align-self:flex-start}
.wd-sim{width:100%;min-height:44px;font-size:16px;font-weight:700;letter-spacing:.06em;background:linear-gradient(#c49b57,#9a7638)!important;color:#2a1a0d!important;border:1px solid #e0c387!important;border-radius:8px;cursor:pointer;margin:2px 0 6px}
.wd-sim:hover{filter:brightness(1.06)}
.wd-sim:focus-visible{outline:2px solid #e0c387;outline-offset:2px}
.wd-body{display:flex;flex-direction:column}
.wd-meta{font-size:var(--fs-sm);color:var(--muted);margin-bottom:10px}
.wd-meta .wd-year{color:var(--accent);font-weight:700}
.wd-group{background:var(--panel2);border-radius:20px;padding:1px 8px;margin-left:4px;font-size:var(--fs-xs)}
.wd-sides{display:flex;align-items:stretch;gap:6px;margin-bottom:10px}
.wd-side{flex:1;background:var(--panel);border:1px solid var(--line);border-left-width:3px;border-radius:9px;padding:9px}
.wd-sname{font-weight:800;font-size:var(--fs-body);margin-bottom:4px}
.wd-cmd{font-size:var(--fs-sm);margin-bottom:2px}
.wd-force{font-size:var(--fs-xs);line-height:1.4}
.wd-vs{align-self:center;font-weight:800;color:var(--muted);font-size:var(--fs-sm)}
.wd-result{background:var(--panel);border-radius:9px;padding:10px;margin-bottom:8px}
.wd-victor{font-size:var(--fs-body);margin-bottom:4px}.wd-victor b{color:var(--accent)}
.wd-line{font-size:var(--fs-sm);line-height:1.5;margin-top:3px}
.wd-terr{background:#22305a;border-radius:8px;padding:8px 11px;font-size:var(--fs-sm);line-height:1.5;margin-bottom:8px}
.wd-body h4{font-size:var(--fs-body);margin:12px 0 6px;border-left:3px solid var(--accent);padding-left:8px}
.wd-p{font-size:var(--fs-sm);line-height:1.6;color:#cfd6ea}
.wd-phases{display:flex;flex-direction:column;gap:5px}
.wd-phase{display:flex;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:7px 9px;cursor:pointer;transition:.12s}
.wd-phase:hover{border-color:#4a5c8c}
.wd-phase.on{border-color:var(--accent);background:#1c2540}
.wd-pt{color:var(--accent);font-weight:700;font-size:var(--fs-sm);min-width:48px;flex:0 0 auto}
.wd-pd{font-size:var(--fs-sm);line-height:1.4}
.wd-ctrl{display:flex;gap:8px;margin:10px 0}.wd-ctrl .btn{flex:1}
.wd-sig{background:#3a2f14;color:#ffe0a0;border-radius:8px;padding:9px 12px;font-size:var(--fs-sm);line-height:1.5}
#warlayer .war-horse{filter:drop-shadow(0 .35px .7px rgba(0,0,0,.85))}
#warlayer .war-halo{animation:warHalo 1.9s ease-out infinite}
@keyframes warHalo{0%{r:1.2;opacity:.55}70%{opacity:.12}100%{r:4.8;opacity:0}}
#featurebar{display:flex;gap:6px;margin:2px 2px 0;flex-shrink:0}
#featurebar .primary-tool{flex:1 1 0;min-width:0;flex-direction:column;align-items:center;justify-content:center;
gap:4px;padding:9px 4px;position:relative;
background:linear-gradient(180deg,#22305a,#1a2444);border-color:#39497a;font-size:var(--fs-body)}
#featurebar .primary-tool:hover{background:#2a3a68;border-color:var(--accent)}
#featurebar .primary-tool .fi{font-size:18px;line-height:1}
#featurebar .primary-tool .fl{font-weight:800;font-size:var(--fs-sm);white-space:nowrap}
#featurebar .primary-tool .tool-badge{position:absolute;top:4px;right:5px;margin:0}
.tool-badge{background:var(--accent);color:var(--on-accent,#241a02);font-size:var(--fs-micro);font-weight:800;
border-radius:20px;padding:1px 6px;margin-left:6px;line-height:1.4}
#iconbar{display:flex;gap:6px;margin:6px 2px 0;flex-shrink:0}
#iconbar .icon-tool{flex:1;justify-content:center;padding:8px 0;font-size:var(--fs-h2);
background:var(--panel);border-color:var(--line)}
#iconbar .icon-tool:hover{background:#22305a;border-color:var(--accent)}
#iconbar .icon-tool .fi{font-size:17px;line-height:1}
#morewrap{margin:6px 2px 0;flex-shrink:0}
#morebtn{width:100%;justify-content:center;padding:6px;font-size:var(--fs-sm);
color:var(--muted);background:transparent;border-style:dashed}
#morebtn:hover{color:var(--ink);border-color:#3a4a78}
#moregrid{display:none;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:6px}
#morewrap.open #moregrid{display:grid}
#moregrid .more-tool{flex-direction:column;gap:3px;padding:8px 4px;font-size:var(--fs-xs);
background:var(--panel);border-color:var(--line);text-align:center;line-height:1.2}
#moregrid .more-tool .fi{font-size:16px}
#moregrid .more-tool .fl{font-size:var(--fs-xs);white-space:nowrap}
#acctbar{display:flex;justify-content:center;margin:8px 2px 2px;flex-shrink:0}
#segbar{display:flex;gap:0;margin:10px 2px 6px;flex-shrink:0;
background:var(--panel2);border:1px solid var(--line);border-radius:9px;padding:3px}
#segbar button{flex:1;background:transparent;border:none;padding:6px 4px;border-radius:7px;
font-size:var(--fs-sm);font-weight:800;color:var(--muted)}
#segbar button.on{background:var(--accent);color:var(--on-accent,#241a02)}
#segbar button:hover:not(.on){color:var(--ink);background:rgba(255,255,255,.05)}
#slicehost{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding-right:4px}
#slicehost::-webkit-scrollbar{width:7px}
#slicehost::-webkit-scrollbar-thumb{background:#2c3a60;border-radius:4px}
.sl-head{display:flex;align-items:center;justify-content:space-between;gap:8px;
position:sticky;top:0;background:var(--bg);padding:2px 0 6px;z-index:2}
.sl-yr b{font-size:var(--fs-h2);color:var(--accent);font-weight:800}
.sl-yr em{font-size:var(--fs-xs);color:var(--muted);font-style:normal;margin-left:6px}
.sl-cmp{font-size:var(--fs-xs);padding:4px 8px;white-space:nowrap}
.sl-cmp.on{background:var(--accent);color:var(--on-accent,#241a02);border-color:var(--accent)}
.sl-cmpbar{display:flex;align-items:center;gap:7px;font-size:var(--fs-xs);color:var(--muted);
background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:5px 8px}
.sl-cmpbar input{flex:1;min-width:0}
.sl-cmpbar b{color:var(--accent);font-size:var(--fs-sm)}
.sl-note{font-size:var(--fs-xs);color:var(--muted);margin:2px 0 0}
.sl-cols{display:flex;gap:8px}
.sl-cols .sl-col{flex:1;min-width:0;display:flex;flex-direction:column;gap:7px}
.sl-colh{font-size:var(--fs-sm);font-weight:800;color:var(--accent);text-align:center;
border-bottom:1px solid var(--line);padding-bottom:3px}
.sl-grp h4{margin:0 0 4px;font-size:var(--fs-xs);color:var(--muted);font-weight:800;
letter-spacing:.5px;border-left:3px solid var(--line);padding-left:6px}
.sl-row{display:flex;align-items:baseline;gap:6px;background:var(--panel);
border:1px solid var(--line);border-radius:7px;padding:5px 8px;cursor:pointer;
margin-bottom:4px;transition:border-color .15s}
.sl-row:hover{border-color:var(--accent)}
.sl-row.changed{border-color:#ff9a6b;background:rgba(255,154,107,.09)}
.sl-reg{font-size:var(--fs-xs);color:var(--muted);font-weight:700;flex:0 0 auto;min-width:38px}
#side .sl-cols:not(.dual) .sl-reg{ width:6em; min-width:6em; white-space:nowrap }
.sl-pol{font-size:var(--fs-sm);color:#fff;font-weight:800;white-space:nowrap;
overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.sl-king{font-size:var(--fs-xs);color:#ffd980;white-space:nowrap;flex:0 0 auto;
overflow:hidden;text-overflow:ellipsis;max-width:42%}
.ls{display:flex;flex-direction:column;gap:4px;margin-top:8px}
.ls-row{display:grid;grid-template-columns:26px minmax(96px,1.3fr) 1fr 62px 96px;
align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);
border-radius:8px;padding:6px 9px;cursor:pointer;transition:border-color .15s}
.ls-row:hover{border-color:var(--accent)}
.ls-rank{font-size:var(--fs-sm);color:var(--muted);font-weight:800;text-align:right}
.ls-name{font-size:var(--fs-sm);font-weight:800;color:#fff;display:flex;flex-direction:column;line-height:1.25}
.ls-name em{font-size:var(--fs-xs);color:var(--muted);font-style:normal;font-weight:600}
.ls-bar{background:var(--panel2);border-radius:5px;height:9px;overflow:hidden}
.ls-bar i{display:block;height:100%;border-radius:5px;
background:linear-gradient(90deg,#5b7cff,#ffcc5c)}
.ls-yrs{font-size:var(--fs-sm);color:var(--accent);font-weight:800;text-align:right}
.ls-span{font-size:var(--fs-xs);color:var(--muted);text-align:right;white-space:nowrap}
.ls-yrs.ls-fix{position:relative;cursor:help}
.ls-yrs.ls-fix::after{content:'';position:absolute;top:1px;right:-5px;
width:4px;height:4px;border-radius:50%;background:var(--muted)}
#cmdk{position:fixed;inset:0;z-index:120;display:none}
#cmdk.open{display:block}
.cmdk-mask{position:absolute;inset:0;background:rgba(4,7,14,.62);backdrop-filter:blur(2px)}
.cmdk-box{position:relative;margin:9vh auto 0;width:min(640px,92vw);background:var(--panel);
border:1px solid #3a4a78;border-radius:14px;box-shadow:0 26px 70px rgba(0,0,0,.7);overflow:hidden}
.cmdk-box input{width:100%;box-sizing:border-box;background:transparent;border:none;
border-bottom:1px solid var(--line);color:var(--ink);padding:14px 16px;
font-size:var(--fs-h2);outline:none;font-family:inherit}
.cmdk-box input::placeholder{color:#5b6a92;font-size:var(--fs-body)}
.cmdk-list{max-height:52vh;overflow-y:auto}
.cmdk-list::-webkit-scrollbar{width:8px}
.cmdk-list::-webkit-scrollbar-thumb{background:#2c3a60;border-radius:4px}
.cmdk-i{display:flex;align-items:baseline;gap:10px;padding:9px 16px;cursor:pointer;
border-bottom:1px solid rgba(38,50,79,.4)}
.cmdk-i.sel,.cmdk-i:hover{background:#22305a}
.cmdk-k{font-size:var(--fs-micro);color:var(--on-accent,#241a02);background:var(--accent);border-radius:5px;
padding:1px 6px;font-weight:800;flex:0 0 auto}
.cmdk-t{font-size:var(--fs-body);font-weight:700;color:#fff;flex:0 0 auto}
.cmdk-s{font-size:var(--fs-xs);color:var(--muted);overflow:hidden;
text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
.cmdk-empty{padding:20px 16px;color:var(--muted);font-size:var(--fs-sm);text-align:center}
.cmdk-foot{padding:8px 16px;font-size:var(--fs-xs);color:var(--muted);
border-top:1px solid var(--line);background:var(--panel2)}
.kw{margin-top:10px;border-top:1px solid var(--line);padding-top:8px}
.kw-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:5px}
.kw-c{background:var(--panel2);border:1px solid var(--line);border-radius:7px;
padding:5px 8px;display:flex;flex-direction:column;line-height:1.3}
.kw-c b{font-size:var(--fs-xs);color:var(--muted);font-weight:700}
.kw-c span{font-size:var(--fs-sm);color:#fff;font-weight:800;
white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kw-c em{font-size:var(--fs-xs);color:#ffd980;font-style:normal;
white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.mgrid-i{display:flex;flex-direction:column;align-items:center;gap:5px;padding:14px 6px;
background:var(--panel2);border:1px solid var(--line);border-radius:11px;
color:var(--ink);cursor:pointer;font-family:inherit}
.mgrid-i:hover{background:#22305a;border-color:var(--accent)}
.mgrid-i span{font-size:22px;line-height:1}
.mgrid-i em{font-size:var(--fs-xs);font-style:normal;font-weight:700}
@media (max-width:1100px){
#iconbar .icon-tool{padding:6px 0}
.ls-row{grid-template-columns:22px minmax(80px,1.2fr) 1fr 54px}
.ls-span{display:none}
}
@media (max-width:1023px){
.sl-cols.dual{flex-direction:column}
}
.sl-cols.dual .sl-row{flex-direction:column;align-items:stretch;gap:1px;padding:5px 7px}
.sl-cols.dual .sl-reg{min-width:0;font-size:var(--fs-micro)}
.sl-cols.dual .sl-pol{white-space:normal;line-height:1.25}
.sl-cols.dual .sl-king{max-width:none;font-size:var(--fs-micro)}
.sl-yr{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;min-width:0}
.sl-yr em{margin-left:0}
.tour-search{width:100%;box-sizing:border-box;background:var(--panel2);border:1px solid var(--line);
border-radius:9px;color:var(--ink);padding:9px 12px;font-size:var(--fs-body);
outline:none;font-family:inherit;margin:8px 0 4px}
.tour-search:focus{border-color:var(--accent);box-shadow:0 0 0 2px rgba(255,204,92,.15)}
.tour-cat{margin:14px 0 4px}
.tour-cat h3{display:flex;align-items:center;gap:8px;margin:0 0 8px;font-size:var(--fs-h2);
color:#fff;font-weight:800;border-left:4px solid var(--accent);padding-left:9px}
.tour-cat h3 em{font-style:normal;font-size:var(--fs-xs);color:var(--on-accent,#241a02);background:var(--accent);
border-radius:20px;padding:1px 8px;font-weight:800}
#legal-line{
display:flex; align-items:center; gap:6px; flex-wrap:wrap;
padding:2px 0 0; color:var(--muted); font-size:var(--fs-xs); opacity:.75;
}
#legal-line button{
background:none; border:none; padding:0; cursor:pointer;
color:var(--muted); font-size:inherit; font-family:inherit;
text-decoration:underline; text-underline-offset:2px;
}
#legal-line button:hover{ color:var(--ink); }
.legal section{ padding:12px 0; border-top:1px solid var(--line); }
.legal section:first-child{ border-top:none; }
.legal h3{ margin:0 0 6px; font-size:var(--fs-body); font-weight:800; }
.legal p{ margin:6px 0; font-size:var(--fs-sm); line-height:1.65; color:var(--ink); }
.legal ol,.legal ul{ margin:6px 0; padding-left:20px; font-size:var(--fs-sm); line-height:1.6; }
.legal li{ margin:3px 0; }
.legal code{
background:var(--panel2); border:1px solid var(--line); border-radius:4px;
padding:0 4px; font-size:.92em;
}
.legal-hero{
background:var(--panel2); border:1px solid var(--line); border-radius:10px;
padding:12px 14px !important; margin-bottom:4px;
}
.legal-warn{
background:rgba(255,180,60,.08); border-left:3px solid #ffb43c;
border-radius:0 8px 8px 0; padding:9px 12px !important;
}
.legal-credits{ max-height:220px; overflow:auto; }
.legal-credits a{ color:#8fb4ff; word-break:break-all; }
.legal-credits em{ color:var(--muted); font-style:normal; }
.ls-note{ margin-top:10px; border-top:1px solid var(--line); padding-top:8px; }
.ls-note summary{ cursor:pointer; }
.ls-note p{ margin:6px 0; line-height:1.6; }
.sl-king.figure{ opacity:.66; }
.sl-king.multi{ color:#8fb4ff; opacity:.85; font-weight:700; }
.rcard .power .frag.multi{ color:#8fb4ff; }
.kportwrap{ display:flex; flex-direction:column; align-items:center; gap:5px; }
.kportnote{
font-size:var(--fs-xs); color:var(--muted); opacity:.85; text-align:center;
max-width:200px; line-height:1.35;
}
#legal-line .cr{opacity:.8}
#brandline{margin:0;padding:0;flex-shrink:0;font-size:var(--fs-sm);font-weight:700;letter-spacing:.5px;
display:flex;align-items:center;gap:6px}
#brand{display:flex;align-items:center;gap:6px;flex:1 1 auto;min-width:0;padding:3px 6px;border:1px solid transparent;
background:none;border-radius:8px;cursor:pointer;text-align:left;font-family:inherit;
font-size:inherit;font-weight:inherit;letter-spacing:inherit;color:var(--muted);
white-space:nowrap;overflow:hidden;transition:.16s}
#brand:hover{background:var(--panel);border-color:var(--border)}
#brand:active{transform:scale(.99)}
#brandmark{width:18px;height:18px;flex:0 0 auto;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}
#brand:hover #brandmark{filter:drop-shadow(0 0 6px rgba(255,204,92,.45))}
#brand b{font-size:var(--fs-body);font-weight:900;letter-spacing:.12em;color:#ffe6a6;flex:0 0 auto}
#brand span{color:var(--accent);overflow:hidden;text-overflow:ellipsis;min-width:0}
#brandline #acctchip{
flex:0 0 auto;max-width:46%;padding:4px 8px;gap:6px;
background:var(--panel2);border:1px solid var(--line);border-radius:20px;
font-size:var(--fs-sm);font-weight:600;letter-spacing:0;
display:flex;align-items:center;min-width:0;transition:.16s}
#brandline #acctchip:hover{border-color:var(--accent);background:var(--panel)}
#brandline #acctchip .fl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;max-width:7em}
#brandline #acctchip .fi{flex:0 0 auto;display:flex;align-items:center}
#brandline #acctchip.is-pro{border-color:var(--accent)}
#brandline #acctchip.is-pro .fi{color:var(--accent)}
#acctchip .lvb{flex:0 0 auto;padding:1px 7px;border-radius:10px;font-size:11px;font-weight:800;
letter-spacing:.02em;background:var(--panel);border:1px solid var(--line);color:var(--muted)}
#acctchip.is-pro .lvb{background:#3a2f14;border-color:var(--accent);color:var(--accent)}
#acctchip.is-admin .lvb{background:#123a3a;border-color:#4fd1c5;color:#7fe7dc}
#brandline #acctchip.is-admin{border-color:#4fd1c5}
#brandline #acctchip.is-admin .fi{color:#7fe7dc}
@media (max-width:1180px){
#brandline #acctchip .fl{display:none}
#brandline #acctchip{max-width:none;padding:4px 7px}
}
#acctbar:empty{display:none}
.fb-home{display:none}
@media (max-width:1023px){
.fb-home{display:inline-flex !important;align-items:center;gap:4px;flex:0 0 auto;
background:linear-gradient(140deg,#2a3a68,#1a2444);border:1px solid var(--accent);color:#ffe6a6;
border-radius:20px;padding:6px 12px;font-weight:800;font-size:var(--fs-sm);font-family:inherit;
min-height:34px;cursor:pointer}
.fb-home .fbh-i{font-size:14px}
}
#dock-root{
position:fixed;z-index:52;display:none;flex-direction:column;min-width:0;min-height:0;
left:10px;top:10px;width:clamp(258px,21vw,336px);
bottom:calc(var(--ctrlh, 118px) + 20px);
background:linear-gradient(180deg,#141b30,#0d1326);
border:1px solid var(--border);border-radius:14px;
box-shadow:0 18px 60px rgba(0,0,0,.5);
}
#dock-root.open{display:flex;animation:dockInX .24s cubic-bezier(.3,.8,.3,1)}
@keyframes dockInX{from{opacity:0;transform:translateX(-16px)}to{opacity:1;transform:none}}
.dock-tabs{display:flex;gap:4px;padding:0 10px 9px;border-bottom:1px solid var(--line);flex:0 0 auto}
.dock-tabs button{flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:center;gap:4px;
padding:7px 4px;border:1px solid var(--line);background:var(--panel);color:var(--muted);
border-radius:8px;font-size:var(--fs-xs);font-weight:700;font-family:inherit;cursor:pointer;
white-space:nowrap;transition:.14s}
.dock-tabs button span{font-size:13px;line-height:1}
.dock-tabs button:hover{border-color:var(--accent);color:var(--ink)}
.dock-tabs button.on{background:var(--accent);color:var(--on-accent,#241a02);border-color:var(--accent)}
.dock-head{display:flex;align-items:center;gap:8px;padding:11px 12px 9px;border-bottom:1px solid var(--line);flex:0 0 auto}
.dock-grab{display:none}
.dock-title{margin:0;font-size:var(--fs-h2);font-weight:800;flex:1;min-width:0;
white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dock-close{background:var(--panel2);border:1px solid var(--line);color:var(--muted);
width:32px;height:32px;min-height:32px;border-radius:9px;font-size:15px;cursor:pointer;flex:0 0 auto;font-family:inherit}
.dock-close:hover{color:var(--ink);border-color:var(--accent)}
.dock-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:10px 12px 14px}
.dock-body::-webkit-scrollbar{width:8px}
.dock-body::-webkit-scrollbar-thumb{background:#2c3a60;border-radius:4px}
@media (max-width:1023px){
#dock-root{
left:0;right:0;width:auto;border-radius:16px 16px 0 0;
box-shadow:0 -14px 44px rgba(0,0,0,.6);
top:calc(var(--mapbot, 260px) + 6px);
bottom:var(--dock-h, 190px);
}
#dock-root.open{animation:dockInY .26s cubic-bezier(.3,.8,.3,1)}
@keyframes dockInY{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.dock-head{padding:8px 12px 8px;position:relative}
.dock-tabs{padding:0 12px 9px;gap:5px}
.dock-tabs button{padding:9px 4px;min-height:38px;font-size:var(--fs-sm)}
.dock-grab{display:block;position:absolute;top:4px;left:50%;transform:translateX(-50%);
width:40px;height:4px;border-radius:3px;background:#39466e}
.dock-close{width:36px;height:36px;min-height:36px}
.dock-body{padding:8px 12px 16px}
}
@media (max-width:1023px) and (orientation:landscape) and (max-height:560px){
#dock-root{
top:6px;bottom:calc(var(--dock-h, 150px) + 6px);
left:auto;right:6px;width:min(52vw,430px);border-radius:14px;
box-shadow:-10px 0 40px rgba(0,0,0,.55);
}
body:not(.m2).dock-open #map-wrap{width:calc(100% - min(52vw,430px) - 14px);align-self:flex-start}
body:not(.m2).dock-open #mobilebrief,
body:not(.m2).dock-open #side{width:calc(100% - min(52vw,430px) - 14px)}
}
.fg-head{display:flex;flex-direction:column;gap:7px;margin:0 0 8px;padding:0 0 8px;
border-bottom:1px solid var(--line)}
.fg-chips{align-items:center}
.fg-count{margin-left:auto;white-space:nowrap}
.fg-kw{width:100%;box-sizing:border-box;background:var(--panel2);border:1px solid var(--line);
border-radius:9px;color:var(--ink);padding:9px 11px;font-size:var(--fs-sm);font-family:inherit}
.fg-chips{display:flex;flex-wrap:wrap;gap:4px}
.fg-chip{border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:20px;
padding:4px 11px;font-size:var(--fs-xs);cursor:pointer;font-family:inherit;min-height:28px}
.fg-chip.on{background:var(--accent);color:var(--on-accent,#241a02);border-color:var(--accent);font-weight:700}
.fg-count{padding:0 2px}
.fg-era{margin-bottom:12px}
.fg-era h3{display:flex;align-items:baseline;gap:8px;margin:6px 0 6px;font-size:var(--fs-sm);
font-weight:800;color:#ffd980;border-left:3px solid var(--accent);padding-left:8px}
.fg-era h3 em{font-style:normal;font-size:var(--fs-xs);color:var(--muted);font-weight:500}
.fg-items{display:flex;flex-direction:column;gap:5px}
.fg-item{display:grid;grid-template-columns:1fr auto;grid-template-areas:"nm life" "role role";
gap:2px 8px;width:100%;text-align:left;background:var(--panel);border:1px solid var(--line);
border-radius:10px;padding:9px 11px;cursor:pointer;font-family:inherit;transition:.14s;min-height:44px}
.fg-item:hover{border-color:var(--accent);transform:translateY(-1px);background:#1b2440}
.fg-nm{grid-area:nm;font-weight:800;font-size:var(--fs-body);color:var(--ink)}
.fg-life{grid-area:life;font-size:var(--fs-xs);color:var(--accent);white-space:nowrap}
.fg-role{grid-area:role;font-size:var(--fs-xs);color:var(--muted)}
.fg-more{width:100%;margin-top:4px}
#figcard{position:fixed;inset:0;z-index:70;display:none}
#figcard.open{display:block}
.fc-backdrop{position:absolute;inset:0;background:rgba(4,7,16,.72);backdrop-filter:blur(3px)}
.fc-box{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
width:min(80vw,1120px);height:80vh;max-height:88dvh;display:flex;flex-direction:column;
background:linear-gradient(180deg,#161e36,#0e1528);border:1px solid var(--border);
border-radius:18px;box-shadow:0 28px 90px rgba(0,0,0,.7);overflow:hidden;
animation:fcIn .22s cubic-bezier(.2,.9,.3,1)}
@keyframes fcIn{from{opacity:0;transform:translate(-50%,-46%) scale(.97)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.fc-head{display:flex;align-items:flex-start;gap:10px;padding:16px 20px 12px;border-bottom:1px solid var(--line);flex:0 0 auto}
.fc-head h2{margin:0;font-size:var(--fs-display);font-size:clamp(20px,2.4vw,30px);font-weight:900;letter-spacing:.04em}
.fc-sub{color:var(--accent);font-size:var(--fs-sm);margin-top:3px}
.fc-close{margin-left:auto;background:var(--panel2);border:1px solid var(--line);color:var(--muted);
width:38px;height:38px;min-height:38px;border-radius:11px;font-size:16px;cursor:pointer;flex:0 0 auto;font-family:inherit}
.fc-close:hover{color:var(--ink);border-color:var(--accent)}
.fc-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(220px,30%) 1fr;gap:0}
.fc-left{padding:16px 18px;border-right:1px solid var(--line);overflow-y:auto;display:flex;flex-direction:column;gap:12px}
.fc-right{padding:16px 22px 24px;overflow-y:auto}
.fc-left::-webkit-scrollbar,.fc-right::-webkit-scrollbar{width:8px}
.fc-left::-webkit-scrollbar-thumb,.fc-right::-webkit-scrollbar-thumb{background:#2c3a60;border-radius:4px}
.fc-port{width:100%;aspect-ratio:1/1;border-radius:14px;overflow:hidden;background:#0a1120;border:1px solid var(--line)}
.fc-port svg,.fc-port img{width:100%;height:100%;display:block;object-fit:cover}
.fc-noport{position:relative;width:100%;height:100%}
.fc-noport svg{width:100%;height:100%}
.fc-noport-tip{position:absolute;left:0;right:0;bottom:0;padding:6px 8px;text-align:center;
font-size:var(--fs-xs);color:#e7c66a;background:rgba(4,10,14,.72)}
.fc-role{font-weight:800;font-size:var(--fs-body)}
.fc-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.fc-tag{background:var(--panel2);border:1px solid var(--line);border-radius:20px;padding:3px 10px;
font-size:var(--fs-xs);color:var(--muted)}
.fc-acts{display:flex;flex-direction:column;gap:7px;margin-top:auto}
.fc-acts .btn{width:100%;justify-content:center}
.fc-lead{margin:0 0 14px;font-size:var(--fs-h2);line-height:1.55;color:#ffe6a6}
.fc-right h3{font-size:var(--fs-body);font-weight:800;margin:16px 0 8px;
border-left:3px solid var(--accent);padding-left:9px;color:#ffd980}
.fc-p{font-size:var(--fs-body);line-height:1.85;color:#cfd6ea;margin:0 0 10px}
.fc-chron{list-style:none;margin:0;padding:0 0 0 4px;border-left:2px solid var(--line)}
.fc-chron li{position:relative;display:flex;gap:10px;padding:7px 0 7px 16px;cursor:pointer;border-radius:8px}
.fc-chron li::before{content:"";position:absolute;left:-5px;top:15px;width:8px;height:8px;border-radius:50%;
background:var(--accent);box-shadow:0 0 0 3px rgba(255,204,92,.15)}
.fc-chron li:hover{background:#1b2440}
.fc-cy{flex:0 0 auto;min-width:62px;color:var(--accent);font-weight:700;font-size:var(--fs-sm)}
.fc-ct{font-size:var(--fs-sm);line-height:1.5}
@media (max-width:1023px){
.fc-box{width:92vw;height:80dvh;max-height:80dvh}
.fc-body{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto}
.fc-left{border-right:none;border-bottom:1px solid var(--line);overflow:visible;
display:grid;grid-template-columns:38% 1fr;gap:12px;align-items:start}
.fc-port{grid-row:span 2}
.fc-acts{margin-top:8px;grid-column:2}
.fc-right{overflow:visible;padding:14px 16px 22px}
.fc-head{padding:12px 14px 10px}
}
#dock-root .cmp-head{display:flex;flex-direction:column;gap:7px;margin:0 0 8px;padding:0 0 9px;
border-bottom:1px solid var(--line)}
#dock-root .cmp-yrbox{font-size:var(--fs-h1);font-weight:900;color:var(--accent)}
#dock-root .cmp-yrbox em{font-style:normal;font-size:var(--fs-sm);color:var(--muted);margin-left:6px}
#dock-root #cmp-slider{width:100%;height:32px}
#dock-root .cmp-jump{display:flex;flex-wrap:wrap;gap:4px}
#dock-root .cmp-jump .mini{padding:4px 9px;font-size:var(--fs-xs);border-radius:16px;min-height:28px}
.cmp-sync{display:flex;align-items:center;gap:6px;font-size:var(--fs-xs);color:var(--muted);cursor:pointer}
#dock-root .cmp-group h3{font-size:var(--fs-sm);font-weight:800;color:#ffd980;margin:10px 0 6px;
border-left:3px solid var(--accent);padding-left:8px}
#dock-root .cmp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:6px}
#dock-root .cmp-card{background:var(--panel);border:1px solid var(--line);border-radius:10px;
padding:8px 9px;cursor:pointer;transition:.14s}
#dock-root .cmp-card:hover{border-color:var(--accent);transform:translateY(-1px)}
#dock-root .cmp-reg{font-weight:800;font-size:var(--fs-sm)}
#dock-root .cmp-pol{font-size:var(--fs-xs);color:#cfd6ea;margin-top:2px}
#dock-root .cmp-ruler{font-size:var(--fs-xs);color:var(--accent);margin-top:2px}
#dock-root .cmp-ev{list-style:none;margin:5px 0 0;padding:0;font-size:var(--fs-xs);color:var(--muted);line-height:1.5}
#dock-root .cmp-ev b{color:#9fb0d8;font-weight:700;margin-right:3px}
#dock-root #cmp-slider{-webkit-appearance:none;appearance:none;background:transparent}
#dock-root #cmp-slider::-webkit-slider-runnable-track{height:6px;border-radius:4px;
background:linear-gradient(90deg,#3a4a72,#5b6ea8)}
#dock-root #cmp-slider::-moz-range-track{height:6px;border-radius:4px;background:#3a4a72}
#dock-root #cmp-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;
width:20px;height:20px;border-radius:50%;background:var(--accent);border:2px solid #241a02;
margin-top:-7px;box-shadow:0 2px 8px rgba(0,0,0,.5);cursor:pointer}
#dock-root #cmp-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;
background:var(--accent);border:2px solid #241a02;cursor:pointer}
.st-head{border-bottom:1px solid var(--line);padding-bottom:9px;margin-bottom:10px}
.st-name{font-size:var(--fs-h1);font-weight:900;color:#ffe6a6}
.st-span{font-size:var(--fs-sm);color:var(--accent);margin-top:3px}
.st-meta{display:flex;flex-direction:column;gap:5px;background:var(--panel);border:1px solid var(--line);
border-radius:10px;padding:10px 12px;margin-bottom:10px}
.st-m{font-size:var(--fs-sm);line-height:1.55}
.st-m b{display:inline-block;min-width:62px;color:var(--muted);font-weight:700;margin-right:6px}
.st-tags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:12px}
.st-tag{background:#22305a;border:1px solid var(--border);border-radius:20px;padding:3px 11px;
font-size:var(--fs-xs);color:#ffd980}
.st-p{font-size:var(--fs-body);line-height:1.85;color:#cfd6ea;margin:0 0 10px}
.st .st-ev{list-style:none;margin:0;padding:0 0 0 4px;border-left:2px solid var(--line)}
.st-ev li{position:relative;display:flex;gap:10px;padding:7px 0 7px 16px;cursor:pointer;border-radius:8px}
.st-ev li::before{content:"";position:absolute;left:-5px;top:15px;width:8px;height:8px;border-radius:50%;
background:var(--accent);box-shadow:0 0 0 3px rgba(255,204,92,.15)}
.st-ev li:hover{background:#1b2440}
.st-ey{flex:0 0 auto;min-width:66px;color:var(--accent);font-weight:700;font-size:var(--fs-sm)}
.st-et{font-size:var(--fs-sm);line-height:1.5}
.st h4{font-size:var(--fs-body);margin:16px 0 8px;border-left:3px solid var(--accent);padding-left:9px;color:#ffd980}
.st-others{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}
.st-oh{font-size:var(--fs-sm);font-weight:800;color:#ffd980;margin-bottom:7px}
.st-chips{display:flex;flex-wrap:wrap;gap:5px}
.st-chip{background:var(--panel);border:1px solid var(--line);color:var(--ink);border-radius:20px;
padding:5px 13px;font-size:var(--fs-sm);cursor:pointer;font-family:inherit;min-height:32px;transition:.14s}
.st-chip:hover{border-color:var(--accent);background:#1b2440}
#frags .frag{cursor:pointer}
#frags .frag:hover .sn{fill:#ffe6a6}
.fl-kw{width:100%;box-sizing:border-box;background:var(--panel2);border:1px solid var(--line);
border-radius:9px;color:var(--ink);padding:10px 12px;font-size:var(--fs-body);font-family:inherit}
.fl-segs{display:flex;flex-wrap:wrap;gap:5px;margin:9px 0 7px}
.fl-seg{border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:20px;
padding:6px 14px;font-size:var(--fs-sm);cursor:pointer;font-family:inherit;min-height:34px}
.fl-seg.on{background:var(--accent);color:var(--on-accent,#241a02);border-color:var(--accent);font-weight:700}
.fl-count{margin-bottom:8px}
.fl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(184px,1fr));gap:6px}
.fl-item{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"img n" "img cap";
gap:1px 10px;align-items:center;text-align:left;background:var(--panel);border:1px solid var(--line);
border-radius:10px;padding:8px 11px;cursor:pointer;font-family:inherit;transition:.14s;min-height:46px}
.fl-item:hover{border-color:var(--accent);background:#1b2440;transform:translateY(-1px)}
.fl-thumb{grid-area:img;width:30px;height:20px;object-fit:cover;border-radius:2px;
box-shadow:0 0 0 1px rgba(255,255,255,.18)}
.fl-n{grid-area:n;font-weight:800;font-size:var(--fs-body);color:var(--ink)}
.fl-cap{grid-area:cap;font-size:var(--fs-xs)}
.fl-note{margin-top:14px;line-height:1.6}
#flagcard{position:fixed;inset:0;z-index:80;display:none}
#flagcard.open{display:block}
.fmc-backdrop{position:absolute;inset:0;background:rgba(4,7,16,.7);backdrop-filter:blur(3px)}
.fmc-box{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
width:min(340px,88vw);padding:20px 22px 22px;text-align:center;
background:linear-gradient(180deg,#161e36,#0e1528);border:1px solid var(--border);
border-radius:18px;box-shadow:0 24px 70px rgba(0,0,0,.7);
animation:fmcIn .18s cubic-bezier(.2,.9,.3,1)}
@keyframes fmcIn{from{opacity:0;transform:translate(-50%,-46%) scale(.96)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.fmc-close{position:absolute;top:10px;right:10px;background:var(--panel2);border:1px solid var(--line);
color:var(--muted);width:32px;height:32px;min-height:32px;border-radius:9px;cursor:pointer;font-family:inherit}
.fmc-close:hover{color:var(--ink);border-color:var(--accent)}
.fmc-flag{width:180px;height:120px;margin:6px auto 14px;border-radius:6px;overflow:hidden;
box-shadow:0 6px 20px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.16)}
.fmc-flag img{width:100%;height:100%;object-fit:cover;display:block}
.fmc-n{font-size:var(--fs-h1);font-weight:900;color:#ffe6a6}
.fmc-full{font-size:var(--fs-sm);color:var(--muted);margin:3px 0 14px}
.fmc-rows{display:flex;flex-direction:column;gap:6px;text-align:left}
.fmc-row{display:flex;gap:10px;background:var(--panel);border:1px solid var(--line);
border-radius:9px;padding:8px 11px;font-size:var(--fs-sm)}
.fmc-row b{flex:0 0 auto;min-width:66px;color:var(--muted);font-weight:700}
.fmc-row span{line-height:1.5}
@media (max-width:1023px){
.fl-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.fmc-flag{width:150px;height:100px}
}
.feat-btn .fi,.tab-btn .ti,.mgrid-i > span,.dock-tabs button > span,#segbar button > .ic{
display:inline-flex;align-items:center;justify-content:center;line-height:0}
.feat-btn .ic,.tab-btn .ic,.mgrid-i .ic,.dock-tabs .ic,#segbar .ic{color:currentColor}
#featurebar .primary-tool .fi{line-height:0}
#iconbar .icon-tool .fi{line-height:0}
#moregrid .more-tool .fi{line-height:0}
:focus-visible{outline:none;box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--accent);border-radius:8px}
.tour-card:focus-visible,.fig-card:focus-visible,.war-card:focus-visible,.rcard:focus-visible{
box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--accent)}
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:var(--accent);color:var(--on-accent,#241a02);
padding:8px 14px;border-radius:0 0 10px 0;font-weight:800}
.skip-link:focus{left:0}
.tour-card{width:100%;text-align:left;font-family:inherit;font-size:inherit;color:inherit;
appearance:none;-webkit-appearance:none}
#segbar button[data-m]{display:inline-flex;align-items:center;justify-content:center;gap:5px}
#segbar .segfold{flex:0 0 30px;width:30px;padding:6px 0;color:var(--muted);
display:inline-flex;align-items:center;justify-content:center}
#segbar .segfold:hover{color:var(--ink);background:rgba(255,255,255,.05)}
#onb.onb-one .onb-tip{width:320px}
#onb.onb-one .onb-bar{justify-content:flex-end}
.war-more{width:100%;justify-content:center;margin:6px 0 10px}
#segbar .seghead{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;
padding:6px 4px;font-size:var(--fs-sm);font-weight:800;color:var(--accent)}
#gate-root{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;
padding:20px;overflow-y:auto;background:rgba(7,11,24,.82);backdrop-filter:blur(3px)}
body.gated{overflow:hidden}
.gate-card{position:relative;width:100%;max-width:460px;background:var(--panel);border:1px solid var(--border);
border-radius:18px;padding:26px 24px;box-shadow:0 30px 90px rgba(0,0,0,.6);margin:auto}
.gate-x{position:absolute;top:10px;right:10px;width:36px;height:36px;border-radius:10px;
background:none;border:none;color:var(--muted);font-size:24px;line-height:1;
font-family:inherit;cursor:pointer;display:flex;align-items:center;justify-content:center}
.gate-x:hover{background:rgba(255,255,255,.07);color:var(--ink)}
.gate-x:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.gate-brand{display:flex;align-items:center;gap:8px;color:var(--accent);font-size:var(--fs-h2);margin-bottom:14px}
.gate-brand b{font-weight:800}
.gate-brand span{color:var(--muted);font-size:var(--fs-sm);font-weight:600}
.gate-card h1{font-size:22px;font-weight:800;margin:0 0 8px}
.gate-sub{color:var(--muted);font-size:var(--fs-body);line-height:1.6;margin-bottom:14px}
.gate-sub b{color:var(--accent)}
.gate-warn{background:#2a2412;border:1px solid #5a4a1c;color:#ffe0a0;border-radius:10px;
padding:10px 12px;font-size:var(--fs-sm);line-height:1.55;margin-bottom:14px}
.gate-fld{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.gate-fld > span{font-size:var(--fs-sm);color:var(--muted);font-weight:700}
.gate-fld i{font-style:normal;color:var(--accent);font-weight:600;margin-left:4px}
.gate-fld input{background:var(--bg);border:1px solid var(--line);border-radius:10px;color:var(--ink);
padding:11px 12px;font-size:var(--fs-body);font-family:inherit;width:100%}
.gate-fld input:focus{outline:none;border-color:var(--accent)}
.gate-err{display:none;color:#ff9b9b;font-size:var(--fs-sm);margin:2px 0 10px}
.gate-err.on{display:block}
.gate-go{width:100%;padding:13px;border-radius:11px;border:1px solid var(--accent);
background:var(--accent);color:var(--on-accent,#241a02);font-weight:800;font-size:var(--fs-h2);
font-family:inherit;cursor:pointer;transition:.15s}
.gate-go:hover:not(:disabled){filter:brightness(1.07)}
.gate-go:disabled{opacity:.6;cursor:default}
.gate-alt{text-align:center;color:var(--muted);font-size:var(--fs-sm);margin-top:14px}
.gate-alt button{background:none;border:none;color:var(--accent);font-weight:700;
font-family:inherit;font-size:inherit;cursor:pointer;text-decoration:underline}
.gate-tier{list-style:none;margin:18px 0 0;padding:14px 0 0;border-top:1px solid var(--line)}
.gate-tier li{color:var(--muted);font-size:var(--fs-sm);line-height:1.6;padding:4px 0}
.gate-tier b{color:var(--ink)}
.gate-fine{color:#7f8bab;font-size:var(--fs-xs);line-height:1.55;margin-top:12px}
@media(max-width:520px){.gate-card{padding:22px 18px}.gate-card h1{font-size:20px}}
#gate-invite{position:fixed;z-index:92;top:112px;right:16px;width:300px;
background:var(--panel);border:1px solid var(--border);border-radius:14px;
padding:14px 15px 13px;box-shadow:0 18px 50px rgba(0,0,0,.5);
opacity:0;transform:translateY(-8px);transition:opacity .2s ease,transform .2s ease}
#gate-invite.on{opacity:1;transform:none}
#gate-invite b{display:block;font-size:var(--fs-body);font-weight:800;margin:0 0 5px;padding-right:22px}
#gate-invite p{margin:0;color:var(--muted);font-size:var(--fs-sm);line-height:1.6}
.gi-x{position:absolute;top:6px;right:6px;width:30px;height:30px;border-radius:8px;
background:none;border:none;color:var(--muted);font-size:20px;line-height:1;
font-family:inherit;cursor:pointer;display:flex;align-items:center;justify-content:center}
.gi-x:hover{background:rgba(255,255,255,.07);color:var(--ink)}
.gi-act{display:flex;gap:8px;margin-top:12px}
.gi-go,.gi-no{flex:1;min-height:38px;border-radius:10px;font-family:inherit;
font-size:var(--fs-sm);font-weight:700;cursor:pointer;transition:.15s}
.gi-go{background:var(--accent);border:1px solid var(--accent);color:var(--on-accent,#241a02)}
.gi-go:hover{filter:brightness(1.07)}
.gi-no{background:transparent;border:1px solid var(--line);color:var(--muted)}
.gi-no:hover{color:var(--ink);border-color:var(--muted)}
.gi-go:focus-visible,.gi-no:focus-visible,.gi-x:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
@media(pointer:coarse){.gi-go,.gi-no{min-height:44px}.gi-x{width:40px;height:40px}}
body.m2 #gate-invite{top:auto;left:12px;right:12px;width:auto;
bottom:calc(var(--m2-nav, 56px) + var(--m2-time, 44px) + var(--m2-safe-b, 0px) + 10px);
transform:translateY(8px)}
body.m2 #gate-invite.on{transform:none}
body.m2-sheet-full #gate-invite{opacity:0;pointer-events:none}
body.lv-pro .feat-btn .pro-dot,
body.lv-pro .tab-btn .pro-dot{display:none}
body.lv-normal .feat-btn[data-gated] .pro-dot{display:inline}
@media (max-width:1023px){
#tourplayer .tp-top #tp-close{min-width:44px;min-height:44px;display:inline-flex;
align-items:center;justify-content:center;font-size:var(--fs-h2)}
.tp-ctrl .btn{min-height:44px;padding-top:0;padding-bottom:0}
.tp-ctrl{padding:8px 12px;gap:6px}
}
.tour-more{width:100%;justify-content:center;margin:10px 0 4px}
body.lv-normal .feat-btn[data-gated]{
opacity:.5; filter:grayscale(.55);
transition:opacity .15s ease, filter .15s ease;
}
body.lv-normal .feat-btn[data-gated]:hover,
body.lv-normal .feat-btn[data-gated]:focus-visible{ opacity:.78; filter:grayscale(.2) }
body.lv-normal .feat-btn[data-gated] .pro-dot{ opacity:1; filter:none }
#featurebar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;flex-wrap:nowrap}
#featurebar .primary-tool{flex:none;width:auto;min-height:58px}
.legal-about{
background:linear-gradient(180deg,#22305a,#1a2444); border:1px solid #39497a; border-radius:10px;
padding:14px 16px !important; margin-bottom:6px;
}
.legal-about .la-brand{ font-size:20px; font-weight:900; letter-spacing:.06em; color:var(--accent); }
.legal-about .la-brand span{ font-size:var(--fs-sm); font-weight:600; letter-spacing:0; color:var(--muted); margin-left:6px; }
.legal-about .la-sub{ color:#dfe6ff !important; }
.legal-about .la-acts{ display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.legal-about .la-btn{
display:inline-flex; align-items:center; padding:7px 14px; border-radius:8px; font-weight:800;
font-size:var(--fs-sm); text-decoration:none; background:var(--accent); color:var(--on-accent,#241a02); border:1px solid var(--accent);
}
.legal-about .la-btn.ghost{ background:transparent; color:#e8ecff; border-color:#5a6a9a; }
.legal-about .la-btn:hover{ filter:brightness(1.08); }
.fl-eras{display:flex;gap:0;margin:10px 0 4px;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.fl-era{flex:1 1 0;min-width:0;border:0;border-right:1px solid var(--line);background:var(--panel);color:var(--muted);
padding:8px 4px;font-size:var(--fs-sm);font-weight:700;cursor:pointer;font-family:inherit;white-space:nowrap;min-height:36px}
.fl-era:last-child{border-right:0}
.fl-era:hover{color:var(--ink)}
.fl-era.on{background:var(--accent);color:var(--on-accent,#241a02)}
.fl-sec{margin:14px 0 6px;font-weight:800;font-size:var(--fs-sm);color:var(--muted)}
.fl-h .fl-thumb{object-fit:contain;background:rgba(255,255,255,.06)}
.fl-h .fl-n{font-size:var(--fs-sm)}
.fmc-hist{background:#2a3150}
.fmc-hist img{object-fit:contain}
.fmc-note span{line-height:1.7;color:var(--ink)}
.fmc-go{margin-top:12px;width:100%;padding:9px 12px;border-radius:10px;border:1px solid var(--accent);
background:transparent;color:var(--accent);font-weight:800;font-size:var(--fs-sm);cursor:pointer;font-family:inherit}
.fmc-go:hover{background:var(--accent);color:var(--on-accent,#241a02)}
.fmc-tag{margin-top:8px;font-size:var(--fs-micro);color:var(--muted)}
#flagcard .fmc-box{max-height:88vh;overflow:auto}
@media (max-width:1023px){
.fl-era{font-size:var(--fs-xs);padding:8px 2px}
}
body.tl-ruler #wars,
body.tl-ruler #heat{ display:none !important; }
body.tl-ruler #track{ height:60px; margin-top:8px; }
body.tl-ruler #rul{
position:absolute; left:0; right:0; top:0; height:56px; border-radius:6px; overflow:hidden;
background:
repeating-linear-gradient(178.6deg, rgba(120,78,28,.10) 0 1px, transparent 1px 4px, rgba(120,78,28,.05) 4px 5px, transparent 5px 11px),
radial-gradient(120% 60% at 22% 70%, rgba(150,100,40,.16), transparent 60%),
radial-gradient(90% 50% at 71% 30%, rgba(150,100,40,.12), transparent 60%),
linear-gradient(180deg, #f3e2bd 0%, #e6cb95 42%, #d6b47a 100%);
box-shadow:
inset 0 1px 0 rgba(255,255,255,.75),
inset 0 -2px 0 rgba(90,58,20,.35),
inset 1px 0 0 rgba(255,255,255,.35), inset -1px 0 0 rgba(90,58,20,.3),
0 2px 0 #7d5a2a, 0 7px 16px rgba(0,0,0,.55);
}
body.tl-ruler #rul .rul-edge{
position:absolute; left:0; right:0; top:0; height:3px;
background:linear-gradient(180deg, #fff4c8 0%, #d8b04a 45%, #8f6a1c 100%);
}
body.tl-ruler #rul-g{ position:absolute; left:0; top:3px; width:100%; height:16px; pointer-events:none }
body.tl-ruler #track .ticks{ top:17px; height:12px; z-index:1 }
body.tl-ruler #track .ticks i{ display:none }
body.tl-ruler #track .ticks span{
color:#3a2610; font-weight:800; font-size:10.5px; letter-spacing:.2px;
text-shadow:0 1px 0 rgba(255,248,225,.6);
}
body.tl-ruler #rul-dyn{
position:absolute; left:0; right:0; top:32px; height:20px;
background:rgba(70,44,14,.18); box-shadow:inset 0 1px 2px rgba(60,36,10,.45);
}
body.tl-ruler #rul-dyn .rd{
position:absolute; top:2px; bottom:2px; background:var(--c);
box-shadow:inset 0 1px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(0,0,0,.35), 1px 0 0 rgba(246,230,190,.9);
opacity:.82; transition:opacity .2s, filter .2s;
}
body.tl-ruler #rul-dyn .rd.on{ opacity:1; filter:saturate(1.25) brightness(1.18);
box-shadow:inset 0 0 0 1px #ffd978, 0 0 8px rgba(255,210,110,.75); z-index:1 }
body.tl-ruler #rul-lab{ position:absolute; left:0; right:0; top:32px; height:20px; pointer-events:none; z-index:2 }
body.tl-ruler #rul-lab .rl{
position:absolute; top:2px; line-height:16px; font-size:11.5px; font-weight:800; color:#fbeecd; white-space:nowrap;
letter-spacing:.5px; text-shadow:0 1px 1px rgba(0,0,0,.55);
}
body.tl-ruler #rul-lab .rl.ovf{ background:var(--c); padding:0 3px; margin-left:-3px; border-radius:3px;
box-shadow:0 0 0 1px rgba(246,230,190,.9) }
body.tl-ruler #rul-lab .rl.off{ visibility:hidden }
body.tl-ruler #rul-lab .rl.on{ color:#fff3c4 }
body.tl-ruler #track .axis{ display:none }
body.tl-ruler #track .fill{ top:53px; height:3px; border-radius:0 2px 2px 0; z-index:2;
background:linear-gradient(180deg,#ffe9a6,#c99a2e) }
body.tl-ruler #track .zero{ top:3px; height:28px; width:2px; background:#b3261e; opacity:.85; z-index:1 }
body.tl-ruler #track input{ top:-2px; height:60px; z-index:3 }
body.tl-ruler #track input::-webkit-slider-thumb{
-webkit-appearance:none; width:16px; height:60px; border-radius:4px; cursor:grab;
background:linear-gradient(90deg, rgba(255,255,255,.28) 0, rgba(255,255,255,.45) 40%, #c8261c 40%, #c8261c 60%, rgba(255,255,255,.45) 60%, rgba(255,255,255,.28) 100%);
border:1px solid rgba(255,255,255,.85);
box-shadow:0 0 0 1px rgba(60,36,10,.55), 0 3px 10px rgba(0,0,0,.5);
}
body.tl-ruler #track input::-moz-range-thumb{
width:14px; height:58px; border-radius:4px; cursor:grab;
background:linear-gradient(90deg, rgba(255,255,255,.28) 0, rgba(255,255,255,.45) 40%, #c8261c 40%, #c8261c 60%, rgba(255,255,255,.45) 60%, rgba(255,255,255,.28) 100%);
border:1px solid rgba(255,255,255,.85); box-shadow:0 0 0 1px rgba(60,36,10,.55), 0 3px 10px rgba(0,0,0,.5);
}
body.tl-ruler #track input:active::-webkit-slider-thumb{ cursor:grabbing }
body.tl-ruler #track input:focus-visible{ outline:none }
body.tl-ruler #track input:focus-visible::-webkit-slider-thumb{ box-shadow:0 0 0 2px #ffd978, 0 3px 10px rgba(0,0,0,.5) }
body.tl-ruler #track .ticks span:first-of-type{ transform:translateX(-2px) }
body.tl-ruler #track .ticks span:last-of-type{ transform:translateX(calc(-100% - 4px)) }
.fl-era .fe-s{display:none}
.fl-h .fl-yr{display:block;font-style:normal;white-space:nowrap;opacity:.9}
@media (max-width:520px){
.fl-era:has(.fe-s) .fe-l{display:none}
.fl-era .fe-s{display:inline}
}
:root{
--tan-brass-hi:#fff1c2; --tan-brass-1:#e6c572; --tan-brass-2:#b88a34; --tan-brass-3:#7c5716;
--tan-gilt:#f0cf7a; --tan-cinnabar:#b3261e;
--tan-corners:linear-gradient(var(--tan-brass-1),var(--tan-brass-1)) top left/9px 2px no-repeat,
linear-gradient(var(--tan-brass-1),var(--tan-brass-1)) top left/2px 9px no-repeat,
linear-gradient(var(--tan-brass-1),var(--tan-brass-1)) top right/9px 2px no-repeat,
linear-gradient(var(--tan-brass-1),var(--tan-brass-1)) top right/2px 9px no-repeat,
linear-gradient(var(--tan-brass-2),var(--tan-brass-2)) bottom left/9px 2px no-repeat,
linear-gradient(var(--tan-brass-2),var(--tan-brass-2)) bottom left/2px 9px no-repeat,
linear-gradient(var(--tan-brass-2),var(--tan-brass-2)) bottom right/9px 2px no-repeat,
linear-gradient(var(--tan-brass-2),var(--tan-brass-2)) bottom right/2px 9px no-repeat;
}
body #featurebar{
position:relative; padding:9px; gap:8px; border-radius:12px; margin:4px 2px 0; border-bottom:none;
background:repeating-linear-gradient(92deg, rgba(0,0,0,.10) 0 1px, transparent 1px 5px, rgba(255,200,150,.035) 5px 6px, transparent 6px 13px),
radial-gradient(140% 90% at 30% 0%, #7c462f 0%, #542e20 45%, #3a1f13 100%);
box-shadow:inset 0 1px 0 rgba(255,220,170,.22), inset 0 -2px 0 rgba(0,0,0,.5),
0 0 0 1px #966626, 0 0 0 2px rgba(0,0,0,.6), 0 10px 24px rgba(0,0,0,.55);
}
body #featurebar::before{content:"";position:absolute;left:10px;right:10px;top:0;height:2px;border-radius:2px;pointer-events:none;
background:linear-gradient(90deg,transparent,var(--tan-brass-1) 12%,var(--tan-brass-hi) 50%,var(--tan-brass-1) 88%,transparent)}
body #featurebar .primary-tool{
min-height:66px; gap:5px; padding:10px 4px 9px; border-radius:8px; border:1px solid #2d160c;
background:repeating-linear-gradient(88deg, rgba(0,0,0,.12) 0 1px, transparent 1px 6px),
radial-gradient(120% 80% at 50% 0%, #553121 0%, #3b2114 60%, #2e180d 100%);
box-shadow:inset 0 3px 8px rgba(0,0,0,.75), inset 0 -1px 0 rgba(255,210,150,.10), 0 1px 0 rgba(255,215,160,.16);
transition:transform .12s ease, box-shadow .12s ease;
}
body #featurebar .primary-tool::after{content:"";position:absolute;inset:3px;border-radius:6px;pointer-events:none;background:var(--tan-corners);opacity:.85}
body #featurebar .primary-tool .fi{ color:var(--tan-gilt); filter:drop-shadow(0 1px 0 rgba(0,0,0,.9)) drop-shadow(0 0 6px rgba(240,200,110,.25)); }
body #featurebar .primary-tool .fl{ color:#f3e2b6; letter-spacing:.12em; text-shadow:0 1px 0 rgba(0,0,0,.95), 0 -1px 0 rgba(255,230,180,.12); }
body #featurebar .primary-tool:hover{ transform:translateY(-1px); background:repeating-linear-gradient(88deg, rgba(0,0,0,.12) 0 1px, transparent 1px 6px),
radial-gradient(120% 80% at 50% 0%, #613826 0%, #422417 60%, #311a0f 100%);
border-color:#2d160c; box-shadow:inset 0 2px 6px rgba(0,0,0,.6), 0 0 0 1px var(--tan-brass-2), 0 0 12px rgba(230,190,100,.28); }
body #featurebar .primary-tool:active{ transform:translateY(1px); box-shadow:inset 0 4px 10px rgba(0,0,0,.85); }
body #featurebar .primary-tool:focus-visible{ outline:2px solid var(--tan-gilt); outline-offset:2px }
body #featurebar .primary-tool .tool-badge{
top:5px; right:6px; border-radius:3px; padding:1px 4px; font-weight:800; letter-spacing:.02em;
background:radial-gradient(circle at 30% 30%, #d0392e, var(--tan-cinnabar) 60%, #8c1b14); color:#fff3df;
transform:rotate(-4deg); box-shadow:0 0 0 1px rgba(255,230,210,.35) inset, 0 1px 2px rgba(0,0,0,.6);
font-family:"Songti SC","STSong","Noto Serif CJK SC","Noto Serif SC",serif;
}
body #featurebar .primary-tool .pro-dot{ top:10px; left:11px; right:auto; width:9px; height:9px; font-size:0; line-height:0; overflow:hidden;
border-radius:50%; background:radial-gradient(circle at 35% 30%, var(--tan-brass-hi), var(--tan-brass-1) 45%, var(--tan-brass-3) 100%);
box-shadow:0 1px 1px rgba(0,0,0,.7); }
body.lv-normal #featurebar .primary-tool[data-gated] .pro-dot{ display:block }
body #segbar{
position:relative; padding:9px 12px 12px; border-radius:10px; border:1px solid #2d160c;
background:repeating-linear-gradient(90deg, rgba(0,0,0,.10) 0 1px, transparent 1px 7px),
linear-gradient(180deg, #683b27 0%, #4b2b1c 55%, #3b2114 100%);
box-shadow:inset 0 1px 0 rgba(255,220,170,.2), inset 0 -2px 0 rgba(0,0,0,.45), 0 0 0 1px #966626, 0 6px 14px rgba(0,0,0,.5);
}
body #segbar .seghead{ color:var(--tan-gilt); letter-spacing:.14em; text-shadow:0 1px 0 #000; }
body #segbar .seghead .ic{ color:var(--tan-gilt) }
body #segbar::after{ content:""; position:absolute; left:50%; bottom:4px; transform:translateX(-50%); width:54px; height:5px; border-radius:3px; pointer-events:none;
background:linear-gradient(180deg,var(--tan-brass-hi),var(--tan-brass-1) 40%,var(--tan-brass-3)); box-shadow:0 1px 1px rgba(0,0,0,.7); }
body #segbar .segfold{ color:var(--tan-gilt); }
body #segbar .segfold:hover{ background:rgba(255,220,150,.08) }
body #focusbar{ padding:5px 6px; border-radius:10px; gap:5px;
background:linear-gradient(180deg, rgba(58,33,21,.94), rgba(33,19,12,.94));
box-shadow:inset 0 1px 0 rgba(255,220,170,.2), 0 0 0 1px #966626, 0 6px 16px rgba(0,0,0,.5); }
body #focusbar button:not(.fb-home){
font-weight:800; letter-spacing:.1em; padding:5px 11px; border-radius:6px;
color:#3a2610; border:1px solid #966d21; backdrop-filter:none;
background:linear-gradient(180deg, rgba(255,255,255,.5) 0, rgba(255,255,255,0) 45%), linear-gradient(180deg, #f1d58c 0%, #d6ae55 48%, #a97d2a 100%);
text-shadow:0 1px 0 rgba(255,244,210,.7); box-shadow:0 1px 0 rgba(0,0,0,.6), inset 0 -1px 0 rgba(90,60,10,.45);
}
body #focusbar button:not(.fb-home):hover{ filter:brightness(1.07) }
body #focusbar button.on{
color:#ffe9b0; text-shadow:0 1px 0 rgba(0,0,0,.7); border-color:#4a0f0b;
background:linear-gradient(180deg, #a8352c 0%, #8e2a22 55%, #6e1c16 100%);
box-shadow:inset 0 2px 5px rgba(0,0,0,.6), 0 0 0 1px var(--tan-brass-2);
}
body #focusbar button:focus-visible{ outline:2px solid var(--tan-gilt); outline-offset:2px }
.tp-body.has-fig{display:grid;grid-template-columns:208px 1fr;gap:14px;align-items:start}
#tp-fig{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:16/9;cursor:zoom-in;
box-shadow:0 0 0 1px #2d160c,0 0 0 2px #966626,0 6px 16px rgba(0,0,0,.5)}
#tp-fig img{width:100%;height:100%;object-fit:cover;display:block}
#tp-fig span{position:absolute;right:5px;bottom:4px;font-size:10px;color:#f3e2b6;background:rgba(0,0,0,.5);padding:1px 5px;border-radius:3px}
@media (max-width:600px){ .tp-body.has-fig{grid-template-columns:1fr} #tp-fig{aspect-ratio:21/9} }
.wd-fig{margin:0 0 10px;position:relative;border-radius:10px;overflow:hidden;aspect-ratio:16/9;cursor:zoom-in;
box-shadow:0 0 0 1px #2d160c,0 0 0 3px #966626,0 8px 20px rgba(0,0,0,.55)}
.wd-fig img{width:100%;height:100%;object-fit:cover;display:block}
.wd-fig figcaption{position:absolute;right:8px;bottom:6px;font-size:10.5px;color:#f3e2b6;background:rgba(0,0,0,.5);padding:2px 7px;border-radius:4px}
#imgzoom{position:fixed;inset:0;z-index:120;display:none;align-items:center;justify-content:center;background:rgba(4,7,16,.86);backdrop-filter:blur(4px);padding:20px}
#imgzoom.on{display:flex}
#imgzoom figure{margin:0;max-width:min(1280px,96vw);text-align:center}
#imgzoom img{max-width:100%;max-height:82vh;border-radius:10px;box-shadow:0 0 0 1px #966626,0 20px 60px rgba(0,0,0,.7)}
#imgzoom figcaption{margin-top:10px;color:#d9c79b;font-size:13px}
#imgzoom .iz-x{position:absolute;top:14px;right:14px;width:40px;height:40px;border-radius:10px;border:1px solid rgba(230,197,114,.4);background:rgba(0,0,0,.4);color:#f3e2b6;font-size:18px;cursor:pointer}
#dock-root, #tourplayer{
--ink:#f3ead6; --muted:#bfae8a; --line:#684622; --border:#966626;
--panel:#402317; --panel2:#311c0f; --bg:#2c180e; --accent:#f0cf7a;
color:var(--ink);
}
#dock-root{
background:repeating-linear-gradient(92deg, rgba(0,0,0,.08) 0 1px, transparent 1px 7px, rgba(255,200,150,.025) 7px 8px, transparent 8px 15px),
linear-gradient(180deg, #3b2216 0%, #2e1a11 55%, #26140b 100%);
border:1px solid #966626;
box-shadow:inset 0 1px 0 rgba(255,220,170,.18), 0 0 0 1px rgba(0,0,0,.6), 0 18px 60px rgba(0,0,0,.5);
}
#dock-root .dock-head{ position:relative; border-bottom:none;
background:repeating-linear-gradient(92deg, rgba(0,0,0,.12) 0 1px, transparent 1px 6px), linear-gradient(180deg, #683b27, #452719); border-radius:13px 13px 0 0 }
#dock-root .dock-head::after{ content:""; position:absolute; left:10px; right:10px; bottom:0; height:2px; border-radius:2px;
background:linear-gradient(90deg,transparent,var(--tan-brass-1) 12%,var(--tan-brass-hi) 50%,var(--tan-brass-1) 88%,transparent) }
#dock-root .dock-title{ color:var(--tan-gilt); letter-spacing:.08em; text-shadow:0 1px 0 #000 }
#dock-root .dock-close, #tourplayer .tp-top #tp-close{ color:#f3e2b6; background:rgba(0,0,0,.25); border:1px solid rgba(230,197,114,.45); border-radius:9px }
#dock-root .dock-close:hover, #tourplayer .tp-top #tp-close:hover{ border-color:var(--tan-brass-1); color:#fff3c4 }
#dock-root .dock-tabs{ padding-top:9px; border-bottom:1px solid rgba(230,197,114,.2) }
#dock-root .dock-tabs button{ color:#3a2610; font-weight:800; letter-spacing:.06em; border:1px solid #966d21; text-shadow:0 1px 0 rgba(255,244,210,.7);
background:linear-gradient(180deg, rgba(255,255,255,.5) 0, rgba(255,255,255,0) 45%), linear-gradient(180deg, #f1d58c 0%, #d6ae55 48%, #a97d2a 100%);
box-shadow:0 1px 0 rgba(0,0,0,.6), inset 0 -1px 0 rgba(90,60,10,.45) }
#dock-root .dock-tabs button .ic{ color:#3a2610 }
#dock-root .dock-tabs button:hover{ filter:brightness(1.07); color:#3a2610; border-color:#966d21 }
#dock-root .dock-tabs button.on{ color:#ffe9b0; text-shadow:0 1px 0 rgba(0,0,0,.7); border-color:#4a0f0b;
background:linear-gradient(180deg, #a8352c 0%, #8e2a22 55%, #6e1c16 100%); box-shadow:inset 0 2px 5px rgba(0,0,0,.6), 0 0 0 1px var(--tan-brass-2) }
#dock-root .dock-tabs button.on .ic{ color:#ffe9b0 }
#dock-root .dock-body::-webkit-scrollbar-thumb{ background:linear-gradient(180deg,#b88a34,#7c5716); border-radius:4px }
#dock-root .fg-kw, #dock-root .war-search input, #dock-root input[type="search"], #dock-root input[type="text"]{
background:linear-gradient(180deg,#251309,#311c10); border:1px solid #7d5321; color:#f3ead6;
box-shadow:inset 0 2px 5px rgba(0,0,0,.7), 0 1px 0 rgba(255,215,160,.08) }
#dock-root .fg-kw:focus, #dock-root .war-search input:focus, #dock-root input:focus{ outline:none; border-color:var(--tan-brass-1); box-shadow:inset 0 2px 5px rgba(0,0,0,.7), 0 0 0 2px rgba(240,207,122,.25) }
#dock-root ::placeholder{ color:#8f7c5c }
#dock-root .fg-chip, #dock-root .wchip, #dock-root .cmp-jump .mini{ color:#3a2610; font-weight:700; border:1px solid #966d21; text-shadow:0 1px 0 rgba(255,244,210,.6);
background:linear-gradient(180deg, rgba(255,255,255,.4) 0, rgba(255,255,255,0) 45%), linear-gradient(180deg, #e9cd84 0%, #cfa650 50%, #a37829 100%) }
#dock-root .fg-chip.on, #dock-root .wchip.on, #dock-root .cmp-jump .mini:active{ color:#ffe9b0; border-color:#4a0f0b; text-shadow:0 1px 0 rgba(0,0,0,.7);
background:linear-gradient(180deg, #a8352c 0%, #8e2a22 55%, #6e1c16 100%); box-shadow:inset 0 1px 4px rgba(0,0,0,.55) }
#dock-root .fg-era h3{ color:var(--tan-gilt); border-left-color:var(--tan-brass-1); text-shadow:0 1px 0 #000 }
#dock-root .fg-item, #dock-root .warcard, #dock-root .cmp-card, #dock-root .wd-side, #dock-root .wd-result, #dock-root .wd-phase{
background:repeating-linear-gradient(90deg, rgba(0,0,0,.08) 0 1px, transparent 1px 7px), linear-gradient(180deg, #4d2f16 0%, #3b2213 100%);
border-color:#7d5321; box-shadow:inset 0 1px 0 rgba(255,215,160,.10), 0 2px 5px rgba(0,0,0,.4) }
#dock-root .fg-item:hover, #dock-root .warcard:hover, #dock-root .cmp-card:hover, #dock-root .wd-phase:hover{
background:repeating-linear-gradient(90deg, rgba(0,0,0,.08) 0 1px, transparent 1px 7px), linear-gradient(180deg, #59371d 0%, #432715 100%);
border-color:var(--tan-brass-1); box-shadow:inset 0 1px 0 rgba(255,215,160,.14), 0 0 10px rgba(230,190,100,.2) }
#dock-root .wd-phase.on{ border-color:var(--tan-brass-1); background:linear-gradient(180deg, #683e1f, #4c2f16) }
#dock-root .fg-nm, #dock-root .wc-name{ color:#f6ead0 }
#dock-root .fg-life, #dock-root .wc-year{ color:var(--tan-gilt) }
#dock-root .wd-terr{ background:linear-gradient(180deg,#54341d,#402614); border:1px solid #7d5321 }
#dock-root .wd-sig{ border-color:var(--tan-brass-2) }
#dock-root .wd-p{ color:#e6dcc5 }
#dock-root .wd-body h4, #dock-root .cmp-group h3{ border-left-color:var(--tan-brass-1); color:#f3e2b6 }
#dock-root .wd-group{ background:rgba(0,0,0,.3); border:1px solid #7d5321 }
#dock-root .btn{ border-color:#966d21 }
#dock-root .btn.ghost{ background:rgba(0,0,0,.25); color:#f3e2b6 }
#dock-root .btn.ghost:hover{ border-color:var(--tan-brass-1) }
#dock-root .btn.primary{ color:#3a2610; border-color:#966d21; background:linear-gradient(180deg, rgba(255,255,255,.45) 0, rgba(255,255,255,0) 45%), linear-gradient(180deg, #f1d58c, #d6ae55 48%, #a97d2a) }
#tourplayer{
background:repeating-linear-gradient(92deg, rgba(0,0,0,.08) 0 1px, transparent 1px 7px), linear-gradient(180deg, rgba(38,22,14,.98), rgba(21,11,6,.98));
border:1px solid #966626; box-shadow:inset 0 1px 0 rgba(255,220,170,.18), 0 0 0 1px rgba(0,0,0,.6), 0 16px 50px rgba(0,0,0,.6) }
#tourplayer .tp-top{ position:relative; border-bottom:none; color:var(--tan-gilt); letter-spacing:.06em;
background:repeating-linear-gradient(92deg, rgba(0,0,0,.12) 0 1px, transparent 1px 6px), linear-gradient(180deg, #683b27, #452719) }
#tourplayer .tp-top::after{ content:""; position:absolute; left:10px; right:10px; bottom:0; height:2px;
background:linear-gradient(90deg,transparent,var(--tan-brass-1) 12%,var(--tan-brass-hi) 50%,var(--tan-brass-1) 88%,transparent) }
#tourplayer #tp-text{ color:#e9e1cc }
#tourplayer .tp-ctrl{ border-top:1px solid rgba(230,197,114,.2) }
#tourplayer .tp-ctrl .btn{ color:#3a2610; border:1px solid #966d21; font-weight:800; text-shadow:0 1px 0 rgba(255,244,210,.6);
background:linear-gradient(180deg, rgba(255,255,255,.45) 0, rgba(255,255,255,0) 45%), linear-gradient(180deg, #f1d58c, #d6ae55 48%, #a97d2a) }
#tourplayer .tp-ctrl .btn.primary{ color:#ffe9b0; border-color:#4a0f0b; text-shadow:0 1px 0 #000;
background:linear-gradient(180deg, #a8352c 0%, #8e2a22 55%, #6e1c16 100%) }
#tourplayer .tp-ctrl .btn:disabled{ opacity:.45 }
#tourplayer #tp-dots i{ background:rgba(243,226,182,.25) }
#tourplayer #tp-dots i.on{ background:var(--tan-gilt) }
#panel-root .panel > header{ position:relative;
background:repeating-linear-gradient(92deg, rgba(0,0,0,.12) 0 1px, transparent 1px 6px), linear-gradient(180deg, #683b27, #452719) !important;
border-bottom:none !important }
#panel-root .panel > header::after{ content:""; position:absolute; left:12px; right:12px; bottom:0; height:2px;
background:linear-gradient(90deg,transparent,var(--tan-brass-1) 12%,var(--tan-brass-hi) 50%,var(--tan-brass-1) 88%,transparent) }
#panel-root .panel > header h2{ color:var(--tan-gilt) !important; letter-spacing:.06em; text-shadow:0 1px 0 #000 }
#panel-root .panel > header .panel-close{ color:#f3e2b6 }
#dock-root #cmp-slider::-webkit-slider-runnable-track{ background:linear-gradient(180deg,#231208,#402312); box-shadow:inset 0 1px 3px rgba(0,0,0,.8), 0 1px 0 rgba(255,215,160,.1) }
#dock-root #cmp-slider::-moz-range-track{ background:linear-gradient(180deg,#231208,#402312) }
#dock-root #cmp-slider::-webkit-slider-thumb{ background:radial-gradient(circle at 35% 30%,#fff3c4,#e2b95a 45%,#8a6420 100%); border:1px solid #7d5416 }
#dock-root #cmp-slider::-moz-range-thumb{ background:radial-gradient(circle at 35% 30%,#fff3c4,#e2b95a 45%,#8a6420 100%); border:1px solid #7d5416 }
#dock-root .cmp-yrbox #cmp-yr{ color:var(--tan-gilt) }
#dock-root .cmp-sync input{ accent-color:#a8352c }
@media (min-width:1024px){
body #focusbar{ flex-wrap:nowrap; max-width:none; overflow:visible;
background:linear-gradient(180deg, rgba(58,33,21,.46), rgba(33,19,12,.40));
box-shadow:inset 0 1px 0 rgba(255,220,170,.18), 0 0 0 1px rgba(110,75,28,.75), 0 6px 16px rgba(0,0,0,.28); }
body #focusbar button{ flex:0 0 auto; white-space:nowrap }
}
body.tl-ruler #rul-lab .rl.up{ top:-14px; line-height:12px; font-size:10.5px; color:#3a2610; text-shadow:none; background:rgba(255,245,215,.85); padding:0 3px; border-radius:3px }
body.tl-ruler #rul-lab .rl.up::after{ content:""; position:absolute; left:var(--cx,50%); top:100%; width:1px; height:5px; background:#543717 }
body.lay3 #app{
grid-template-columns:minmax(0,1fr) clamp(300px,22vw,350px);
grid-template-rows:56px 44px minmax(0,1fr) auto;
gap:10px 10px; padding:10px;
}
body.lay3 #topbar{ grid-column:1/3; grid-row:1; display:flex; align-items:center; gap:14px; padding:0 14px; min-width:0;
background:var(--sk-beam, var(--panel)); border:1px solid var(--border, var(--line)); border-radius:12px; position:relative }
body.lay3 #topbar #brandline{ display:flex; align-items:center; gap:10px; margin:0; padding:0; flex:0 0 auto; min-width:0; max-width:34% }
body.lay3 #topnav{ display:flex; align-items:stretch; gap:8px; margin:0 auto; height:40px }
body.lay3 #topnav .primary-tool{ min-height:0; height:40px; flex-direction:row; gap:8px; padding:0 16px; border-radius:8px; min-width:0;
font-size:var(--fs-sm); letter-spacing:.08em }
body.lay3 #topnav .primary-tool .fi{ display:flex } body.lay3 #topnav .primary-tool .fi svg{ width:18px; height:18px }
body.lay3 #topnav .primary-tool .fl{ white-space:nowrap }
body.lay3 #topnav .primary-tool .tool-badge{ position:static; transform:none; margin-left:4px }
body.lay3 #topnav .primary-tool{ position:relative }
body.lay3 #topnav .primary-tool .pro-dot{ position:absolute; top:7px; left:31px; right:auto; width:8px; height:8px; font-size:0; line-height:0; overflow:hidden;
border-radius:50%; background:var(--accent); box-shadow:0 0 0 1.5px rgba(0,0,0,.45) }
body.lay3 #topnav .primary-tool::after{ inset:2px }
body.lay3 #topnav #morebtn2.on{ filter:brightness(1.12) }
body.lay3 #morepop{ position:fixed; z-index:60; width:min(600px, 92vw); padding:10px; border-radius:14px;
background:var(--sk-frame, var(--panel)); border:1px solid var(--border); box-shadow:0 20px 50px rgba(0,0,0,.5) }
body.lay3 #morepop[hidden]{ display:none }
body.lay3 #morepop #featurebar{ display:grid; grid-template-columns:repeat(5,1fr); margin:0 }
body.lay3 #topnav .primary-tool.nav-settings{ padding:0 12px }
body.lay3 #topnav .primary-tool.nav-settings .fl{ display:none }
body.lay3 #topnav .primary-tool.nav-settings .fi svg{ width:20px; height:20px }
body.lay3 #regtabs{ grid-column:1; grid-row:2; display:flex; align-items:center; min-width:0; overflow:hidden }
body.lay3 #regtabs #focusbar{ position:static; max-width:none; width:100%; justify-content:flex-start; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none;
border-radius:10px; padding:5px 8px }
body.lay3 #regtabs #focusbar::-webkit-scrollbar{ display:none }
body.lay3 #regtabs #focusbar button{ flex:0 0 auto }
body.lay3 #map-wrap{ grid-column:1; grid-row:3 }
body.lay3 #side{ grid-column:2; grid-row:2/4; display:flex; flex-direction:column; min-height:0; overflow:hidden; gap:8px }
body.lay3 #side > h1{ display:none }
body.lay3 #side #acctbar{ display:none }
body.lay3 #side #slicehost{ flex:1 1 auto; min-height:0 }
body.lay3 #controls{ grid-column:1/3; grid-row:4 }
body.lay3 #topbar #brandline #acctchip{ margin-left:auto }
body.lay3 #topbar::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2px; border-radius:0 0 12px 12px;
background:linear-gradient(90deg,transparent,var(--accent) 10%,var(--sk-gilt,var(--accent)) 50%,var(--accent) 90%,transparent); opacity:.85 }
@media (max-width:1280px){
body.lay3 #topbar #brandline{ max-width:26% }
body.lay3 #topnav .primary-tool{ padding:0 10px; letter-spacing:.02em }
}
body.lay3 #side #slicehost{ min-height:140px }
#tp-chaps{ display:none }
#tp-exit{ display:none }
body.lay3.story-on #app{ grid-template-columns:150px minmax(0,1fr); grid-template-rows:56px 44px minmax(0,1fr) 150px auto }
body.lay3.story-on #side{ display:none }
body.lay3.story-on #regtabs{ grid-column:2; grid-row:2 }
body.lay3.story-on #map-wrap{ grid-column:2; grid-row:3 }
body.lay3.story-on #controls{ grid-column:1/3; grid-row:5 }
body.lay3.story-on #tourplayer{ display:contents }
body.lay3.story-on #tp-chaps{ display:flex; flex-direction:column; grid-column:1; grid-row:2/5; min-height:0; border-radius:12px;
background:var(--sk-frame, var(--panel)); border:1px solid var(--border, var(--line)) }
body.lay3.story-on #tp-chaps .tpc-head{ padding:12px 12px 8px; flex:0 0 auto }
body.lay3.story-on #tp-chaps .tpc-head b{ display:block; font-size:var(--fs-h2); color:var(--sk-gilt, var(--accent)); letter-spacing:.06em }
body.lay3.story-on #tp-chaps .tpc-head span{ font-size:var(--fs-xs); color:var(--muted) }
body.lay3.story-on #tp-chaps .tpc-list{ flex:1; min-height:0; overflow-y:auto; scrollbar-width:none; padding:2px 8px 10px 18px; position:relative; display:flex; flex-direction:column; gap:10px }
body.lay3.story-on #tp-chaps .tpc-list::-webkit-scrollbar{ display:none }
body.lay3.story-on .tpc{ position:relative; display:flex; flex-direction:column; text-align:left; padding:0; border-radius:10px; overflow:visible; cursor:pointer; font-family:inherit; flex:0 0 auto;
background:var(--sk-card, var(--panel2)); border:1px solid var(--sk-card-border, var(--line)); color:var(--ink) }
body.lay3.story-on .tpc::before{ content:""; position:absolute; left:-15px; top:50%; width:7px; height:7px; border-radius:50%; background:var(--muted); transform:translate(-50%,-50%) }
body.lay3.story-on .tpc::after{ content:""; position:absolute; left:-12px; top:-11px; bottom:-11px; width:1px; background:var(--line); z-index:-1 }
body.lay3.story-on .tpc.on{ border-color:var(--accent); box-shadow:0 0 0 1px var(--accent), 0 8px 20px rgba(0,0,0,.35) }
body.lay3.story-on .tpc.on::before{ background:var(--accent); box-shadow:0 0 0 3px rgba(240,207,122,.25) }
body.lay3.story-on .tpc .tpc-th{ display:grid; place-items:center; height:82px; border-radius:9px 9px 0 0; background:var(--panel2) center/cover no-repeat; overflow:hidden }
body.lay3.story-on .tpc .tpc-th i{ font-style:normal; font-size:22px; font-weight:900; color:var(--sk-gilt, var(--accent)); opacity:.55 }
body.lay3.story-on .tpc .tpc-th i::before{ content:'第 '; font-size:11px; font-weight:700 } body.lay3.story-on .tpc .tpc-th i::after{ content:' 幕'; font-size:11px; font-weight:700 }
body.lay3.story-on .tpc .tpc-y{ padding:6px 8px 0; font-size:16px; font-weight:900; color:var(--sk-gilt, var(--accent)); line-height:1.1 }
body.lay3.story-on .tpc .tpc-t{ padding:2px 8px 8px; font-size:var(--fs-xs); color:var(--ink); line-height:1.3 }
body.lay3.story-on .tp-card{ grid-column:2; grid-row:4; position:static; display:grid; grid-template-columns:270px minmax(0,1fr) 190px; grid-template-rows:auto 1fr; gap:0 16px; align-items:stretch;
padding:10px 14px 10px 12px; border-radius:12px; overflow:hidden; min-height:0;
background:var(--sk-frame, var(--panel)); border:1px solid var(--border, var(--line)) }
body.lay3.story-on .tp-card .tp-top{ grid-column:1/4; grid-row:1; padding:0 0 6px; border-bottom:none; font-size:var(--fs-xs); color:var(--muted); background:none }
body.lay3.story-on .tp-card .tp-top::after{ display:none }
body.lay3.story-on .tp-card .tp-top #tp-close{ display:inline-flex; align-items:center; gap:4px; min-height:26px; padding:2px 10px; font-size:var(--fs-xs); border-radius:8px }
body.lay3.story-on .tp-card .tp-top #tp-close::before{ content:"⏏ 退出导览" }
body.lay3.story-on .tp-card .tp-top #tp-close{ font-size:0 } body.lay3.story-on .tp-card .tp-top #tp-close::before{ font-size:var(--fs-xs) }
body.lay3.story-on .tp-card .tp-body{ display:contents }
body.lay3.story-on .tp-card #tp-fig{ grid-column:1; grid-row:2; aspect-ratio:auto; height:100%; min-height:0; border-radius:8px }
body.lay3.story-on .tp-card #tp-fig[hidden]{ display:grid; place-items:center; background:var(--panel2); border:1px dashed var(--line); color:var(--muted); font-size:var(--fs-xs) }
body.lay3.story-on .tp-card #tp-fig[hidden]::before{ content:"这一幕还没有插画" }
body.lay3.story-on .tp-card .tp-main{ grid-column:2; grid-row:2; min-width:0; overflow:hidden }
body.lay3.story-on .tp-card #tp-step{ font-size:22px; font-weight:900; color:var(--sk-gilt, var(--accent)); letter-spacing:.02em; margin:0 0 4px; line-height:1.2 }
body.lay3.story-on .tp-card #tp-step .tp-yr{ color:var(--sk-gilt, var(--accent)); margin-right:8px }
body.lay3.story-on .tp-card #tp-text{ font-size:var(--fs-body); line-height:1.65; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden }
body.lay3.story-on .tp-card .tp-ctrl{ grid-column:3; grid-row:2; display:grid; grid-template-columns:1fr 1fr; gap:6px; align-content:end; padding:0; border-top:none }
body.lay3.story-on .tp-card .tp-ctrl #tp-dots{ grid-column:1/3; justify-content:flex-end; margin-bottom:2px }
body.lay3.story-on .tp-card .tp-ctrl #tp-next{ grid-column:1/3 }
body.lay3.story-on .tp-card .tp-ctrl #tp-exit{ display:none }
body.lay3.story-on .tp-card .tp-ctrl .btn{ min-height:34px; padding:6px 8px; font-size:var(--fs-xs); justify-content:center }
@media (max-height:760px){ body.lay3.story-on #app{ grid-template-rows:56px 44px minmax(0,1fr) 128px auto } body.lay3.story-on .tp-card #tp-text{ -webkit-line-clamp:2 } }
#dock-root .cmp-ruler.muted,.cmp-ruler.muted{color:var(--muted);font-weight:500}
.sl-king.figure, html[data-skin] .sl-king.figure{ color:var(--muted) !important; opacity:1 }
.sl-king.figure i{ font-style:normal; font-size:.86em; opacity:.85; margin-right:1px }
html .node .king.fig{ fill:#bdb3a3 !important }
html[data-skin="paper"] .node .king.fig{ fill:#7d7264 !important }
.fc-photo-cr{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff;text-decoration:none;font-size:10.5px}
.fc-photo-cr:hover{text-decoration:underline}
.fc-port{position:relative}
body.lay3 #segbar.segtabs{ gap:4px; align-items:stretch }
body.lay3 #segbar.segtabs button[data-m]{ flex:1 1 0; min-width:0; min-height:34px; padding:6px 6px; border-radius:8px;
font-size:13.5px; font-weight:700; letter-spacing:.04em; white-space:nowrap; color:var(--muted); background:transparent; border:1px solid transparent }
body.lay3 #segbar.segtabs button[data-m] > span{ overflow:hidden; text-overflow:ellipsis }
body.lay3 #segbar.segtabs button[data-m]:hover:not(.on){ color:var(--ink); background:rgba(255,255,255,.06) }
body.lay3 #segbar.segtabs button[data-m].on{ background:var(--accent); color:var(--on-accent,#241a02); border-color:rgba(0,0,0,.25);
box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 1px 2px rgba(0,0,0,.35) }
body.lay3 #segbar.segtabs .segn{ font-style:normal; font-size:11px; font-weight:800; min-width:18px; padding:1px 5px; border-radius:9px;
background:rgba(0,0,0,.28); color:inherit; line-height:15px }
body.lay3 #segbar.segtabs .segn:empty{ display:none }
body.lay3 #segbar.segtabs button.on .segn{ background:rgba(0,0,0,.18) }
body.lay3 #side #yearev{ flex:1 1 auto; min-height:140px; overflow-y:auto; overscroll-behavior:contain; padding:0 4px 8px 2px }
#yearev::-webkit-scrollbar{ width:7px }
#yearev::-webkit-scrollbar-thumb{ background:rgba(128,110,80,.45); border-radius:4px }
#yearev .ye-sub{ font-size:12px; color:var(--muted); padding:4px 6px 6px; letter-spacing:.04em }
#yearev .ye-empty{ font-size:13px; color:var(--muted); padding:18px 8px; text-align:center }
#yearev .ye-row{ display:flex; gap:10px; width:100%; text-align:left; padding:9px 6px; border:none; border-bottom:1px solid var(--line);
background:none; color:var(--ink); cursor:pointer; border-radius:6px; font:inherit }
#yearev .ye-row:hover{ background:rgba(255,255,255,.05) }
#yearev .ye-row .y{ flex:0 0 52px; font-size:13px; font-weight:800; color:var(--accent); font-variant-numeric:tabular-nums; padding-top:1px }
#yearev .ye-row.hot .y::after{ content:"此刻"; display:block; width:max-content; margin-top:4px; font-size:10.5px; font-weight:700;
padding:0 5px; border-radius:6px; background:var(--accent); color:var(--on-accent,#241a02) }
#yearev .ye-row .d{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px }
#yearev .ye-row .d b{ font-size:14px; line-height:1.35 }
#yearev .ye-row .d small{ font-size:12.5px; line-height:1.5; color:var(--muted); display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden }
#yearev .ye-row .d i{ font-style:normal; font-size:11.5px; color:var(--muted); opacity:.8 }
body.lay3.story-on .tp-card:has(#tp-fig[hidden]){ grid-template-columns:minmax(0,1fr) 190px }
body.lay3.story-on .tp-card:has(#tp-fig[hidden]) #tp-fig{ display:none }
body.lay3.story-on .tp-card:has(#tp-fig[hidden]) .tp-top{ grid-column:1/3 }
body.lay3.story-on .tp-card:has(#tp-fig[hidden]) .tp-main{ grid-column:1 }
body.lay3.story-on .tp-card:has(#tp-fig[hidden]) .tp-ctrl{ grid-column:2 }
body.lay3 #segbar.segtabs button[data-m]{ letter-spacing:.02em; gap:5px }
@media (max-width:1599px){ body.lay3 #segbar.segtabs button[data-m] > svg, body.lay3 #segbar.segtabs button[data-m] > .ic{ display:none } }
#figcard{ --fc2-paper:linear-gradient(180deg,#fbf3df,#f1e4c3); --fc2-ink:#3a2612; --fc2-mute:#7a6244; --fc2-line:rgba(110,75,28,.22); --fc2-seal:#a8352c }
html[data-skin="navy"] #figcard, html[data-skin="obsidian"] #figcard{ --fc2-paper:var(--panel2); --fc2-ink:var(--ink); --fc2-mute:var(--muted); --fc2-line:var(--line); --fc2-seal:var(--accent) }
html[data-skin="paper"] #figcard{ --fc2-paper:#fffaf0; --fc2-ink:#2b1d0e; --fc2-mute:#7a6244; --fc2-line:rgba(110,75,28,.2) }
.fc-box.fc2{ width:min(88vw,1200px); height:88vh; max-height:92dvh }
:where(#figcard .fc2) button{ font:inherit; color:inherit; cursor:pointer; text-align:left }
#figcard .fc2 button:not(.btn):not(.fc-close){ background:none; border:none; padding:0; min-height:0; min-width:0; box-shadow:none; letter-spacing:normal }
.fc2 .btn{ padding:9px 16px }
.fc2-hero{ position:relative; display:grid; grid-template-columns:168px minmax(0,1fr) 232px; grid-template-areas:'port id map' 'port acts map'; column-gap:22px; row-gap:0; align-items:start; padding:30px 70px 18px 26px; overflow:hidden;
background:radial-gradient(120% 140% at 0% 0%, color-mix(in srgb, var(--hue) 26%, transparent) 0%, transparent 60%), var(--sk-beam, var(--panel)); border-bottom:1px solid var(--line); flex:0 0 auto }
.fc2-wm{ position:absolute; right:240px; top:-44px; font:900 240px/1 "Noto Serif CJK SC","Songti SC","STSong","SimSun",serif; color:var(--hue); opacity:.09; pointer-events:none; user-select:none }
.fc2-back{ position:absolute; left:26px; top:8px; font-size:12.5px !important; color:var(--muted) !important }
.fc2-back:hover{ color:var(--ink) !important }
.fc2 .fc-close{ position:absolute; right:14px; top:12px; z-index:2; display:grid; place-items:center; width:36px; height:36px; border-radius:10px; background:var(--panel2); border:1px solid var(--line); color:var(--muted) }
.fc2-port{ grid-area:port; width:168px; height:168px; aspect-ratio:1/1; border-radius:14px; position:relative; z-index:1 }
.fc2-id{ grid-area:id; min-width:0; position:relative; z-index:1 }
.fc2-meta{ display:flex; flex-wrap:wrap; gap:6px; font-size:12px; color:var(--muted); margin-bottom:6px }
.fc2-meta span{ padding:2px 9px; border-radius:20px; border:1px solid var(--line); background:rgba(0,0,0,.18) }
.fc2-name{ margin:0; font:900 clamp(26px,2.6vw,38px)/1.15 "Noto Serif CJK SC","Songti SC","STSong","SimSun",serif; color:var(--sk-gilt, var(--accent)); letter-spacing:.06em }
.fc2-name small{ margin-left:12px; font:600 14px/1 var(--font, sans-serif); letter-spacing:.02em; color:var(--muted) }
.fc2-role{ margin-top:7px; font-weight:800; font-size:14.5px }
.fc2-role .pl{ margin-left:12px; font-weight:500; color:var(--muted); font-size:13px }
.fc2-lead{ margin:9px 0 0; font-size:15.5px; line-height:1.65; color:var(--ink); max-width:62ch }
.fc2-tags{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px }
.fc2-tags span{ font-size:12px; padding:2px 10px; border-radius:20px; color:var(--ink); background:color-mix(in srgb, var(--hue) 22%, transparent); border:1px solid color-mix(in srgb, var(--hue) 55%, transparent) }
.fc2-tags span::before{ content:"#"; opacity:.6; margin-right:2px }
.fc2-acts{ grid-area:acts; display:flex; gap:8px; margin-top:14px; flex-wrap:wrap; position:relative; z-index:1 }
.fc2-acts .btn{ white-space:nowrap }
.fc2-map{ grid-area:map; position:relative; z-index:1; width:232px; height:136px; border-radius:12px; overflow:hidden; background-repeat:no-repeat; background-color:#0d1626;
box-shadow:0 0 0 1px #000, 0 0 0 3px var(--sk-card-border, var(--line)), 0 8px 18px rgba(0,0,0,.45) !important; background-color:#0d1626 !important }
.fc2-map .pin{ position:absolute; left:50%; top:50%; width:12px; height:12px; margin:-6px 0 0 -6px; border-radius:50%; background:#ffd36b; box-shadow:0 0 0 2px #000, 0 0 0 0 rgba(255,211,107,.7); animation:fc2pin 1.8s ease-out infinite }
@keyframes fc2pin{ 0%{ box-shadow:0 0 0 2px #000, 0 0 0 0 rgba(255,211,107,.7) } 100%{ box-shadow:0 0 0 2px #000, 0 0 0 18px rgba(255,211,107,0) } }
.fc2-map .lab{ position:absolute; left:0; right:0; bottom:0; padding:4px 8px; font-size:11px; color:#f3e6c8; background:linear-gradient(0deg,rgba(0,0,0,.75),transparent); white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.fc2-scroll{ flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:0 26px 28px }
.fc2-life{ margin:16px 0 4px }
.fc2-life .lh{ display:flex; justify-content:space-between; align-items:baseline; font-size:13px; color:var(--muted); margin-bottom:6px }
.fc2-life .lh em{ font-style:normal; margin-right:5px; font-size:11px; padding:0 5px; border-radius:4px; background:var(--sk-seal, var(--accent)); color:var(--sk-seal-ink, #fff) }
.fc2-life .lh b{ color:var(--ink); font-size:14px }
.fc2-life .track{ position:relative; height:28px; border-radius:7px; background:rgba(0,0,0,.28); box-shadow:inset 0 1px 3px rgba(0,0,0,.5) }
.fc2-life .band{ position:absolute; top:0; bottom:0; display:flex; align-items:center; padding-left:8px; font-size:11.5px; color:var(--ink); white-space:nowrap; overflow:hidden; border-right:1px solid rgba(0,0,0,.35) }
.fc2-life .band.b0{ background:rgba(232,196,106,.18) } .fc2-life .band.b1{ background:rgba(232,196,106,.30) } .fc2-life .band.b2{ background:rgba(232,196,106,.10) }
.fc2-life .dot{ position:absolute; top:50%; width:11px; height:11px; margin:-5.5px 0 0 -5.5px; border-radius:50%; background:var(--panel, #1b120b) !important; border:2px solid var(--sk-gilt, var(--accent)) !important; z-index:1 }
.fc2-life .dot:hover{ transform:scale(1.35); background:var(--sk-gilt, var(--accent)) !important }
.fc2-life .star{ position:absolute; top:-12px; transform:translateX(-50%); color:var(--sk-gilt, var(--accent)); font-size:16px; text-shadow:0 1px 2px #000; z-index:2 }
.fc2-life .lf{ display:flex; justify-content:space-between; gap:10px; font-size:11.5px; color:var(--muted); margin-top:5px }
.fc2-body{ display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:22px; margin-top:16px; align-items:start }
.fc2-main{ background:var(--fc2-paper); color:var(--fc2-ink); border-radius:14px; padding:22px 26px 18px; box-shadow:0 0 0 1px var(--fc2-line), 0 10px 26px rgba(0,0,0,.35) }
.fc2-sec + .fc2-sec, .fc2-fact + .fc2-sec{ margin-top:22px }
.fc2-sec h3{ margin:0 0 12px; font:900 18px/1.3 "Noto Serif CJK SC","Songti SC","STSong","SimSun",serif; color:var(--fc2-ink); display:flex; align-items:center; gap:8px; letter-spacing:.08em }
.fc2-sec h3::before{ content:""; width:6px; height:18px; border-radius:2px; background:var(--fc2-seal) }
.fc2-sec h3 .small{ font:400 12px/1 var(--font, sans-serif); color:var(--fc2-mute); letter-spacing:0 }
.fc2-ch{ display:grid; grid-template-columns:40px minmax(0,1fr); gap:12px; padding:10px 0; border-top:1px dashed var(--fc2-line) }
.fc2-ch:first-of-type{ border-top:none; padding-top:2px }
.fc2-ch .no{ width:34px; height:34px; border-radius:50%; display:grid; place-items:center; font:900 16px/1 "Noto Serif CJK SC","Songti SC",serif; color:var(--sk-seal-ink, #fff); background:var(--fc2-seal); box-shadow:inset 0 0 0 2px rgba(255,255,255,.25) }
.fc2-ch h5{ margin:4px 0 4px; font-size:15.5px; font-weight:900 }
.fc2-ch p{ margin:0; font-size:15px; line-height:1.9 }
.fc2-legacy{ margin:0; font-size:15px; line-height:1.9 }
.fc2-works{ margin-top:12px }
.fc2-works ul{ list-style:none; margin:6px 0 0; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:6px }
.fc2-works li{ font-size:14px; padding:6px 10px 6px 26px; position:relative; border-radius:8px; background:rgba(110,75,28,.08); border:1px solid var(--fc2-line) }
.fc2-works li::before{ content:"◆"; position:absolute; left:9px; top:6px; font-size:10px; color:var(--fc2-seal) }
.fc2-sub{ font-size:12px; color:var(--fc2-mute, var(--muted)); letter-spacing:.06em; margin:2px 0 6px }
.fc2-fact{ margin-top:20px; padding:12px 16px; border-radius:10px; border-left:4px solid var(--fc2-seal); background:rgba(168,53,44,.07) }
.fc2-fact b{ font-size:13px; color:var(--fc2-seal); letter-spacing:.1em }
.fc2-fact p{ margin:4px 0 0; font-size:14.5px; line-height:1.75 }
.fc2-chron{ border-left-color:var(--fc2-line) !important }
.fc2-chron li{ display:grid !important; grid-template-columns:70px minmax(0,1fr) auto; align-items:baseline }
.fc2-chron li::before{ background:var(--fc2-seal) !important; border-color:var(--fc2-paper, #fff) !important }
.fc2-chron li:hover{ background:rgba(110,75,28,.10) !important }
.fc2-chron .fc-cy{ color:var(--fc2-seal) !important }
.fc2-chron .fc-ct{ color:var(--fc2-ink) }
.fc2-chron .fc-age{ font-size:12px; color:var(--fc2-mute); padding-left:10px; white-space:nowrap }
.fc2-chron li.key .fc-ct{ font-weight:900 }
.fc2-chron li.key .fc-cy::after{ content:" ★" }
.fc2-side{ display:flex; flex-direction:column; gap:12px; min-width:0 }
.fc2-card{ background:var(--sk-card, var(--panel2)); border:1px solid var(--sk-card-border, var(--line)); border-radius:12px; padding:12px 14px }
.fc2-card h4{ margin:0 0 9px; font:900 14.5px/1.3 "Noto Serif CJK SC","Songti SC","STSong","SimSun",serif; color:var(--sk-gilt, var(--accent)); letter-spacing:.06em }
.fc2-card .fc2-sub{ color:var(--muted) }
.fc2-wr{ display:grid !important; grid-template-columns:64px minmax(0,1fr); grid-template-rows:auto auto; column-gap:8px; width:100%; padding:6px 4px !important; border-radius:7px; border-top:1px solid var(--line) !important; font-size:14px }
.fc2-wr:first-of-type{ border-top:none !important }
.fc2-wr:hover, .fc2-we:hover, .fc2-pc:hover, .fc2-ri:hover{ background:rgba(255,255,255,.06) !important }
.fc2-wr .rg{ grid-row:1/3; font-size:12px; color:var(--muted); padding-top:2px }
.fc2-wr b{ font-size:14px } .fc2-wr i{ font-style:normal; font-size:12px; color:var(--muted) }
.fc2-wes{ margin-top:8px; padding-top:8px; border-top:1px dashed var(--line); display:flex; flex-direction:column; gap:2px }
.fc2-we{ display:flex !important; gap:8px; font-size:13px; padding:4px !important; border-radius:6px }
.fc2-we span{ flex:0 0 auto; color:var(--sk-gilt, var(--accent)); font-weight:800; font-size:12px; padding-top:1px }
.fc2-pcs{ display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-bottom:6px }
.fc2-pc{ display:flex !important; align-items:center; gap:8px; padding:5px 6px !important; border-radius:8px; min-width:0; border:1px solid var(--line) !important; background:rgba(0,0,0,.12) !important }
.fc2-pc .sl{ flex:0 0 28px; height:28px; border-radius:50%; display:grid; place-items:center; font:900 14px/1 "Noto Serif CJK SC","Songti SC",serif; background:var(--sk-seal, var(--accent)); color:var(--sk-seal-ink, #fff) }
.fc2-pc .tx{ min-width:0; display:flex; flex-direction:column }
.fc2-pc b{ font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.fc2-pc small{ font-size:11px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.fc2-ri{ display:flex !important; align-items:center; gap:8px; width:100%; padding:6px 4px !important; border-radius:7px; font-size:13.5px }
.fc2-ri b{ flex:1; min-width:0; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.fc2-ri i{ font-style:normal; font-size:11.5px; color:var(--muted) }
@media (max-width:1023px){
.fc-box.fc2{ width:94vw; height:88dvh; overflow-y:auto }
.fc2-scroll{ overflow:visible; padding:0 14px 22px }
.fc2-hero{ grid-template-columns:96px minmax(0,1fr); grid-template-areas:'port id' 'acts acts' 'map map'; column-gap:14px; padding:40px 14px 14px }
.fc2-meta{ padding-right:34px }
.fc2-port{ width:96px; height:96px }
.fc2-map{ width:100%; height:120px; margin-top:12px }
.fc2-wm{ right:-10px; top:-20px; font-size:150px }
.fc2-acts .btn{ flex:1; justify-content:center }
.fc2-lead{ font-size:14.5px }
.fc2-body{ grid-template-columns:1fr }
.fc2-main{ padding:16px 16px 12px }
.fc2-ch{ grid-template-columns:30px minmax(0,1fr); gap:10px } .fc2-ch .no{ width:28px; height:28px; font-size:14px }
}
body.m2 #figcard .fc-box.fc2{ height:calc(88dvh - var(--m2-nav, 0px)) }
html[data-skin="paper"] .fc2-life .track{ background:rgba(110,75,28,.10); box-shadow:inset 0 1px 2px rgba(110,75,28,.25) } html[data-skin="paper"] .fc2-life .band{ color:#3a2612 } html[data-skin="paper"] .fc2-life .dot{ background:#fffaf0 !important }
.fc2 .fc2-ic{ width:1em; height:1em; flex:0 0 auto; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; vertical-align:-.14em }
.fc2-pf{ grid-area:port; position:relative; width:168px; height:168px; z-index:1 }
.fc2-pf .fc2-port{ grid-area:auto; width:100%; height:100% }
.fc2-pf::before{ content:""; position:absolute; inset:-7px; border-radius:18px; border:1px solid color-mix(in srgb, var(--sk-gilt, var(--accent)) 55%, transparent); pointer-events:none }
.fc2-cn{ position:absolute; width:30px; height:30px; z-index:3; color:var(--sk-gilt, var(--accent)); pointer-events:none; filter:drop-shadow(0 1px 1px rgba(0,0,0,.6)) }
.fc2-cn svg{ width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.6 }
.fc2-cn svg circle{ fill:currentColor; stroke:none }
.fc2-cn.tl{ left:-11px; top:-11px } .fc2-cn.tr{ right:-11px; top:-11px; transform:scaleX(-1) }
.fc2-cn.bl{ left:-11px; bottom:-11px; transform:scaleY(-1) } .fc2-cn.br{ right:-11px; bottom:-11px; transform:scale(-1,-1) }
.fc2-name{ display:flex; align-items:center; flex-wrap:wrap; column-gap:12px; row-gap:4px }
.fc2-name small{ margin-left:0 }
.fc2-stamp{ display:inline-grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; grid-auto-flow:column; direction:rtl; width:42px; height:42px; padding:3px; gap:0; box-sizing:border-box;
background:#b3261e; color:#fbe9d8; border-radius:4px; transform:rotate(-5deg); box-shadow:inset 0 0 0 2px #b3261e, inset 0 0 0 3.5px rgba(251,233,216,.85), 0 2px 6px rgba(0,0,0,.35);
opacity:.92; flex:0 0 auto; position:relative; top:1px }
.fc2-stamp i{ direction:ltr; font:900 15px/17px "Noto Serif CJK SC","Songti SC","STSong","SimSun",serif; font-style:normal; text-align:center; letter-spacing:0 }
.fc2-stamp::after{ content:""; position:absolute; inset:0; border-radius:4px; pointer-events:none;
background:radial-gradient(circle at 20% 30%, rgba(255,255,255,.18) 0 1.5px, transparent 2px), radial-gradient(circle at 72% 64%, rgba(255,255,255,.14) 0 1.2px, transparent 2px), radial-gradient(circle at 55% 12%, rgba(0,0,0,.18) 0 1px, transparent 1.6px) }
.fc2-role{ display:flex; align-items:center; flex-wrap:wrap; gap:4px 0 }
.fc2-role .fc2-badge{ display:inline-grid; place-items:center; width:26px; height:26px; margin-right:8px; border-radius:50%; font-size:15px;
color:#fff3d6; background:color-mix(in srgb, var(--hue) 75%, #000); box-shadow:0 0 0 1.5px var(--sk-gilt, var(--accent)) }
.fc2-role .fc2-badge .fc2-ic{ stroke-width:2 }
.fc2-hero{ border-bottom:none; padding-bottom:24px }
.fc2-hero::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:10px; opacity:.6; pointer-events:none;
background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--hue) 55%, var(--sk-gilt, #e8c46a)) 12%, color-mix(in srgb, var(--hue) 55%, var(--sk-gilt, #e8c46a)) 88%, transparent);
-webkit-mask:var(--orn) repeat-x 0 0/auto 10px; mask:var(--orn) repeat-x 0 0/auto 10px }
.fc2-hero[data-orn="cn"]{ --orn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='10'%3E%3Cpath d='M0 9h3V1h12v7H7V4h5' fill='none' stroke='%23000' stroke-width='1.4'/%3E%3Cpath d='M15 9h5' stroke='%23000' stroke-width='1.4'/%3E%3C/svg%3E") }
.fc2-hero[data-orn="classic"]{ --orn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10'%3E%3Cpath d='M0 9h10V1H4v5h3V4' fill='none' stroke='%23000' stroke-width='1.4'/%3E%3Cpath d='M10 9h6' stroke='%23000' stroke-width='1.4'/%3E%3C/svg%3E") }
.fc2-hero[data-orn="islam"]{ --orn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.1'%3E%3Crect x='3' y='2' width='6' height='6'/%3E%3Crect x='3' y='2' width='6' height='6' transform='rotate(45 6 5)'/%3E%3C/g%3E%3C/svg%3E") }
.fc2-hero[data-orn="india"]{ --orn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10'%3E%3Cpath d='M0 10Q6 -3 12 10Z' fill='%23000' fill-opacity='.85'/%3E%3Cpath d='M6 10Q6 4 6 4' stroke='%23fff'/%3E%3C/svg%3E") }
.fc2-hero[data-orn="eu"]{ --orn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='10'%3E%3Cg fill='%23000'%3E%3Ccircle cx='7' cy='3' r='2'/%3E%3Ccircle cx='7' cy='7' r='2'/%3E%3Ccircle cx='5' cy='5' r='2'/%3E%3Ccircle cx='9' cy='5' r='2'/%3E%3Cpath d='M0 5l1.5-1.5L3 5 1.5 6.5z'/%3E%3C/g%3E%3C/svg%3E") }
.fc2-hero[data-orn="step"]{ --orn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10'%3E%3Cpath d='M0 10V7h2V4h2V1h4v3h2v3h2v3z' fill='%23000'/%3E%3C/svg%3E") }
.fc2-stats{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; margin:16px 0 2px }
.fc2-stats .st{ position:relative; display:grid; grid-template-columns:auto minmax(0,1fr); grid-template-rows:auto auto; column-gap:9px; align-items:center; padding:9px 12px; border-radius:11px;
background:var(--sk-card, var(--panel2)); border:1px solid var(--sk-card-border, var(--line)); overflow:hidden }
.fc2-stats .st::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--sk-seal, var(--accent)); opacity:.75 }
.fc2-stats .fc2-ic{ grid-row:1/3; font-size:22px; color:var(--sk-gilt, var(--accent)); opacity:.9 }
.fc2-stats b{ font:900 19px/1.15 "Noto Serif CJK SC","Songti SC","STSong","SimSun",serif; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.fc2-stats b small{ font:600 11px/1 var(--font, sans-serif); color:var(--muted); margin-left:2px }
.fc2-stats span{ font-size:11.5px; color:var(--muted); letter-spacing:.06em; white-space:nowrap }
.fc2-life{ margin-bottom:18px }
.fc2-life .tk{ position:absolute; bottom:0; width:1px; height:6px; background:rgba(255,255,255,.28); pointer-events:none }
.fc2-life .tk.lb{ height:10px; background:rgba(255,255,255,.45) }
.fc2-life .tk em{ position:absolute; top:12px; left:50%; transform:translateX(-50%); font:600 10px/1 var(--font, sans-serif); font-style:normal; color:var(--muted); white-space:nowrap }
.fc2-life .tk em::after{ content:"岁" }
.fc2-life .lf{ margin-top:16px }
html[data-skin="paper"] .fc2-life .tk{ background:rgba(110,75,28,.35) }
.fc2-main{ position:relative; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .25 0 0 0 0 .12 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E"), var(--fc2-paper) }
.fc2-sec h3::before{ width:10px; height:10px; border-radius:1px; transform:rotate(45deg); box-shadow:0 0 0 2px var(--fc2-paper-solid, transparent), 0 0 0 3px var(--fc2-seal) }
.fc2-sec h3::after{ content:""; flex:1; height:1px; margin-left:6px; background:linear-gradient(90deg, var(--fc2-line), transparent) }
.fc2-ch p .dc{ float:left; font:900 2.6em/1 "Noto Serif CJK SC","Songti SC","STSong","SimSun",serif; color:var(--fc2-seal); margin:.1em .16em 0 0 }
blockquote.fc2-legacy{ position:relative; margin:0; padding:10px 18px 10px 30px; border-radius:10px; background:rgba(110,75,28,.06); font-family:"Noto Serif CJK SC","Songti SC","STSong","SimSun",serif }
blockquote.fc2-legacy .q1, blockquote.fc2-legacy .q2{ color:var(--fc2-seal); font-weight:900; opacity:.7 }
blockquote.fc2-legacy .q1{ position:absolute; left:8px; top:4px; font-size:26px; line-height:1 }
blockquote.fc2-legacy .q2{ font-size:18px; margin-left:2px }
.fc2-works li{ display:flex; align-items:center; gap:8px; padding:7px 10px }
.fc2-works li::before{ display:none }
.fc2-works li .fc2-ic{ font-size:17px; color:var(--fc2-seal) }
.fc2-fact{ display:flex; gap:12px; align-items:flex-start }
.fc2-fact .bulb{ flex:0 0 32px; height:32px; border-radius:50%; display:grid; place-items:center; font-size:18px; color:var(--sk-seal-ink, #fff); background:var(--fc2-seal) }
.fc2-chron{ border-left:none !important; padding-left:0 !important }
.fc2-chron li{ grid-template-columns:30px 64px minmax(0,1fr) auto !important; padding-left:4px !important; position:relative }
.fc2-chron li::before{ display:none !important }
.fc2-chron li::after{ content:""; position:absolute; left:18px; top:0; bottom:0; width:2px; background:var(--fc2-line); z-index:0 }
.fc2-chron li:first-child::after{ top:50% } .fc2-chron li:last-child::after{ bottom:50% }
.fc2-ci{ position:relative; z-index:1; width:26px; height:26px; border-radius:50%; display:grid; place-items:center; align-self:center; font-size:14px;
color:var(--fc2-seal); background:var(--fc2-paper); box-shadow:0 0 0 1.5px color-mix(in srgb, var(--fc2-seal) 60%, transparent) }
.fc2-chron li.key .fc2-ci{ color:var(--sk-seal-ink, #fff); background:var(--fc2-seal) }
.fc2-chron .fc-cy{ align-self:center }
.fc2-card h4{ display:flex; align-items:center; gap:7px }
.fc2-card h4 .fc2-ic{ font-size:16px; opacity:.85 }
.fc2-pc .sl{ background:var(--h, var(--sk-seal, var(--accent))) !important; box-shadow:0 0 0 1.5px rgba(0,0,0,.35), inset 0 0 0 1.5px rgba(255,255,255,.22) }
.fc2-pc .sl.im{ background-size:cover !important; background-position:center top !important; box-shadow:0 0 0 1.5px var(--h, var(--line)) }
@media (max-width:1023px){
.fc2-pf{ width:96px; height:96px }
.fc2-cn{ width:22px; height:22px } .fc2-cn.tl,.fc2-cn.bl{ left:-8px } .fc2-cn.tr,.fc2-cn.br{ right:-8px } .fc2-cn.tl,.fc2-cn.tr{ top:-8px } .fc2-cn.bl,.fc2-cn.br{ bottom:-8px }
.fc2-pf::before{ inset:-5px; border-radius:14px }
.fc2-stats{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; margin-top:12px }
.fc2-stats .st{ padding:7px 9px; column-gap:7px } .fc2-stats .fc2-ic{ font-size:18px } .fc2-stats b{ font-size:16px }
.fc2-stamp{ width:36px; height:36px } .fc2-stamp i{ font-size:13px; line-height:14px }
.fc2-chron li{ grid-template-columns:28px 56px minmax(0,1fr) auto !important }
.fc2-chron li::after{ left:17px }
}
#dock-root .dock-tabs{ display:none !important }
.dock-foot, .panel-foot{
position:sticky; bottom:-14px; z-index:3; display:flex; gap:8px;
margin:12px -12px -14px; padding:10px 12px calc(12px + env(safe-area-inset-bottom, 0px));
background:linear-gradient(to bottom, rgba(0,0,0,0), var(--panel) 34%);
}
.dock-foot .btn, .panel-foot .btn, .panel-foot .mini{ flex:1; min-height:42px; font-size:var(--fs-sm); font-weight:700 }
#dock-root .dock-foot{ background:linear-gradient(to bottom, rgba(0,0,0,0), rgba(20,12,7,.96) 34%) }
html[data-skin="paper"] #dock-root .dock-foot, html[data-skin="paper"] .panel-foot{ background:linear-gradient(to bottom, rgba(248,243,233,0), rgba(248,243,233,.97) 34%) }
html[data-skin="navy"] #dock-root .dock-foot{ background:linear-gradient(to bottom, rgba(0,0,0,0), rgba(17,26,48,.97) 34%) }
html[data-skin="obsidian"] #dock-root .dock-foot{ background:linear-gradient(to bottom, rgba(0,0,0,0), rgba(13,18,28,.97) 34%) }
.wchip.wchip-demo{ border-color:#c49b57; color:#e7c98b }
.wchip.wchip-demo b{ font-weight:800; margin-left:2px }
.wchip.wchip-demo.on{ background:linear-gradient(#c49b57,#9a7638); color:#2a1a0d; border-color:#e0c387 }
html[data-skin="paper"] .wchip.wchip-demo{ color:#7a4e26; border-color:#a67b4a }
html[data-skin="paper"] .wchip.wchip-demo.on{ background:linear-gradient(#9a6636,#7a4e26); color:#fff6e6 }
.wc-demo{ display:inline-block; margin-left:6px; padding:0 6px; border-radius:9px; font-size:var(--fs-micro); font-weight:800;
background:rgba(196,155,87,.18); color:#e0c387; border:1px solid rgba(224,195,135,.55); vertical-align:1px }
html[data-skin="paper"] .wc-demo{ background:#f3e6cf; color:#7a4e26; border-color:#c9a878 }
#searchres .sr-grp{ padding:6px 10px 3px; font-size:var(--fs-micro); font-weight:800; letter-spacing:.08em; color:var(--accent);
border-bottom:1px solid var(--line); background:rgba(0,0,0,.12); position:sticky; top:0; z-index:1 }
html[data-skin="paper"] #searchres .sr-grp{ background:#efe7d8; color:#7a4e26 }
html[data-skin="paper"] #searchres .sr:hover, html[data-skin="paper"] #searchres .sr.sel{ background:#f3e6cf }
html[data-skin="paper"] #searchres .sr .sy, html[data-skin="paper"] #searchres .sr .st em{ color:#8b5a2b }
html[data-skin="paper"] .prog-streak{ background:linear-gradient(160deg,#f3e6cf,#e9dcc4); border-color:#d6c3a0 }
html[data-skin="paper"] .prog-streak .ps-num{ color:#7a4e26 }
html[data-skin="paper"] .prog-streak .muted{ color:#6b5d4f }
html[data-skin="paper"] .legal-about{ background:linear-gradient(160deg,#f7efe0,#ede2cd) !important; border-color:#d6c3a0 !important }
html[data-skin="paper"] .legal-about .la-brand{ color:#6f4318 }
html[data-skin="paper"] .legal-about span, html[data-skin="paper"] .legal-about .muted{ color:#5c4f43 }
html[data-skin="paper"] .legal-about a.la-btn.ghost{ color:#4a3418; border-color:#a67b4a }
html[data-skin="paper"] .pro-tag{ color:#fff6e6; background:#8b5a2b }
html[data-skin="paper"] .wd-sim{ background:linear-gradient(#9a6636,#7a4e26) !important; color:#fff6e6 !important; border-color:#5e3a18 !important }
body.tl-ruler #rul-lab .rl.ovf, .rulm .rl.ovf{ text-shadow:0 1px 1px rgba(0,0,0,.65), 0 0 2px rgba(0,0,0,.45) }
body.m2 .sh-row .seal{ text-shadow:0 1px 1px rgba(0,0,0,.5) }
.panel-foot{ margin:14px -16px -14px; padding:10px 16px calc(12px + env(safe-area-inset-bottom, 0px)); bottom:-14px }
.qz{display:flex;flex-direction:column;gap:12px}
.qz-card{display:flex;gap:16px;align-items:center;padding:16px 18px;border-radius:16px;
background:radial-gradient(ellipse at 15% 30%,color-mix(in srgb,var(--c1) 30%,transparent),transparent 65%),linear-gradient(160deg,rgba(255,255,255,.05),rgba(0,0,0,.18));
border:1px solid color-mix(in srgb,var(--c1) 55%,transparent);box-shadow:0 10px 30px rgba(0,0,0,.25)}
.qz-medal{position:relative;flex:0 0 auto;display:inline-block}
.qz-medal svg,.qz-medal img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 6px 10px rgba(0,0,0,.35))}
.qz-medal img{opacity:0;transition:opacity .3s}
.qz-card-m{flex:1;min-width:0}
.qz-lv{font-size:var(--fs-micro);letter-spacing:.14em;font-weight:800;color:var(--c1,var(--accent))}
.qz-title{font-family:"Songti SC","STSong","Noto Serif SC",serif;font-size:26px;font-weight:900;line-height:1.2}
.qz-title.big{font-size:36px}
.qz-sub{font-size:var(--fs-sm);color:var(--muted)}
.qz-bar{height:8px;border-radius:5px;background:rgba(0,0,0,.25);margin-top:10px;overflow:hidden}
.qz-bar i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--c2),var(--c1));box-shadow:0 0 10px var(--c1)}
.qz-xp{font-size:var(--fs-micro);color:var(--muted);margin-top:5px}
.qz-stats,.qz-res{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.qz-res{grid-template-columns:repeat(4,1fr)}
.qz-stats div,.qz-res div{text-align:center;padding:10px 4px;border-radius:12px;background:rgba(127,127,127,.08);border:1px solid var(--line)}
.qz-stats b,.qz-res b{display:block;font-size:20px;font-weight:900;color:var(--accent);font-variant-numeric:tabular-nums}
.qz-stats span,.qz-res span{font-size:var(--fs-micro);color:var(--muted)}
.qz-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.qz-big{display:flex;flex-direction:column;gap:2px;padding:14px;border-radius:14px;text-align:left;cursor:pointer;border:1px solid var(--line);background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(0,0,0,.12));color:var(--ink);transition:transform .2s,border-color .2s}
.qz-big:hover:not(:disabled){transform:translateY(-2px);border-color:var(--accent)}
.qz-big b{font-size:16px}.qz-big span{font-size:var(--fs-micro);color:var(--muted)}
.qz-big.gold{background:linear-gradient(160deg,rgba(232,192,106,.28),rgba(184,135,47,.12));border-color:rgba(232,192,106,.6)}
.qz-big:disabled{opacity:.55;cursor:default}
.qz-h{font-weight:800;font-size:var(--fs-sm);color:var(--accent);letter-spacing:.1em;margin-top:4px}
.qz-modes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.qz-modes button{display:flex;flex-direction:column;align-items:flex-start;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:rgba(127,127,127,.06);color:var(--ink);cursor:pointer;text-align:left}
.qz-modes button:hover{border-color:var(--accent)}
.qz-modes b{font-size:15px}.qz-modes span{font-size:var(--fs-micro);color:var(--muted)}
.qz-row2{display:flex;flex-wrap:wrap;gap:8px}
.qz-row2 .btn{flex:1;min-width:130px;justify-content:center}
.qz-prog,.qz-timer{position:relative;height:8px;border-radius:5px;background:rgba(127,127,127,.18);overflow:hidden}
.qz-prog i,.qz-timer i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),#f7dc9c)}
.qz-timer{height:22px}
.qz-timer i{background:linear-gradient(90deg,#c4402f,#e8c06a);transition:width .2s linear}
.qz-timer span{position:absolute;right:8px;top:1px;font-weight:900;font-size:14px;color:#fff;text-shadow:0 1px 2px #000}
.qz-top{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.qz-tag{font-size:var(--fs-micro);padding:2px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}
.qz-score{margin-left:auto;font-size:var(--fs-sm);color:var(--muted)}.qz-score b{color:var(--accent);font-size:16px}
.qz-img{display:flex;justify-content:center}
.qz-img img{max-height:150px;border-radius:6px;box-shadow:0 6px 20px rgba(0,0,0,.35);background:#fff}
.qz-q{font-size:19px;font-weight:800;line-height:1.45}
.qz-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:640px){.qz-opts{grid-template-columns:1fr}.qz-row,.qz-modes{grid-template-columns:1fr 1fr}.qz-stats{grid-template-columns:repeat(3,1fr)}.qz-row .qz-big:first-child{grid-column:1 / -1}}
.qz-opt{display:flex;gap:10px;align-items:center;text-align:left;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:rgba(127,127,127,.06);color:var(--ink);font-size:15.5px;cursor:pointer;min-height:52px;transition:border-color .15s,background .15s,transform .15s}
.qz-opt:hover:not(:disabled){border-color:var(--accent);transform:translateY(-1px)}
.qz-opt i{flex:0 0 26px;height:26px;border-radius:7px;display:grid;place-items:center;font-style:normal;font-weight:900;font-size:13px;background:rgba(127,127,127,.15)}
.qz-opt.right{border-color:#4fb37a;background:rgba(79,179,122,.18)}.qz-opt.right i{background:#4fb37a;color:#fff}
.qz-opt.wrong{border-color:#d0574a;background:rgba(208,87,74,.16)}.qz-opt.wrong i{background:#d0574a;color:#fff}
.qz-exp{padding:12px 14px;border-radius:12px;border:1px solid var(--line)}
.qz-exp.ok{border-color:rgba(79,179,122,.6);background:rgba(79,179,122,.08)}.qz-exp.no{border-color:rgba(208,87,74,.55);background:rgba(208,87,74,.07)}
.qz-exp p{margin-top:6px;font-size:var(--fs-sm);color:var(--muted)}
.qz-links{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.qz-up{display:flex;gap:18px;align-items:center;justify-content:center;padding:18px;border-radius:16px;background:radial-gradient(ellipse at 30% 50%,color-mix(in srgb,var(--c1) 40%,transparent),transparent 70%);animation:qzpop .6s cubic-bezier(.2,.8,.3,1)}
@keyframes qzpop{from{transform:scale(.8);opacity:0}to{transform:none;opacity:1}}
.qz-levels{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media (max-width:640px){.qz-levels{grid-template-columns:repeat(2,1fr)}}
.qz-lvcard{display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;padding:12px 8px;border-radius:14px;border:1px solid color-mix(in srgb,var(--c1) 50%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--c1) 16%,transparent),transparent)}
.qz-lvcard b{font-family:"Songti SC","STSong","Noto Serif SC",serif;font-size:17px}
.qz-lvcard span{font-size:var(--fs-micro);color:var(--muted)}.qz-lvcard small{font-size:11.5px;color:var(--muted)}
.qz-lvcard.locked{filter:grayscale(1);opacity:.45}
.qz-lvcard.cur{box-shadow:0 0 0 2px var(--c1),0 10px 26px rgba(0,0,0,.3)}
.qz-achs{display:flex;flex-wrap:wrap;gap:8px}
.qz-ach{display:inline-flex;flex-direction:column;padding:8px 12px;border-radius:12px;border:1px dashed var(--line);font-weight:800;opacity:.5;font-size:14px}
.qz-ach small{font-weight:500;font-size:11.5px;color:var(--muted)}
.qz-ach.on{opacity:1;border-style:solid;border-color:var(--accent);background:rgba(232,192,106,.1)}
.qz-share{display:flex;justify-content:center}
.qz-share img{max-height:62vh;border-radius:12px;box-shadow:0 14px 40px rgba(0,0,0,.45)}
html[data-skin="paper"] .qz-stats b,html[data-skin="paper"] .qz-res b,html[data-skin="paper"] .qz-score b{color:#7a4e26}
body.m2 #m2-top .m2-tr{position:absolute;right:max(10px,env(safe-area-inset-right));top:calc(env(safe-area-inset-top,0px) + 10px);display:flex;gap:8px;align-items:center;z-index:3}
body.m2 #m2-top .m2-tr button{display:inline-flex;align-items:center;justify-content:center;gap:5px;height:36px;min-width:36px;padding:0 10px;border-radius:999px;
background:rgba(10,14,26,.62);border:1px solid rgba(232,192,106,.45);color:#f7dc9c;font-weight:800;font-size:13px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
body.m2 #m2-top .m2-tr .av{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(#f7dc9c,#c49b57);color:#2a1a06;font-weight:900;font-size:13px}
body.m2 #m2-top .m2-tr #m2-acct-btn.in{padding:0 6px}
body.m2 #m2-top .m2-tr .m2-pro-pill{position:static !important}
html[data-skin="paper"] body.m2 #m2-top .m2-tr button{background:rgba(255,250,240,.85);color:#7a4e26;border-color:#c9a878}
#qzbadge{ position:absolute; top:12px; right:12px; z-index:6; display:flex; align-items:center; gap:6px; height:34px; padding:0 11px 0 4px; border-radius:999px; cursor:pointer;
background:rgba(12,16,28,.72); color:var(--ink); border:1px solid var(--line); box-shadow:0 3px 10px rgba(0,0,0,.28); backdrop-filter:blur(6px); font:700 13px/1 inherit; white-space:nowrap }
#qzbadge:hover{ border-color:var(--accent) }
#qzbadge .qz-medal{ display:block } #qzbadge .qz-medal svg, #qzbadge .qz-medal img{ width:100%!important; height:100%!important; display:block }
#qzbadge .qb-t{ color:var(--accent) } #qzbadge .qb-t small{ color:var(--muted); font-weight:700; font-size:11.5px }
html[data-theme="light"] #qzbadge{ background:rgba(255,252,245,.86) }
.acct-quiz{ margin-top:16px; padding-top:14px; border-top:1px solid var(--line) }
.acct-qh{ display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin-bottom:8px }
.acct-qh b{ font-size:var(--fs-h2) } .acct-qh small{ color:var(--muted); font-size:var(--fs-xs) }
.acct-achs{ display:grid; grid-template-columns:repeat(5,1fr); gap:6px; margin:10px 0 6px }
.acct-ach{ display:flex; flex-direction:column; align-items:center; gap:3px; padding:7px 2px; border-radius:10px; border:1px solid var(--line); background:var(--panel2); text-align:center; opacity:.45; filter:grayscale(1) }
.acct-ach.on{ opacity:1; filter:none; border-color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent) }
.acct-ach i{ font-style:normal; font-size:20px; line-height:1 } .acct-ach em{ font-style:normal; font-size:11px; color:var(--ink); line-height:1.25 }
.acct-qbtns{ display:flex; gap:8px; margin-top:8px } .acct-qbtns .btn{ flex:1 }
@media (max-width:420px){ .acct-achs{ grid-template-columns:repeat(5,1fr); gap:4px } .acct-ach em{ font-size:10px } }
.fc2-nav{ position:absolute; left:16px; top:10px; z-index:2; display:flex; gap:6px; align-items:center; flex-wrap:wrap; max-width:calc(100% - 80px) }
#figcard .fc2 .fc2-nav button.fc2-tolist{ display:inline-flex; align-items:center; height:32px; padding:0 12px !important; border-radius:999px;
background:var(--panel2) !important; border:1px solid var(--line) !important; color:var(--ink) !important; font-size:13px; font-weight:700; cursor:pointer }
#figcard .fc2 .fc2-nav button.fc2-tolist:hover{ border-color:var(--accent) !important; color:var(--accent) !important }
.fc2-nav .fc2-back{ position:static !important; font-size:12.5px !important }
.fg-item.fg-cur{ border-color:var(--accent) !important; box-shadow:inset 3px 0 0 var(--accent), 0 0 0 1px var(--accent); background:color-mix(in srgb, var(--accent) 12%, var(--panel)) !important }
@keyframes fg-cur-flash{ 0%{ box-shadow:inset 3px 0 0 var(--accent), 0 0 0 6px color-mix(in srgb, var(--accent) 45%, transparent) } 100%{ box-shadow:inset 3px 0 0 var(--accent), 0 0 0 1px var(--accent) } }
.fg-item.fg-cur{ animation:fg-cur-flash .9s ease-out 1 }
@media (prefers-reduced-motion: reduce){ .fg-item.fg-cur{ animation:none } }
#figcard .fc2 .fc2-hero{ padding-top:52px }
@media (max-width:640px){ #figcard .fc2 .fc2-hero{ padding-top:54px } }
html body #dock-root .fg-item.fg-cur, html body.m2 #dock-root .fg-item.fg-cur{ background:color-mix(in srgb, var(--accent) 16%, var(--s2, var(--panel))) !important;
border-color:var(--accent) !important; box-shadow:inset 4px 0 0 var(--accent), 0 0 0 1px var(--accent) !important }
html body.m2 #dock-root .fg-item.fg-cur{ background:var(--v-acct, rgba(243,198,80,.15)) !important; border-color:var(--gold) !important; box-shadow:inset 4px 0 0 var(--gold), 0 0 0 1px var(--gold) !important }
html body.m2 #dock-root .fg-item.fg-cur .fg-nm{ color:var(--gold) }
.fc2-stats button.st{ font:inherit; color:inherit; text-align:left; width:100%; cursor:pointer; -webkit-tap-highlight-color:transparent }
.fc2-stats button.st:not(.off){ padding-right:22px }
.fc2-stats button.st:not(.off)::after{ content:"›"; position:absolute; right:9px; top:50%; transform:translateY(-50%); font-size:18px; line-height:1; color:var(--muted); opacity:.8 }
.fc2-stats button.st:not(.off):hover{ border-color:var(--accent) }
.fc2-stats button.st:not(.off):active{ transform:scale(.98) }
.fc2-stats button.st:focus-visible{ outline:2px solid var(--accent); outline-offset:2px }
.fc2-stats button.st.off{ cursor:default; opacity:.55 }
#figcard [data-sec]{ scroll-margin-top:14px }
@keyframes fc2-flash{ 0%{ box-shadow:0 0 0 0 color-mix(in srgb, var(--accent) 55%, transparent); background-color:color-mix(in srgb, var(--accent) 16%, transparent) }
100%{ box-shadow:0 0 0 14px color-mix(in srgb, var(--accent) 0%, transparent); background-color:transparent } }
#figcard .fc2-flash{ animation:fc2-flash 1.6s ease-out 1; border-radius:12px }
@keyframes fc2-pulse{ 0%,100%{ transform:translateX(-50%) scale(1) } 25%,75%{ transform:translateX(-50%) scale(1.7) } 50%{ transform:translateX(-50%) scale(1.2) } }
#figcard .fc2-life .star.fc2-pulse{ animation:fc2-pulse 1s ease-in-out 2; z-index:3 }
@media (prefers-reduced-motion: reduce){ #figcard .fc2-flash, #figcard .fc2-life .star.fc2-pulse{ animation:none; outline:2px solid var(--accent) } }
.cmt-card{ position:relative; margin:10px 0; padding:12px 14px 10px 16px; border-radius:12px; border:1px solid var(--line); background:var(--panel2, rgba(0,0,0,.04)) }
.cmt-card::before{ content:""; position:absolute; left:0; top:12px; bottom:12px; width:3px; border-radius:2px; background:var(--sk-seal, #a8322a) }
.cmt-hd{ display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; font-size:12px }
.cmt-by{ font-weight:800; color:var(--sk-seal, #a8322a); letter-spacing:.06em }
.cmt-src{ color:var(--muted) }
.cmt-title{ margin:4px 0 6px; font-size:15px; color:var(--ink) }
.cmt-quote{ margin:0 0 6px; padding:0; border:0; font-family:"Noto Serif SC","Source Han Serif SC","Songti SC","STSong",serif; font-size:15px; line-height:1.85; color:var(--ink); letter-spacing:.02em }
.cmt-more summary{ cursor:pointer; color:var(--accent); font-size:12.5px; font-weight:700; margin:2px 0 4px; list-style:none }
.cmt-more summary::-webkit-details-marker{ display:none }
.cmt-more summary::before{ content:"▸ "; } .cmt-more[open] summary::before{ content:"▾ "; }
.cmt-full{ margin:4px 0 8px; font-family:"Noto Serif SC","Source Han Serif SC","Songti SC","STSong",serif; font-size:14px; line-height:1.85; color:var(--muted) }
.cmt-plain{ margin:6px 0 8px; font-size:13.5px; line-height:1.75; color:var(--ink) }
.cmt-plain b{ display:inline-block; margin-right:6px; padding:0 6px; border-radius:6px; font-size:11.5px; color:var(--on-accent, #fff); background:var(--accent) }
.cmt-ft{ display:flex; flex-wrap:wrap; gap:6px }
.cmt-link{ border:1px solid var(--line); background:transparent; color:var(--ink); border-radius:999px; padding:3px 10px; font:600 12px/1.4 inherit; cursor:pointer }
.cmt-link:hover{ border-color:var(--accent); color:var(--accent) }
.cmt-year{ color:var(--accent) }
.cmt-page .cmt-eras{ position:sticky; top:0; z-index:2; display:flex; flex-wrap:wrap; gap:6px; padding:8px 0; background:var(--panel) }
.cmt-era{ border:1px solid var(--line); background:var(--panel2); color:var(--ink); border-radius:999px; padding:4px 12px; font:700 13px/1.4 inherit; cursor:pointer }
.cmt-era span{ color:var(--muted); font-weight:600 }
.cmt-gh{ margin:16px 0 4px; padding-bottom:4px; border-bottom:1px solid var(--line); font-size:16px }
@keyframes cmt-hl{ 0%{ box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 50%, transparent) } 100%{ box-shadow:0 0 0 0 transparent } }
.cmt-card.cmt-hl{ animation:cmt-hl 1.6s ease-out 1 }
#dock-root .cmt-sec h3{ font-size:15px; margin:14px 0 4px }
#dock-root .cmt-card{ padding:10px 12px 8px 14px }
#figcard .cmt-card{ background:color-mix(in srgb, var(--fc2-paper, #fbf6ea) 92%, var(--fc2-ink, #2a211a)); border-color:var(--fc2-line, rgba(90,60,30,.22)) }
#figcard .cmt-title, #figcard .cmt-quote, #figcard .cmt-plain{ color:var(--fc2-ink, #2a211a) }
#figcard .cmt-src, #figcard .cmt-full{ color:var(--fc2-mute, #6b5a48) }
#figcard .cmt-link{ border-color:var(--fc2-line, rgba(90,60,30,.25)); color:var(--fc2-ink, #2a211a) }
.cmt-para{ margin-left:auto; font-size:11px; color:var(--muted); border:1px dashed var(--line); border-radius:6px; padding:0 6px }
.st-tag{ background:color-mix(in srgb, var(--accent) 14%, transparent) !important; border-color:color-mix(in srgb, var(--accent) 38%, transparent) !important; color:var(--ink) !important; font-weight:600 }
.cmt-by{ color:color-mix(in srgb, var(--sk-seal, #a8322a) 62%, var(--ink)) }
.cmt-plain b{ background:color-mix(in srgb, var(--accent) 78%, #000) !important; color:#fff !important }
.cmt-page .cmt-eras{ margin:0 -16px; padding:8px 16px; background:color-mix(in srgb, var(--panel) 78%, transparent); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border-bottom:1px solid var(--line) }
.cmt-plain b{ background:var(--accent) !important; color:#140d06 !important }
html[data-theme="light"] .cmt-plain b{ background:color-mix(in srgb, var(--accent) 78%, #000) !important; color:#fff !important }
.wiki-sig{ background:color-mix(in srgb, var(--accent) 12%, transparent) !important; border:1px solid color-mix(in srgb, var(--accent) 30%, transparent); color:var(--ink) !important }
html[data-theme="light"] .wd-sname[style*="--sc"]{ color:color-mix(in srgb, var(--sc) 58%, #000) !important }
html[data-pal="cinnabar"] .seg button.on{ color:#2a0b06 !important }
a.lk { color: inherit; cursor: pointer; text-decoration: underline dotted; text-decoration-thickness: 1.5px;
text-underline-offset: 3px; text-decoration-color: color-mix(in srgb, currentColor 50%, var(--accent, #c8a46a)); }
a.lk:hover, a.lk:focus-visible { color: var(--accent, #c8a46a); outline: none; }
a.lk-war::after { content: '⚔'; font-size: .68em; margin-left: 1px; opacity: .55; vertical-align: .15em; }
.chips span.fig { box-shadow: inset 0 -2px 0 color-mix(in srgb, var(--accent, #c8a46a) 70%, transparent); }
.chips span.fig::after { content: '·人物'; font-size: .78em; opacity: .65; margin-left: 2px; }
.legal .chlog .cl-v { padding: 8px 0 6px; border-bottom: 1px dashed color-mix(in srgb, currentColor 18%, transparent); }
.legal .chlog .cl-h { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.legal .chlog .cl-h b { color: var(--accent, #c8a46a); font-variant-numeric: tabular-nums; }
.legal .chlog ul { margin: 4px 0 0; padding-left: 1.2em; }
.legal .chlog li { margin: 2px 0; line-height: 1.6; font-size: .94em; }
.legal .chlog details > summary { cursor: pointer; padding: 8px 0; color: var(--accent, #c8a46a); }
.atl{ --atl-empty: color-mix(in srgb, var(--ink, #eee) 14%, transparent); margin:0 0 14px; padding:12px; border-radius:12px;
border:1px solid color-mix(in srgb, var(--accent, #c8a46a) 35%, transparent); background: color-mix(in srgb, var(--panel, #222) 85%, transparent); outline:none }
.atl:focus-visible{ box-shadow:0 0 0 2px var(--accent, #c8a46a) }
.atl-head, .atl-ch{ display:flex; align-items:center; gap:8px; flex-wrap:wrap }
.atl-sp{ flex:1 }
.atl-grid{ display:grid; grid-template-columns: 150px 1fr; gap:12px; margin-top:10px; align-items:start }
.atl-geo{ text-align:center }
.atl-sil{ width:100%; height:110px; border-radius:8px; background: color-mix(in srgb, var(--ink, #eee) 5%, transparent) }
.atl-sil path{ fill: var(--atl-empty); stroke: color-mix(in srgb, var(--ink, #eee) 45%, transparent); stroke-width:.25; transition: fill .45s }
.atl-pol{ margin-top:4px; line-height:1.4 }
.atl-svg{ width:100%; height:178px; display:block; overflow:visible }
.atl-p rect{ cursor:pointer; opacity:.78; stroke: color-mix(in srgb, var(--bg, #000) 55%, transparent); stroke-width:1; transition: opacity .2s }
.atl-p:hover rect, .atl-p.on rect{ opacity:1 }
.atl-p text{ font-size:13px; font-weight:700; fill:#fff; paint-order:stroke; stroke:rgba(0,0,0,.45); stroke-width:3px; pointer-events:none }
.atl-sel{ fill: color-mix(in srgb, var(--accent, #c8a46a) 13%, transparent); stroke: var(--accent, #c8a46a); stroke-width:1.5; pointer-events:none; transition: x .35s, width .35s }
.atl-tk, .atl-ln{ stroke: color-mix(in srgb, var(--ink, #eee) 25%, transparent); stroke-width:1 }
.atl-ln{ stroke-dasharray:2 4 }
.atl-tt{ font-size:11px; fill: var(--muted, #aaa) }
.atl-ev{ stroke: color-mix(in srgb, var(--accent, #c8a46a) 70%, transparent); stroke-width:1.4 }
.atl-fg{ fill: var(--accent, #c8a46a); stroke: var(--bg, #000); stroke-width:1.5; cursor:pointer }
.atl-wr{ fill:#e0675a; stroke: var(--bg, #000); stroke-width:1; cursor:pointer }
.atl-to{ fill:none; stroke:#5fb8e0; stroke-width:2; cursor:pointer }
.atl-fg:hover, .atl-wr:hover, .atl-to:hover{ filter: brightness(1.35) }
.atl-lanes{ display:flex; gap:12px; flex-wrap:wrap; margin-top:2px }
.atl-card{ margin-top:10px; padding-top:10px; border-top:1px dashed color-mix(in srgb, var(--ink, #eee) 18%, transparent) }
.atl-dot{ width:12px; height:12px; border-radius:3px; display:inline-block }
.atl-intro{ margin:6px 0; line-height:1.6 }
.atl-stats{ display:flex; gap:12px; flex-wrap:wrap; margin:6px 0 }
.atl-chips{ display:flex; gap:6px; flex-wrap:wrap; margin:6px 0 }
.atl-chips .chip{ font-size:12px; padding:3px 9px; border-radius:999px; border:1px solid color-mix(in srgb, var(--accent, #c8a46a) 45%, transparent);
background: color-mix(in srgb, var(--accent, #c8a46a) 9%, transparent); color: var(--ink, #eee); cursor:pointer }
.atl-acts{ display:flex; gap:8px; flex-wrap:wrap; margin-top:8px }
@media (max-width: 640px){ .atl-grid{ grid-template-columns: 1fr } .atl-sil{ height:90px } .atl-svg{ height:150px } }
.atl-pop{ position:absolute; z-index:40; min-width:210px; max-width:270px; padding:10px 12px; border-radius:12px;
background: var(--panel, #1c2230); color: var(--ink, #eee); border:1px solid color-mix(in srgb, var(--accent, #c8a46a) 45%, transparent);
box-shadow: 0 10px 28px rgba(0,0,0,.4) }
.atl-pn{ font-weight:800; font-size:15px; margin-bottom:2px; padding-right:18px }
.atl-pr{ margin:6px 0 }
.atl-pa{ display:flex; gap:6px; flex-wrap:wrap; margin-top:6px }
.atl-x{ position:absolute; right:6px; top:4px; border:0; background:none; color:inherit; font-size:18px; cursor:pointer; opacity:.7 }
.mwiki{ display:flex; gap:6px; flex-wrap:wrap; margin:6px 0 10px }
.atv-list{ margin-top:8px }
.atv-st{ display:grid; grid-template-columns: 50px 30px 1fr; min-height:60px; cursor:pointer }
.atv-yr{ text-align:right; padding:10px 4px 0 0; font-size:11.5px; color: var(--muted, #aaa); font-variant-numeric: tabular-nums }
.atv-rail{ position:relative }
.atv-rail::before{ content:''; position:absolute; left:50%; transform:translateX(-50%); top:0; bottom:0; width:9px; background: var(--c); opacity:.92 }
.atv-st.first .atv-rail::before{ top:14px; border-radius:5px 5px 0 0 }
.atv-st.last .atv-rail::before{ bottom:auto; height:22px; border-radius:0 0 5px 5px }
.atv-tk i{ position:absolute; left:1px; width:6px; height:1.5px; background: var(--accent, #c8a46a); opacity:.65 }
.atv-dot{ position:absolute; left:50%; top:10px; transform:translateX(-50%); width:17px; height:17px; border-radius:50%;
background: var(--panel, #1c1410); border:3px solid var(--c); box-sizing:border-box; transition: all .2s }
.atv-st.on .atv-dot{ width:24px; height:24px; top:7px; border-width:5px; border-color: var(--accent, #c8a46a); box-shadow:0 0 0 3px color-mix(in srgb, var(--c) 60%, transparent) }
.atv-st:hover:not(.on) .atv-dot{ border-color: var(--accent, #c8a46a) }
.atv-body{ padding:6px 0 12px 6px; min-width:0 }
.atv-name{ all:unset; cursor:pointer; display:flex; gap:8px; align-items:baseline; flex-wrap:wrap }
.atv-name b{ font-size:14.5px }
.atv-st.on .atv-name b{ font-size:16px; color: var(--accent, #c8a46a) }
.atv-name:focus-visible{ outline:2px solid var(--accent, #c8a46a); outline-offset:2px; border-radius:4px }
.atv-meta{ margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.atv-x{ margin-top:8px; cursor:default }
.atv-geo{ display:flex; gap:10px; align-items:center; padding:8px; border-radius:10px; background: color-mix(in srgb, var(--ink, #eee) 5%, transparent) }
.atv-sil{ width:96px; height:66px; flex:none }
.atv-sil path{ stroke: color-mix(in srgb, var(--ink, #eee) 50%, transparent); stroke-width:.25 }
.atv-pol{ color: var(--ink, #eee); font-size:13px }
.ate{ padding:0 0 10px; overflow:visible }
.ate-card{ position:sticky; top:-14px; z-index:3; padding:12px; margin:0 0 6px; border-radius:12px 12px 10px 10px;
background: var(--panel, #222); border-bottom:1px solid color-mix(in srgb, var(--accent, #c8a46a) 35%, transparent);
box-shadow: 0 6px 14px rgba(0,0,0,.25) }
.ate-cx{ display:flex; gap:12px; align-items:flex-start; margin-top:8px }
.ate-sil{ width:110px; height:80px; flex:none; border-radius:8px; background: color-mix(in srgb, var(--ink, #eee) 5%, transparent) }
.ate-sil path{ stroke: color-mix(in srgb, var(--ink, #eee) 50%, transparent); stroke-width:.25; transition: fill .4s }
.ate-ct{ flex:1; min-width:0 }
.ate-pol{ color: var(--ink, #eee) }
.ate-intro{ margin:4px 0; line-height:1.55; font-size:13px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden }
.ate-body{ position:relative; margin:0 6px }
.ate-spine{ position:absolute; left:50%; top:0; bottom:0; width:24px; transform:translateX(-50%) }
.ate-seg{ position:absolute; left:0; width:24px; background: var(--c); border-radius:4px; cursor:pointer; opacity:.85; transition: opacity .2s, box-shadow .2s;
display:flex; align-items:center; justify-content:center; overflow:hidden }
.ate-seg span{ writing-mode: vertical-rl; font-size:12px; font-weight:800; color:#fff; letter-spacing:1px; text-shadow:0 0 3px rgba(0,0,0,.6); white-space:nowrap; pointer-events:none }
.ate-seg:hover{ opacity:1 }
.ate-seg.on{ opacity:1; box-shadow: 0 0 0 2px var(--accent, #c8a46a), 0 0 10px color-mix(in srgb, var(--accent, #c8a46a) 60%, transparent) }
.ate-yr{ position:absolute; left:calc(50% + 18px); font-size:10px; line-height:12px; color: var(--muted, #aaa); margin-top:2px; pointer-events:none; opacity:.85 }
.ate-end{ position:absolute; left:calc(50% + 16px); font-size:10px; color: var(--muted, #aaa) }
.ate-L, .ate-R{ position:absolute; top:0; bottom:0 }
.ate-L{ left:0; right:calc(50% + 16px) }
.ate-R{ left:calc(50% + 16px); right:0 }
.ate-l, .ate-r{ all:unset; position:absolute; transform:translateY(-50%); font-size:12px; line-height:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
cursor:pointer; color: var(--ink, #eee); max-width:100% }
.ate-l{ right:0; text-align:right; padding-right:6px }
.ate-l b{ color: var(--accent, #c8a46a); font-weight:600; font-variant-numeric: tabular-nums }
.ate-r{ left:0; padding-left:6px }
.ate-l::after, .ate-r::before{ content:''; position:absolute; top:50%; width:5px; height:1px; background: currentColor; opacity:.5 }
.ate-l::after{ right:0 } .ate-r::before{ left:0 }
.ate-war{ color:#f0a99f }
.ate-more{ color: var(--muted, #aaa); font-style:italic }
.ate-l:hover, .ate-r:hover, .ate-l:focus-visible, .ate-r:focus-visible{ color: var(--accent, #c8a46a); text-decoration: underline }
.wiki-atlas-tip{ margin:4px 0 12px; padding:9px 12px; border-radius:10px; font-size:13px; line-height:1.55;
border:1px dashed color-mix(in srgb, var(--accent, #c8a46a) 55%, transparent); background: color-mix(in srgb, var(--accent, #c8a46a) 8%, transparent) }
.wiki-r-ic{ font-style:normal; font-size:.85em; margin-right:4px; opacity:.75 }
#sup{ position:fixed; inset:0; z-index:12000; display:grid; place-items:center; padding:16px;
background: rgba(0,0,0,0); transition: background .22s; }
#sup.on{ background: rgba(0,0,0,.55) }
.sup-box{ position:relative; width:min(460px, 100%); max-height:calc(100vh - 32px); overflow:auto; padding:20px 20px 14px; border-radius:16px;
background: var(--panel, #241812); color: var(--ink, #f3e6d0); border:1px solid color-mix(in srgb, var(--accent, #c8a46a) 55%, transparent);
box-shadow: 0 18px 50px rgba(0,0,0,.5); transform: translateY(14px) scale(.98); opacity:0; transition: transform .22s, opacity .22s }
#sup.on .sup-box{ transform:none; opacity:1 }
.sup-x{ position:absolute; right:10px; top:6px; border:0; background:none; color:inherit; font-size:22px; cursor:pointer; opacity:.6 }
.sup-h{ font-size:19px; font-weight:800; margin:0 22px 10px 0; color: var(--accent, #c8a46a) }
.sup-p{ margin:0 0 10px; line-height:1.7; font-size:14px }
.sup-new{ margin:4px 0 12px; padding:10px 12px; border-radius:10px; background: color-mix(in srgb, var(--accent, #c8a46a) 9%, transparent);
border:1px dashed color-mix(in srgb, var(--accent, #c8a46a) 50%, transparent) }
.sup-nt{ font-size:13.5px; margin-bottom:4px }
.sup-new ul{ margin:4px 0 4px; padding-left:1.2em; font-size:13px; line-height:1.6 }
.sup-link{ border:0; background:none; padding:0; color: var(--accent, #c8a46a); font:inherit; font-size:12.5px; cursor:pointer; text-decoration:underline }
.sup-acts{ display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; margin-top:12px }
.sup-acts .btn.primary{ font-weight:800 }
.sup-later{ opacity:.85 }
.sup-ver{ margin-top:10px; text-align:right; opacity:.6 }
@media (max-width: 480px){ .sup-acts{ justify-content:stretch } .sup-acts .sup-b{ flex:1 1 auto; text-align:center } }
.sup-thx{ padding:10px 12px; border-radius:10px; background: color-mix(in srgb, var(--accent, #c8a46a) 12%, transparent) }
.gj-intro{ line-height:1.7; margin:0 0 10px }
.gj-tabs{ display:flex; gap:6px; flex-wrap:wrap; margin:0 0 12px; position:sticky; top:-14px; z-index:2; padding:8px 0; background: var(--panel, #222) }
.gj-tab{ border:1px solid color-mix(in srgb, var(--accent, #c8a46a) 40%, transparent); background:transparent; color: var(--ink, #eee); border-radius:999px; padding:4px 11px; font-size:13px; cursor:pointer }
.gj-tab.on{ background: var(--accent, #c8a46a); color: var(--on-accent, #1a1206); border-color: var(--accent, #c8a46a); font-weight:700 }
.gj-list{ display:flex; flex-direction:column; gap:12px }
.gj-card{ padding:12px 14px; border-radius:12px; border:1px solid color-mix(in srgb, var(--accent, #c8a46a) 30%, transparent);
background: color-mix(in srgb, var(--panel, #222) 88%, var(--accent, #c8a46a) 4%) }
.gj-hd{ display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; font-size:12.5px; color: var(--muted, #aaa) }
.gj-book{ color: var(--accent, #c8a46a); font-weight:700 }
.gj-pian{ margin-left:4px; font-weight:400; color: var(--muted, #aaa) }
.gj-title{ margin:6px 0 8px; font-size:16px; display:flex; gap:8px; align-items:baseline; flex-wrap:wrap }
.gj-reg{ font-size:11.5px; padding:1px 7px; border-radius:999px; background: color-mix(in srgb, var(--accent, #c8a46a) 16%, transparent); color: var(--accent, #c8a46a); font-weight:700 }
.gj-y{ font-size:12px; color: var(--muted, #aaa); font-weight:400 }
.gj-quote{ margin:0; padding:10px 14px; border-left:3px solid var(--accent, #c8a46a); border-radius:0 8px 8px 0;
background: color-mix(in srgb, var(--ink, #eee) 5%, transparent); font-family: "Noto Serif SC","Songti SC","STSong",serif; font-size:15px; line-height:1.9; letter-spacing:.5px }
.gj-quote.gj-long:not(.gj-open){ display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden }
.gj-more{ border:0; background:none; color: var(--accent, #c8a46a); cursor:pointer; padding:4px 0; font-size:12.5px }
.gj-plain{ margin:8px 0 6px; line-height:1.75; font-size:14px }
.gj-plain b{ display:inline-block; margin-right:6px; font-size:12px; padding:1px 6px; border-radius:4px; background: color-mix(in srgb, var(--ink, #eee) 10%, transparent) }
.gj-ft{ display:flex; gap:6px; flex-wrap:wrap; margin-top:4px }
.gj-link{ border:1px solid color-mix(in srgb, var(--ink, #eee) 18%, transparent); background:transparent; color: var(--ink, #eee); border-radius:999px; padding:3px 10px; font-size:12px; cursor:pointer }
.gj-link:hover{ border-color: var(--accent, #c8a46a); color: var(--accent, #c8a46a) }
.gj-block{ margin:0 0 14px; padding:10px 12px; border-radius:12px; border:1px solid color-mix(in srgb, var(--accent, #c8a46a) 30%, transparent) }
.gj-block > summary{ cursor:pointer; font-weight:700 }
.gj-block .gj-list{ margin-top:10px }
.sx-tabs{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:8px }
.sx-tab{ border:1px solid color-mix(in srgb, var(--accent, #c8a46a) 40%, transparent); background:transparent; color: var(--ink, #eee); border-radius:999px; padding:4px 12px; font-size:13px; cursor:pointer }
.sx-tab.on{ background: var(--accent, #c8a46a); color: var(--on-accent, #1a1206); border-color: var(--accent, #c8a46a); font-weight:700 }
.sx-intro{ line-height:1.65; margin:0 0 8px; font-size:13.5px }
.sx-bar{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:8px }
.sx-wrap{ overflow:auto; max-height:56vh; border-radius:12px; border:1px solid color-mix(in srgb, var(--ink, #eee) 14%, transparent);
background: color-mix(in srgb, var(--ink, #eee) 3%, transparent); cursor:grab; touch-action: pan-x pan-y }
.sx-wrap.drag{ cursor:grabbing }
.sx-svg{ display:block; max-width:none !important; height:auto }
.sx-edge{ fill:none; stroke: color-mix(in srgb, var(--ink, #eee) 40%, transparent); stroke-width:1.6 }
.sx-edge.far{ stroke-dasharray:4 4 }
.sx-far{ font-size:10px; fill: var(--muted, #aaa) }
.sx-sp{ stroke: var(--accent, #c8a46a); stroke-width:1.4 }
.sx-n{ cursor:pointer }
.sx-n rect{ fill: var(--panel, #2a1b12); stroke: color-mix(in srgb, var(--accent, #c8a46a) 60%, transparent); stroke-width:1.5 }
.sx-n.kin rect{ fill: transparent; stroke: color-mix(in srgb, var(--ink, #eee) 30%, transparent); stroke-dasharray:4 3 }
.sx-n.on rect{ stroke: var(--accent, #c8a46a); stroke-width:3; fill: color-mix(in srgb, var(--accent, #c8a46a) 16%, var(--panel, #2a1b12)) }
.sx-n:hover rect{ stroke: var(--accent, #c8a46a) }
.sx-nm{ font-size:14px; font-weight:800; fill: var(--ink, #eee) }
.sx-n.kin .sx-nm{ fill: var(--muted, #aaa); font-weight:600 }
.sx-t{ font-size:11px; fill: var(--muted, #aaa) }
.sx-y{ font-size:10.5px; fill: var(--accent, #c8a46a) }
.sx-o{ fill: var(--accent, #c8a46a) }
.sx-on{ font-size:11px; font-weight:800; fill: var(--on-accent, #1a1206) }
.sx-info{ margin-top:10px; padding:10px 12px; border-radius:12px; border:1px solid color-mix(in srgb, var(--accent, #c8a46a) 30%, transparent); min-height:54px }
.sx-ic{ display:flex; gap:10px; align-items:baseline; flex-wrap:wrap }
.sx-icn{ font-size:17px }
.sx-icb{ display:inline-block; min-width:22px; text-align:center; margin-right:6px; padding:0 5px; border-radius:999px; background: var(--accent, #c8a46a); color: var(--on-accent, #1a1206); font-size:12px }
.sx-icy{ color: var(--accent, #c8a46a) }
.sx-how{ margin:6px 0; font-size:13.5px }
.sx-acts{ display:flex; gap:6px; flex-wrap:wrap; margin-top:6px }
.sx-block{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin:0 0 12px; padding:9px 12px; border-radius:12px; border:1px solid color-mix(in srgb, var(--accent, #c8a46a) 30%, transparent) }
html.cv-open, html.cv-open body{ overflow:hidden }
#cvx{ position:fixed; inset:0; z-index:9500; display:flex; flex-direction:column; background: var(--bg, #160e09); color: var(--ink, #eee);
padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px); height:100dvh }
.cv-top{ display:flex; align-items:center; gap:10px; padding:10px 14px; border-bottom:1px solid color-mix(in srgb, var(--accent, #c8a46a) 35%, transparent); flex-wrap:wrap;
background: var(--panel, #241812) }
.cv-title{ font-size:16px; color: var(--accent, #c8a46a); white-space:nowrap }
.cv-bar{ display:flex; gap:8px; flex-wrap:wrap; flex:1; min-width:0 }
.cv-pick{ display:flex; align-items:center; gap:5px }
.cv-pn{ display:inline-grid; place-items:center; width:20px; height:20px; border-radius:50%; background: var(--accent, #c8a46a); color: var(--on-accent, #1a1206); font-size:12px; font-weight:800 }
.cv-pick select{ font:inherit; font-size:14px; padding:5px 8px; border-radius:8px; border:1px solid color-mix(in srgb, var(--accent, #c8a46a) 45%, transparent);
background: var(--bg, #160e09); color: var(--ink, #eee); max-width:46vw }
.cv-x{ margin-left:auto; border:0; background:none; color: var(--ink, #eee); font-size:26px; cursor:pointer; line-height:1 }
.cv-heads{ display:grid; grid-template-columns: 56px repeat(var(--n), 1fr); gap:0; border-bottom:1px solid color-mix(in srgb, var(--ink, #eee) 14%, transparent); background: var(--panel, #241812) }
.cv-h{ padding:6px 10px; border-left:1px solid color-mix(in srgb, var(--ink, #eee) 12%, transparent); min-width:0 }
.cv-h b{ display:block; font-size:15px }
.cv-now{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color: var(--accent, #c8a46a) !important }
.cv-body{ flex:1; overflow:auto; position:relative; overscroll-behavior:contain }
.cv-inner{ position:relative; display:grid; grid-template-columns: 56px repeat(var(--n), 1fr) }
.cv-axis{ position:relative }
.cv-tk{ position:absolute; right:6px; transform:translateY(-50%); font-size:11px; color: var(--muted, #aaa) }
.cv-grid{ position:absolute; left:56px; width:calc(100vw - 56px); height:1px; background: color-mix(in srgb, var(--ink, #eee) 8%, transparent); pointer-events:none }
.cv-col{ position:relative; border-left:1px solid color-mix(in srgb, var(--ink, #eee) 12%, transparent); min-width:0; overflow:hidden }
.cv-band{ position:absolute; left:4px; width:22px; border-radius:4px; background: var(--c); opacity:.88; display:flex; align-items:center; justify-content:center; overflow:hidden }
.cv-band span{ writing-mode: vertical-rl; font-size:11.5px; font-weight:800; color:#fff; text-shadow:0 0 3px rgba(0,0,0,.65); white-space:nowrap }
.cv-k{ all:unset; position:absolute; left:30px; transform:translateY(-50%); font-size:11.5px; line-height:15px; color: var(--accent, #c8a46a); white-space:nowrap; max-width:46%; overflow:hidden; text-overflow:ellipsis; cursor:pointer }
.cv-k i{ font-style:normal; color: var(--muted, #aaa); font-size:10px; margin-left:4px; font-variant-numeric: tabular-nums }
.cv-k:hover{ text-decoration:underline }
.cv-e{ all:unset; position:absolute; left:50%; right:4px; transform:translateY(-50%); font-size:12px; line-height:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; cursor:pointer; color: var(--ink, #eee) }
.cv-e b{ color: var(--muted, #aaa); font-weight:500; margin-right:3px; font-variant-numeric: tabular-nums }
.cv-e:hover{ color: var(--accent, #c8a46a); text-decoration:underline }
.cv-line{ position:absolute; left:0; right:0; height:0; border-top:2px solid var(--accent, #c8a46a); pointer-events:none; z-index:2; box-shadow:0 0 6px color-mix(in srgb, var(--accent, #c8a46a) 70%, transparent) }
.cv-ly{ position:absolute; left:2px; top:-11px; font-size:11px; font-weight:800; background: var(--accent, #c8a46a); color: var(--on-accent, #1a1206); padding:1px 5px; border-radius:6px }
.cv-tip{ padding:6px 14px; border-top:1px solid color-mix(in srgb, var(--ink, #eee) 10%, transparent) }
.cv-pop{ position:absolute; z-index:5; width:280px; max-width:calc(100vw - 16px); padding:12px; border-radius:12px; background: var(--panel, #241812);
border:1px solid color-mix(in srgb, var(--accent, #c8a46a) 50%, transparent); box-shadow:0 10px 28px rgba(0,0,0,.45) }
.cv-pop p{ margin:6px 0 10px; line-height:1.6; font-size:13px }
.cv-x2{ position:absolute; right:8px; top:4px; border:0; background:none; color:inherit; font-size:18px; cursor:pointer }
body.m2 .cv-k{ max-width:calc(100% - 46px) }
body.m2 .cv-k i{ display:block; margin-left:0; font-size:9.5px; line-height:10px }
.cv-dot{ left:auto !important; right:6px !important; width:8px; height:8px; border-radius:50%; background: color-mix(in srgb, var(--accent, #c8a46a) 70%, transparent); padding:0 }
.cv-n{ display:block }
.cv-pacts{ display:flex; gap:6px; flex-wrap:wrap }
body.m2 .cv-title{ display:none }
.ch-top{ display:flex; gap:12px; align-items:flex-start; justify-content:space-between; flex-wrap:wrap; margin-bottom:8px }
.ch-now{ font-size:15px; color: var(--accent, #c8a46a) }
.ch-h{ margin:14px 0 8px; font-size:14px }
.ch-list{ display:flex; flex-direction:column; gap:8px }
.ch-seg{ padding:8px 10px; border-radius:10px; border:1px solid color-mix(in srgb, var(--ink, #eee) 14%, transparent) }
.ch-seg.on{ border-color: var(--accent, #c8a46a); background: color-mix(in srgb, var(--accent, #c8a46a) 8%, transparent) }
.ch-sh{ display:flex; gap:8px; align-items:center; flex-wrap:wrap }
.ch-dot{ width:12px; height:12px; border-radius:3px; flex:none }
.ch-kings{ display:flex; flex-wrap:wrap; gap:4px 10px; margin-top:6px; font-size:12.5px }
.ch-k b{ color: var(--muted, #aaa); font-weight:500; margin-right:3px; font-variant-numeric: tabular-nums }
.ch-k i{ font-style:normal; color: var(--muted, #aaa); font-size:11px; margin-left:3px }
.ch-ev{ display:flex; flex-direction:column; gap:4px }
.ch-e{ all:unset; cursor:pointer; font-size:13px; padding:3px 0; border-bottom:1px dashed color-mix(in srgb, var(--ink, #eee) 10%, transparent) }
.ch-e b{ color: var(--accent, #c8a46a); margin-right:6px; font-variant-numeric: tabular-nums }
.ch-e:hover{ color: var(--accent, #c8a46a) }
.bmc-btn{ display:inline-flex; align-items:center; gap:4px; padding:6px 14px; border-radius:999px; font-size:13.5px; font-weight:700; text-decoration:none;
background:#ffdd00; color:#1a1206 !important; border:1px solid #e6c700; box-shadow:0 2px 6px rgba(0,0,0,.18); white-space:nowrap; margin-left:4px }
.bmc-btn:hover{ filter:brightness(1.05); transform:translateY(-1px) }
.la-acts .bmc-btn{ margin-left:0 }
#topnav .top-coffee{ text-decoration:none; background:#ffdd00 !important; color:#1a1206 !important; border-color:#e6c700 !important; border-radius:999px }
#topnav .top-coffee .fi{ font-size:17px; line-height:1 }
#topnav .top-coffee .fl{ color:#1a1206 !important; font-weight:700 }
#topnav .top-coffee:hover{ filter:brightness(1.05) }
.m2-cof{ display:inline-grid; place-items:center; width:32px; height:32px; border-radius:50%; background:#ffdd00; border:1px solid #e6c700;
font-size:17px; text-decoration:none; box-shadow:0 2px 6px rgba(0,0,0,.25); margin-right:6px; flex:none;
pointer-events:auto; position:relative; z-index:2 }
#topnav .top-coffee .fl { white-space: nowrap }
@media (max-width: 1499px) { #topnav .top-coffee .fl { display: none } #topnav .top-coffee { padding-left: 12px; padding-right: 12px } }
@media (max-width: 1400px) { #topnav .tool-badge { display: none } }
body.lay3 #searchwrap #searchbox{ height:44px; box-sizing:border-box }
body.lay3 #side #segbar{ margin-top:-1px }
#cofx{ position:fixed; inset:0; z-index:12500; display:grid; place-items:center; background:rgba(0,0,0,.45); padding:16px }
#cofx .cof-card{ position:relative; width:min(420px,100%); background:var(--panel,#241812); color:var(--ink,#eee); border-radius:16px; padding:22px 20px 18px;
border:1px solid color-mix(in srgb, var(--accent,#c8a46a) 45%, transparent); box-shadow:0 18px 50px rgba(0,0,0,.45) }
#cofx h3{ margin:0 0 6px; font-size:18px }
#cofx .cof-sub{ margin:0 0 14px; font-size:13.5px; line-height:1.6; color:var(--muted,#aaa) }
#cofx .cof-x{ position:absolute; right:10px; top:6px; border:0; background:none; color:inherit; font-size:24px; cursor:pointer }
#cofx .cof-opts{ display:grid; grid-template-columns:1fr 1fr; gap:10px }
#cofx .cof-opt{ all:unset; box-sizing:border-box; display:flex; flex-direction:column; align-items:center; gap:4px; padding:16px 10px; border-radius:12px; cursor:pointer; text-align:center;
border:1px solid color-mix(in srgb, var(--ink,#eee) 18%, transparent); background:color-mix(in srgb, var(--ink,#eee) 4%, transparent) }
#cofx .cof-opt:hover{ border-color:var(--accent,#c8a46a); background:color-mix(in srgb, var(--accent,#c8a46a) 10%, transparent) }
#cofx .cof-flag{ font-size:26px; line-height:1 }
#cofx .cof-opt b{ font-size:16px }
#cofx .cof-d{ font-size:12px; color:var(--muted,#aaa); line-height:1.5 }
#cofx .cof-d em{ font-style:normal; font-weight:800; color:#d9822b }
#cofx .cof-pay{ text-align:center }
#cofx .cof-qr img{ border-radius:8px; background:#fff; padding:6px }
#cofx .cof-qr p{ margin:8px 0 0 }
#cofx .cof-msg{ font-size:13px; color:var(--muted,#aaa); line-height:1.6 }
@media (max-width:360px){ #cofx .cof-opts{ grid-template-columns:1fr } }
#cofx [hidden]{ display:none !important }
svg.sil-approx path{ opacity:.45; stroke:currentColor; stroke-width:.35; stroke-dasharray:1.2 .9; vector-effect:non-scaling-stroke }
svg.sil-empty{ background:repeating-linear-gradient(135deg, transparent 0 6px, rgba(128,110,80,.07) 6px 7px); border-radius:6px }
#dictpop{ position:fixed; z-index:9500; max-height:min(60vh,420px); display:flex; flex-direction:column; background:var(--panel,#fffaf0); color:var(--ink,#2b2118);
border:1px solid var(--line,rgba(120,90,50,.35)); border-radius:12px; box-shadow:0 12px 36px rgba(0,0,0,.28); font-size:14px; line-height:1.5; overflow:hidden }
#dictpop .dp-body{ overflow:auto; padding:10px 12px 6px }
#dictpop .dp-b + .dp-b{ border-top:1px dashed var(--line,rgba(120,90,50,.3)); margin-top:8px; padding-top:8px }
#dictpop .dp-w b{ font-size:22px; font-family:var(--serif,"Noto Serif CJK SC",serif); margin-right:8px }
#dictpop .dp-tr{ font-size:12px; opacity:.7 }
#dictpop .dp-zh{ margin:2px 0 4px }
#dictpop .dp-r{ margin:3px 0 }
#dictpop .dp-py{ font-weight:700; color:var(--accent,#9a5b1e); letter-spacing:.5px }
#dictpop .dp-en{ font-size:13px; opacity:.85 }
#dictpop .dp-none{ font-size:13px; opacity:.65 }
#dictpop .dp-ft{ display:flex; align-items:center; gap:8px; justify-content:space-between; padding:6px 12px; font-size:11px; opacity:.75; border-top:1px solid var(--line,rgba(120,90,50,.25)) }
#dictpop .dp-set{ white-space:nowrap; flex:none }
#dictpop .dp-x{ position:absolute; top:4px; right:6px; width:28px; height:28px; border:0; border-radius:50%; background:transparent; color:inherit;
font-size:20px; line-height:28px; cursor:pointer; opacity:.6 }
#dictpop .dp-x:hover{ opacity:1; background:rgba(0,0,0,.06) }
#dictpop .dp-body{ padding-right:34px }
.fc2-port{ overflow:visible !important }
.fc2-port > img, .fc2-port > svg{ border-radius:inherit }
.fc2-port .fc-noport-tip{ top:calc(100% + 9px); bottom:auto; left:-6px; right:-6px; padding:0; background:none; color:var(--muted);
font-size:11px; line-height:1.2; letter-spacing:.02em; white-space:nowrap; text-align:center; pointer-events:auto }
body.cine-on{ overflow:hidden }
#cine{ position:fixed; inset:0; z-index:9991; color:#f4ead8; font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei","Segoe UI",sans-serif; pointer-events:auto; background:transparent }
#cine .cn-scene{ position:absolute; inset:0; overflow:hidden; pointer-events:none }
#cine .cn-img{ position:absolute; inset:-2%; background:center/cover no-repeat #000; opacity:0; transition:opacity 1.4s ease }
#cine .cn-img.on{ opacity:1 }
#cine .cn-img.kb1.on{ animation:cnKb1 16s ease-out forwards } #cine .cn-img.kb2.on{ animation:cnKb2 16s ease-out forwards }
#cine .cn-img.kb3.on{ animation:cnKb3 16s ease-out forwards } #cine .cn-img.kb4.on{ animation:cnKb4 16s ease-out forwards }
@keyframes cnKb1{ from{ transform:scale(1.02) translate(0,0) } to{ transform:scale(1.14) translate(-2%,-1.5%) } }
@keyframes cnKb2{ from{ transform:scale(1.14) translate(2%,1%) } to{ transform:scale(1.03) translate(0,0) } }
@keyframes cnKb3{ from{ transform:scale(1.04) translate(2%,0) } to{ transform:scale(1.15) translate(-2%,1%) } }
@keyframes cnKb4{ from{ transform:scale(1.12) translate(-2%,-1%) } to{ transform:scale(1.02) translate(1%,1%) } }
#cine .cn-vig{ position:absolute; inset:0; background:radial-gradient(ellipse at center, rgba(0,0,0,0) 55%, rgba(0,0,0,.55) 100%); opacity:.9 }
#cine:not(.has-img) .cn-vig{ opacity:.55 }
#cine .cn-bar{ position:absolute; left:0; right:0; background:#000; display:flex; z-index:2 }
#cine .cn-bar.top{ top:0; height:clamp(46px, 9vh, 96px); align-items:center; padding:0 18px; gap:12px }
#cine .cn-bar.bottom{ bottom:0; min-height:clamp(118px, 20vh, 210px); flex-direction:column; align-items:center; justify-content:center; padding:10px 18px calc(12px + env(safe-area-inset-bottom, 0px)) }
#cine .cn-tt{ flex:1; min-width:0; display:flex; align-items:baseline; gap:12px; opacity:.85; transition:opacity .4s }
#cine .cn-tour{ font:700 15px/1.2 Georgia,"Songti SC","Noto Serif CJK SC",serif; letter-spacing:.06em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
#cine .cn-chap{ font-size:12px; color:#bfae8c; font-variant-numeric:tabular-nums; white-space:nowrap }
#cine .cn-x{ width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.06); color:#fff; font-size:16px; cursor:pointer }
#cine .cn-sub{ margin:0; max-width:min(1100px, 92vw); text-align:center; font-size:clamp(17px, 2.3vw, 26px); line-height:1.5; font-weight:600; color:#fff;
text-shadow:0 2px 6px rgba(0,0,0,.8); opacity:0; transform:translateY(6px); transition:opacity .6s, transform .6s; min-height:3em; display:flex; align-items:center; justify-content:center }
#cine .cn-sub.in{ opacity:1; transform:none }
#cine .cn-ctl{ display:flex; align-items:center; gap:8px; margin-top:8px; width:min(1100px, 94vw); transition:opacity .4s }
#cine .cn-ctl button{ width:32px; height:32px; border-radius:50%; border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.06); color:#fff; font-size:12px; cursor:pointer; flex:none }
#cine .cn-prog{ flex:1; display:flex; gap:3px; align-items:center; min-width:0 }
#cine .cn-prog button{ flex:1; height:14px; border:0; background:none; padding:0; border-radius:0; width:auto }
#cine .cn-prog button i{ display:block; height:3px; border-radius:2px; background:rgba(255,255,255,.22) }
#cine .cn-prog button.done i{ background:rgba(243,212,138,.6) } #cine .cn-prog button.on i{ background:#f3d48a; height:4px }
#cine .cn-cap{ font-size:10px; color:#8f8473; white-space:nowrap; display:none }
#cine.has-img .cn-cap{ display:inline }
#cine.idle .cn-ctl, #cine.idle .cn-x{ opacity:0; pointer-events:none } #cine.idle .cn-tt{ opacity:.45 }
#cine.idle{ cursor:none }
#cine .cn-card{ position:absolute; left:clamp(16px, 4vw, 60px); top:calc(clamp(46px, 9vh, 96px) + 22px); z-index:2; max-width:min(560px, 80vw); opacity:0; pointer-events:none }
#cine .cn-card.show{ animation:cnCard 5.2s ease forwards }
@keyframes cnCard{ 0%{ opacity:0; transform:translateY(8px) } 12%{ opacity:1; transform:none } 78%{ opacity:1 } 100%{ opacity:0 } }
#cine .cn-y{ display:block; font:900 clamp(30px, 5vw, 58px)/1 Georgia,"Songti SC",serif; color:#f3d48a; text-shadow:0 3px 14px rgba(0,0,0,.8) }
#cine .cn-h{ display:block; margin-top:6px; font:800 clamp(18px, 2.6vw, 30px)/1.25 Georgia,"Songti SC","Noto Serif CJK SC",serif; color:#fff; text-shadow:0 2px 10px rgba(0,0,0,.9) }
#cine .cn-open{ position:absolute; inset:0; z-index:3; background:#000; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; text-align:center; padding:24px; transition:opacity 1.2s ease }
#cine .cn-open.out{ opacity:0; pointer-events:none }
#cine .cn-open .cn-emo{ font-size:44px }
#cine .cn-open b{ font:900 clamp(28px, 5vw, 56px)/1.15 Georgia,"Songti SC","Noto Serif CJK SC",serif; color:#f3d48a; letter-spacing:.08em; animation:cnRise 2.2s ease }
#cine .cn-open i{ font-style:normal; font-size:14px; color:#bfae8c; letter-spacing:.2em }
@keyframes cnRise{ from{ opacity:0; letter-spacing:.3em } to{ opacity:1 } }
@media (prefers-reduced-motion:reduce){ #cine .cn-img.on{ animation:none !important } }
body.cine-on #tourplayer{ display:none !important }
[data-cine] > :not(svg#map):not(.w2-ov){ visibility:hidden !important }
.tour-card .tour-cover{ width:84px; height:56px; flex:none; border-radius:8px; background:center/cover no-repeat #222; position:relative; box-shadow:0 2px 6px rgba(0,0,0,.25) }
.tour-card .tour-cover span{ position:absolute; right:3px; bottom:2px; font-size:14px; filter:drop-shadow(0 1px 2px rgba(0,0,0,.6)) }