:root{--ink: #eef0f6;--sub: #a9b0c3;--dim: #6f778c;--gold: #ffd98a;--gold2: #f2b34f;--glass: rgba(14, 18, 32, .62);--glass2: rgba(22, 28, 48, .82);--line: rgba(255, 255, 255, .1);--serif: "Shippori Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif;--sans: "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic UI", "Meiryo", sans-serif;--safe-t: env(safe-area-inset-top, 0px);--safe-b: env(safe-area-inset-bottom, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;overflow:hidden;background:#03040a;color:var(--ink);font-family:var(--sans)}body{overscroll-behavior:none}button{font:inherit;color:inherit;cursor:pointer}[hidden]{display:none!important}#view{position:fixed;inset:0;width:100vw;height:100dvh;display:block;touch-action:none}.screen{position:fixed;inset:0;display:grid;place-items:center;padding:calc(24px + var(--safe-t)) 18px calc(24px + var(--safe-b));background:radial-gradient(ellipse at 50% 120%,#03040a00 30%,#03040abf 80%);overflow-y:auto;z-index:20}.title-inner{text-align:center;max-width:440px;width:100%;animation:rise 1.6s ease-out both}.title-inner .sub{margin:0;letter-spacing:.6em;color:var(--gold);font-family:var(--serif);font-size:14px;padding-left:.6em}.title-inner h1{margin:6px 0 10px;font-family:var(--serif);font-weight:800;font-size:clamp(40px,12vw,64px);letter-spacing:.12em;text-shadow:0 0 30px rgba(120,170,255,.45),0 2px 0 rgba(0,0,0,.5)}.title-inner .lead{color:var(--sub);line-height:1.9;font-size:14px;margin:0 0 26px;text-shadow:0 1px 4px #000}.title-inner .foot{color:var(--dim);font-size:11px;margin-top:18px}.btns{display:grid;gap:10px}.btns>button,.panel button,.modal-box button.btn{padding:13px 16px;border-radius:14px;border:1px solid var(--line);background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:15px;transition:transform .15s,background .2s}.btns>button:hover{background:var(--glass2)}button.primary{background:linear-gradient(180deg,#ffe3a3,#f0b552);color:#2a1a05;border:0;font-weight:700;box-shadow:0 6px 24px #f0b55259}button:active{transform:scale(.97)}.slots{display:grid;gap:8px}.slot{display:grid;grid-template-columns:64px 1fr auto;gap:10px;align-items:center;text-align:left;padding:8px;border-radius:14px;border:1px solid var(--line);background:var(--glass)}.slot img{width:64px;height:64px;border-radius:10px;object-fit:cover;background:#111}.slot b{display:block;font-family:var(--serif);font-size:16px}.slot small{color:var(--sub);font-size:11.5px;line-height:1.5;display:block}.slot .del{border:0;background:none;color:var(--dim);font-size:18px;padding:8px}@keyframes rise{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}.panel{width:min(520px,100%);background:var(--glass2);border:1px solid var(--line);border-radius:20px;padding:20px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.panel h2{margin:0 0 14px;font-family:var(--serif);font-size:24px;letter-spacing:.08em}.field{display:grid;gap:6px;margin:12px 0}.field span{font-size:13px;color:var(--sub)}.field small{margin-left:8px;color:var(--dim)}.field input{padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:#00000059;color:var(--ink);font:inherit;font-size:16px}.kinds{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}.kind{text-align:left;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:#00000040}.kind b{display:block;font-size:14.5px}.kind small{color:var(--sub);font-size:11.5px;line-height:1.5}.kind.on{border-color:var(--gold);background:#ffd98a1f}.check{display:flex;gap:10px;align-items:center;font-size:13px;color:var(--sub);margin:10px 0 4px}.check input{width:20px;height:20px;accent-color:var(--gold2)}.row{display:flex;gap:10px;margin-top:16px}.row>button{flex:1}#hud{position:fixed;inset:0;pointer-events:none;z-index:10}#hud>*{pointer-events:auto}.top{position:absolute;top:calc(10px + var(--safe-t));left:12px;right:12px;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none}.top>*{pointer-events:auto}.when{text-shadow:0 1px 6px #000,0 0 2px #000}.pname{font-family:var(--serif);color:var(--gold);font-size:13px;letter-spacing:.2em}.year{font-family:var(--serif);font-size:clamp(22px,6.4vw,30px);font-weight:700;line-height:1.15}.year small{font-size:.55em;color:var(--sub);margin-right:4px}.era{font-size:13px;color:var(--sub);margin-top:2px}.icon{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:18px;display:grid;place-items:center}.stats{position:absolute;top:calc(98px + var(--safe-t));left:12px;display:flex;flex-wrap:wrap;gap:6px;max-width:70vw;pointer-events:none}.stat{padding:4px 9px;border-radius:999px;background:#080a1480;border:1px solid var(--line);font-size:12px;color:var(--sub)}.stat b{color:var(--ink);font-weight:500;margin-left:3px}.speed{position:absolute;top:calc(10px + var(--safe-t));right:64px;display:flex;align-items:center;gap:4px;background:var(--glass);border:1px solid var(--line);border-radius:999px;padding:3px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.speed .icon{width:34px;height:34px;border:0;background:#ffffff0f;font-size:15px}#speedLabel{min-width:82px;text-align:center;font-size:12.5px;font-variant-numeric:tabular-nums}#speedLabel em{display:block;font-style:normal;font-size:9.5px;color:var(--dim)}#toasts{position:absolute;top:calc(132px + var(--safe-t));left:12px;width:min(420px,calc(100vw - 24px));display:grid;gap:6px;pointer-events:none}.toast{pointer-events:auto;display:grid;grid-template-columns:6px 1fr;gap:10px;padding:9px 12px 9px 10px;border-radius:12px;background:var(--glass2);border:1px solid var(--line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:13px;line-height:1.6;animation:toastIn .35s ease-out both;box-shadow:0 6px 20px #00000059}.toast i{border-radius:4px}.toast small{display:block;color:var(--dim);font-size:11px}.toast.big{font-family:var(--serif);font-size:14.5px;border-color:#ffd98a73}.toast.out{animation:toastOut .4s ease-in forwards}@keyframes toastIn{0%{opacity:0;transform:translate(-12px)}to{opacity:1;transform:none}}@keyframes toastOut{to{opacity:0;transform:translateY(-6px)}}.side{position:absolute;right:12px;bottom:calc(196px + var(--safe-b));display:grid;gap:8px}.pill{display:grid;justify-items:center;gap:1px;min-width:62px;padding:8px 10px;border-radius:14px;border:1px solid var(--line);background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.pill span{font-size:10px;color:var(--dim)}.pill b{font-size:13px;font-weight:500}.dock{position:absolute;left:0;right:0;bottom:0;padding:8px 10px calc(10px + var(--safe-b));background:linear-gradient(180deg,#03040a00,#03040ac7 30%)}.hint{text-align:center;font-size:12.5px;color:var(--sub);min-height:18px;margin-bottom:6px;text-shadow:0 1px 4px #000}.hint b{color:var(--gold);font-weight:500}.radius{display:flex;justify-content:center;gap:6px;margin-bottom:6px}.radius button{padding:5px 14px;border-radius:999px;border:1px solid var(--line);background:var(--glass);font-size:12px}.radius button.on{border-color:var(--gold);color:var(--gold)}.groups{display:flex;justify-content:center;gap:6px;margin-bottom:8px}.groups button{padding:5px 16px;border-radius:999px;border:1px solid var(--line);background:#00000059;font-size:13px;color:var(--sub);font-family:var(--serif)}.groups button.on{color:var(--ink);background:var(--glass2);border-color:#ffffff40}.powers{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px 2px 4px;justify-content:safe center}.powers::-webkit-scrollbar{display:none}.pw{flex:0 0 auto;width:74px;padding:8px 4px 7px;border-radius:16px;border:1px solid var(--line);background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:grid;justify-items:center;gap:4px;transition:transform .15s,border-color .2s,background .2s}.pw svg{width:30px;height:30px;color:var(--gold)}.pw span{font-size:12px;white-space:nowrap}.pw.on{border-color:var(--gold);background:#ffd98a29;transform:translateY(-3px);box-shadow:0 8px 24px #f0b55240}.pw.wrath svg{color:#ff9a7a}.pw.kind svg{color:#9de8b0}.card-pop{position:absolute;left:12px;right:12px;bottom:calc(190px + var(--safe-b));max-width:420px;padding:14px;border-radius:18px;background:var(--glass2);border:1px solid var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font-size:13px;line-height:1.6;box-shadow:0 10px 30px #00000073;animation:rise .3s ease-out both;max-height:46vh;overflow-y:auto}.card-pop h3{margin:0 0 4px;font-family:var(--serif);font-size:18px}.card-pop .meta{color:var(--sub);font-size:12px}.card-pop .animals{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:6px;margin-top:8px}.card-pop .animal{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#0003;padding:0;text-align:left}.card-pop .animal img{width:100%;display:block;aspect-ratio:16 / 11}.card-pop .animal span{display:block;padding:3px 6px 5px;font-size:11px}.card-pop .civline{margin-top:8px;padding:8px 10px;border-radius:10px;background:#ffd98a14;border:1px solid rgba(255,217,138,.2)}.card-pop .close{position:absolute;right:8px;top:8px;width:32px;height:32px;border:0;background:none;color:var(--dim);font-size:16px}#drawer{position:fixed;z-index:30;left:0;right:0;bottom:0;height:min(78dvh,720px);background:#0a0d18f0;border-top:1px solid var(--line);border-radius:22px 22px 0 0;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);display:flex;flex-direction:column;transform:translateY(100%);transition:transform .26s ease-out;box-shadow:0 -12px 40px #00000080}#drawer.open{transform:none}@media(min-width:900px){#drawer{left:auto;top:0;width:440px;height:100dvh;border-radius:0;border-top:0;border-left:1px solid var(--line);transform:translate(100%)}#drawer.open{transform:none}.card-pop{bottom:calc(190px + var(--safe-b))}}.drawer-head{display:flex;gap:6px;align-items:center;padding:10px 10px 6px 12px;border-bottom:1px solid var(--line)}.drawer-tabs{display:flex;gap:4px;overflow-x:auto;flex:1;scrollbar-width:none}.drawer-tabs::-webkit-scrollbar{display:none}.drawer-tabs button{flex:0 0 auto;padding:7px 12px;border-radius:999px;border:1px solid transparent;background:none;color:var(--sub);font-family:var(--serif);font-size:14px}.drawer-tabs button.on{color:var(--ink);background:#ffffff14;border-color:var(--line)}.drawer-head .close{width:36px;height:36px;flex:0 0 auto}.drawer-body{flex:1;overflow-y:auto;padding:10px 12px calc(20px + var(--safe-b));overscroll-behavior:contain}.chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:10px}.chips button{padding:5px 11px;border-radius:999px;border:1px solid var(--line);background:none;color:var(--sub);font-size:12px}.chips button.on{color:var(--gold);border-color:#ffd98a80}.chips .count{font-size:12px;color:var(--sub);margin-right:auto}.chron{list-style:none;margin:0;padding:0}.chron li{display:grid;grid-template-columns:8px auto 1fr;gap:4px 8px;padding:8px 4px;border-bottom:1px solid rgba(255,255,255,.05);font-size:13px;line-height:1.6;cursor:pointer}.chron li.w2{font-family:var(--serif);font-size:14px}.chron li.w0{color:var(--sub);font-size:12.5px}.chron .dot{width:8px;height:8px;border-radius:50%;margin-top:7px}.chron .yr{color:var(--dim);font-size:11px;white-space:nowrap;margin-top:2px;font-variant-numeric:tabular-nums}.chron .tx{grid-column:3}.chron li .tx,.chron li .yr{grid-column:2 / 4}.chron .empty{color:var(--dim);text-align:center;padding:30px;grid-template-columns:1fr}h3.clade{margin:14px 2px 8px;font-family:var(--serif);font-size:15px;display:flex;align-items:center;gap:8px}h3.clade:before{content:"";width:10px;height:10px;border-radius:3px;background:var(--c)}h3.clade small{color:var(--dim);font-family:var(--sans);font-size:12px}.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(102px,1fr));gap:8px}.cards .card{padding:0;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#ffffff08;text-align:left}.cards .card img{width:100%;display:block;aspect-ratio:16 / 11}.cards .card b{display:block;padding:5px 7px 0;font-size:12px;font-weight:500;line-height:1.4}.cards .card small{display:block;padding:0 7px 6px;font-size:10.5px;color:var(--dim)}.cards .card.gone img{filter:grayscale(1) brightness(.7)}.back{border:0;background:none;color:var(--gold);padding:4px 0 10px;font-size:13px}.detail h2{font-family:var(--serif);margin:10px 0 4px;font-size:22px;display:flex;align-items:center;gap:8px}.detail img.big{width:100%;border-radius:14px;display:block}.tags{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 10px}.tags span{font-size:11.5px;padding:3px 9px;border-radius:999px;background:#ffffff14}.tags .gold{background:#ffd98a2e;color:var(--gold)}.tags .gray{color:var(--dim)}dl{display:grid;grid-template-columns:52px 1fr;gap:6px 10px;font-size:13px;line-height:1.6;margin:0 0 12px}dt{color:var(--dim)}dd{margin:0}dd small{color:var(--sub)}.link{border:0;background:#ffffff12;border-radius:8px;padding:2px 8px;margin:2px 4px 2px 0;font-size:12.5px;color:var(--gold)}.bar{display:grid;grid-template-columns:82px 1fr;gap:2px 10px;align-items:center;margin:7px 0;font-size:12px}.bar span{color:var(--sub)}.bar i,i.mini{display:block;height:6px;border-radius:3px;background:#ffffff14;overflow:hidden}.bar i b,i.mini b{display:block;height:100%;background:linear-gradient(90deg,#f0b552,#ffe3a3)}.bar em{grid-column:2;font-style:normal;color:var(--dim);font-size:11px}i.mini{width:100%;margin-top:4px}.hint{font-size:12px}.drawer-body .hint{color:var(--sub);text-align:left;line-height:1.7}canvas.tree,canvas.timeline{display:block;margin-bottom:10px}.civs{display:grid;gap:6px}.civ{display:grid;grid-template-columns:14px 1fr;gap:10px;text-align:left;padding:9px 10px;border-radius:12px;border:1px solid var(--line);background:#ffffff08}.civ.gone{opacity:.6}.civ b{font-family:var(--serif);font-size:15px;display:block}.civ small{display:block;color:var(--sub);font-size:11.5px;line-height:1.5}.swatch{width:12px;height:12px;border-radius:4px;display:inline-block;margin-top:4px;flex:0 0 auto}em.war{color:#ff8a7a;font-style:normal}.empty-big{text-align:center;color:var(--sub);line-height:2;padding:30px 10px}.empty-big small{color:var(--dim)}.graphs{display:grid;gap:14px}.graphs figure{margin:0}.graphs figcaption{font-size:12px;color:var(--sub);margin-bottom:4px}.witness{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}.wi{padding:10px;border-radius:12px;border:1px dashed var(--line);color:var(--dim)}.wi b{display:block;font-family:var(--serif);font-size:14px}.wi small{display:block;font-size:11.5px;line-height:1.5}.wi em{display:block;font-style:normal;font-size:10.5px;color:var(--dim);margin-top:4px}.wi.got{border-style:solid;border-color:#ffd98a59;color:var(--ink);background:#ffd98a0f}.wi.got small{color:var(--sub)}.modal{position:fixed;inset:0;z-index:40;display:grid;place-items:center;background:#0000008c;padding:18px}.modal-box{width:min(460px,100%);max-height:86dvh;overflow-y:auto;background:var(--glass2);border:1px solid var(--line);border-radius:20px;padding:20px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);line-height:1.8;font-size:14px;animation:rise .25s ease-out both}.modal-box h2{margin:0 0 10px;font-family:var(--serif);font-size:22px}.modal-box h3{margin:16px 0 4px;font-family:var(--serif);font-size:16px;color:var(--gold)}.modal-box p{margin:6px 0;color:var(--sub)}.modal-box .menu{display:grid;gap:8px}.modal-box .menu button{text-align:left}.setting{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}.setting small{display:block;color:var(--dim);font-size:11.5px}.setting input[type=checkbox]{width:22px;height:22px;accent-color:var(--gold2)}.setting input[type=range]{width:120px;accent-color:var(--gold2)}.coach{position:fixed;z-index:35;left:16px;right:16px;margin:0 auto;max-width:360px;bottom:calc(210px + var(--safe-b));padding:14px 16px;border-radius:16px;background:#ffecbef5;color:#2a1a05;font-size:14px;line-height:1.7;box-shadow:0 10px 30px #00000073;animation:rise .3s ease-out both}.coach b{font-family:var(--serif)}.coach button{margin-top:8px;float:right;border:0;background:#2a1a05;color:#ffe3a3;padding:6px 14px;border-radius:999px;font-size:13px}@media(max-height:640px){.stats{display:none}#toasts{top:calc(96px + var(--safe-t))}}@media(min-width:720px){.top{left:20px;right:20px}.stats,#toasts{left:20px}}@media(max-width:560px){.speed{top:calc(86px + var(--safe-t));right:12px}.stats{top:calc(134px + var(--safe-t));max-width:calc(100vw - 24px)}#toasts{top:calc(166px + var(--safe-t))}}@media(max-width:560px)and (max-height:640px){#toasts{top:calc(134px + var(--safe-t))}}