@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700;800&family=Rajdhani:wght@500;600;700&display=swap');
:root{color-scheme:dark;--cyan:#42ddff;--line:#226680;--muted:#89a9bf;--green:#41f5b4;--red:#ff627c}*{box-sizing:border-box}body{margin:0;background:#030e18;color:#d9f3ff;font:14px 'Noto Sans Thai',sans-serif;height:100dvh;display:flex;flex-direction:column;overflow:hidden}button,input,select{font:inherit}button{color:inherit;cursor:pointer;background:linear-gradient(#102f46,#071a2a);border:1px solid #316680;border-radius:5px;transition:border-color .2s,background .2s}button:hover,button:focus-visible{border-color:var(--cyan);box-shadow:0 0 12px #15c9ef35;outline:2px solid transparent}button:disabled{opacity:.45;cursor:default}input{min-width:0;background:#071b2c;color:#e4f8ff;border:1px solid #28566e;border-radius:5px;padding:10px}input:focus{outline:1px solid var(--cyan)}.frame{border:1px solid #38839d;box-shadow:inset 0 0 0 3px #071f32,inset 0 0 0 4px #174961,0 0 12px #18bce515;background:linear-gradient(140deg,#0d293cdd,#04121fed);border-radius:9px}.frame:before{pointer-events:none}header{display:flex;align-items:center;justify-content:space-between;height:77px;min-height:77px;padding:8px 22px;border-radius:0!important;border-top:3px solid var(--cyan)!important;background:linear-gradient(110deg,#071a29,#0a3248 50%,#061827)!important}header img{width:220px;max-height:54px}h1{font:700 34px/1 'Rajdhani',sans-serif;letter-spacing:6px;margin:0;color:#a2eeff;text-shadow:0 0 13px #14aede}h1 small{display:block;font:500 11px 'Noto Sans Thai';letter-spacing:2px;text-align:center;margin-top:7px;color:#7bacc2}header button{padding:10px;font-weight:600}.badge{font:700 10px 'Rajdhani';color:#ffc878;border:1px solid #a67c30;padding:3px 5px;margin-left:8px}.metrics{display:flex;gap:0;padding:10px 15px;margin:6px 7px;min-height:57px;justify-content:space-around;border-radius:5px}.metrics>div{display:flex;align-items:center;gap:12px;padding:0 22px;border-right:1px solid #27536c}.metrics>div:last-child{border:0}.metrics small{font-size:12px;color:#92b5ca}.metrics strong{font:700 27px 'Rajdhani';color:#b5e9ff}.metrics span{color:#5f869c;font-size:11px}.metrics .total strong{font:700 21px 'Rajdhani';color:var(--green)}main{flex:1;min-height:0;display:grid;grid-template-columns:77px minmax(0,1fr) 335px;gap:7px;padding:0 7px}nav{display:flex;flex-direction:column;padding:8px 4px;gap:12px}nav button{font-size:10px;padding:14px 1px;border-color:transparent;background:transparent}nav button b{display:block;font:32px/1.2 'Rajdhani';margin-bottom:6px;color:#8fbad3}button.selected{color:#8feeff;border-color:#2ad9ff;background:linear-gradient(#104b69,#063047);box-shadow:inset 0 -2px 0 #1cc7f5,0 0 12px #16c8fa20}nav button.selected b{color:#6be2ff}h2{font:700 17px 'Rajdhani';letter-spacing:1px;color:#8adff6;margin:0 0 12px}h2 small{font:10px 'Noto Sans Thai';color:#779bac;float:right}.workspace{min-width:0;position:relative;overflow:hidden;display:flex;flex-direction:column}.toolbar{display:flex;padding:10px;gap:9px;align-items:center;position:relative;z-index:3;background:#061928;flex-wrap:wrap;border-bottom:1px solid #235b72}.filters{display:flex;gap:6px;flex:1}.filters button{font-size:11px;padding:8px 10px;white-space:nowrap}.filters button[data-filter=gold]{color:#e6d69b}.filters button[data-filter=btc]{color:#ffac89}.search{display:flex;align-items:center;gap:6px;color:#65adc9}.search input{width:170px;padding:7px;font-size:11px}.prompt{display:flex;align-items:center;gap:12px;padding:9px 12px;border-top:1px solid #2c7c98;background:#061d2c}.prompt>span{font-size:26px;color:var(--cyan)}.prompt input{flex:1;opacity:.75;font-size:11px}.prompt button{font-size:22px;padding:3px 12px}#mapview{flex:1;min-height:0;position:relative;background:#102820;overflow:hidden}#viewport{position:absolute;inset:0;overflow:hidden;touch-action:none;cursor:grab;outline:none}#viewport:active{cursor:grabbing}#terrain{position:absolute;left:0;top:0;width:2600px;height:1733px;transform-origin:0 0;background:url('assets/world-terrain.png') center/100% 100%;will-change:transform}#terrain:after{content:'';position:absolute;inset:0;background:linear-gradient(#001d2910,transparent 20%,#00121c22);pointer-events:none}.region{position:absolute;top:140px;left:210px;color:#fff2ba;font:700 35px 'Rajdhani';letter-spacing:6px;text-shadow:0 2px 10px #000,0 0 30px #000;opacity:.9}.region small{font:600 22px 'Noto Sans Thai';letter-spacing:1px;display:block}.region.btc{left:1680px;color:#ffcfb2}.marker{position:absolute;display:flex;align-items:center;text-align:left;padding:7px 11px 7px 5px;width:188px;min-height:90px;z-index:2;background:linear-gradient(135deg,#0d3649f2,#02121cf5);border:2px solid #4accff;border-radius:10px;box-shadow:0 0 10px #00141e,0 0 15px #17b7ff66;transform:translate(-50%,-50%)}.marker:after{content:'';position:absolute;left:46%;bottom:-10px;border-left:8px solid transparent;border-right:8px solid transparent;border-top:9px solid #49cfff}.marker.selected{z-index:4;border-color:#e5fbff;box-shadow:0 0 22px #54e6ff}.marker.btc{border-color:#ff8c46;box-shadow:0 0 15px #d1463066}.marker.btc:after{border-top-color:#ff8c46}.soldier{background:url('assets/battle-soldier-atlas-v2.png') left center/200% 100%;width:56px;height:64px;flex-shrink:0}.btc .soldier{background-position:right center}.marker strong{font:700 20px 'Rajdhani';display:block;max-width:111px;overflow:hidden;text-overflow:ellipsis}.marker small{display:block;color:#c0e0ea;font-size:11px}.marker em{display:block;font:700 21px 'Rajdhani';font-style:normal}.marker .dot{position:absolute;right:7px;top:7px}.dot,i#connection-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#718697}.dot.on,i#connection-dot.on{background:#40f5b0;box-shadow:0 0 9px #3cfa9c}.positive{color:var(--green)!important}.negative{color:var(--red)!important}.muted{color:var(--muted)}.map-caption{position:absolute;left:14px;bottom:12px;padding:5px 9px;background:#041823b8;color:#c9e5eb;font-size:10px;border-radius:4px;pointer-events:none}.map-tools{position:absolute;bottom:54px;left:15px;display:flex;flex-direction:column;gap:4px}.map-tools button{height:33px;width:34px;font-size:21px}#minimap{position:absolute;width:149px;height:98px;right:12px;bottom:12px;background:url('assets/world-terrain.png') center/cover;border:2px solid #60c7e3;box-shadow:0 0 0 4px #092137}#minimap span{display:block;position:absolute;border:1px solid #fff8;pointer-events:none}#empty-map{position:absolute;top:45%;left:50%;transform:translateX(-50%);padding:14px 23px;background:#041826df;border:1px solid #3daac5;border-radius:7px;white-space:nowrap}aside{display:flex;flex-direction:column;min-height:0;overflow:auto;gap:8px;padding-bottom:1px}aside>section{padding:14px}.lumi{height:225px;min-height:225px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 20% 70%,#12668677,#061828 70%)}.section-title{font:700 17px 'Rajdhani';letter-spacing:1px;position:relative;z-index:2}.section-title span{font-size:12px;color:#82aeca}.section-title i{display:inline-block;background:#40ffc0;box-shadow:0 0 10px #3cffb9;border-radius:50%;width:7px;height:7px;margin-left:8px}.lumi-portrait{position:absolute;width:190px;height:178px;left:-18px;bottom:18px;background:url('assets/lumi-frontier-expressions-v2.png') 0 0/300% 200%;animation:lumi-breathe 5s ease-in-out infinite;pointer-events:none}.speech{position:absolute;left:139px;right:11px;top:53px;border:1px solid #3cacc9;border-radius:9px;background:#082338df;box-shadow:inset 0 0 16px #15b7dd1f;padding:10px;font-size:12px;line-height:1.8}.lumi-foot{position:absolute;bottom:0;left:0;right:0;background:#061b2bf0;border-top:1px solid #21586e;padding:6px 13px;font-size:10px;color:#88bdce}@keyframes lumi-breathe{50%{transform:translateY(-3px)}}.brief h2{border-bottom:1px solid #205269;padding-bottom:9px}.priority{display:flex;gap:11px;padding:9px;margin:6px 0;border:1px solid #276a86;border-radius:5px;font-size:12px;background:#092332;width:100%;text-align:left}.priority.warn{border-color:#c87a3c}.priority b{font:700 23px 'Rajdhani';color:#55d7f9}.priority small{display:block;font-size:10px;color:#8eafbf}.selected-portfolio{flex-shrink:0}.detail-title{font:700 24px 'Rajdhani';color:#d0f2ff;margin-bottom:6px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;font-size:12px}.detail-grid dt{font-size:10px;color:#7fa4b9}.detail-grid dd{margin:2px 0 0;overflow-wrap:anywhere}.detail-pnl{font:700 36px 'Rajdhani';margin:9px 0}.enter-battle{display:block;width:100%;padding:12px;margin-top:10px;border-color:#32d7f6;color:#d6faff;font-weight:700;background:linear-gradient(#125675,#07334d);box-shadow:inset 0 0 10px #2ac3ff44}.ai-note>span{color:#69bfd6;font:700 14px 'Rajdhani';letter-spacing:2px}.ai-note p{font-size:11px;line-height:1.8;color:#abc4d0}.ai-note small{font-size:10px;color:#6d8d9e}footer{height:32px;min-height:32px;display:flex;gap:18px;align-items:center;padding:0 16px;color:#7298ae;font-size:10px}footer>span:first-child{display:flex;gap:7px;align-items:center}footer button{margin-left:auto;padding:3px 12px;font-size:10px}#contentview{flex:1;min-height:0;overflow:auto;padding:20px;background:radial-gradient(ellipse at top,#0b3046,#04141f)}.page-title{font-size:25px;margin:0 0 6px}.page-desc{color:#87adbf;font-size:12px;margin:0 0 24px}.portfolio-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}.portfolio-card{text-align:left;padding:17px;line-height:1.8}.portfolio-card strong{font:700 25px 'Rajdhani';display:block}.portfolio-card small{font-size:11px;color:#97b7c9}.portfolio-card .detail-pnl{font-size:27px;margin:5px 0}.report-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:20px 0}.report-card{border:1px solid #21566e;border-radius:7px;padding:18px;background:#082337}.report-card span{font-size:11px;color:#8fbbce;display:block}.report-card strong{font:700 26px 'Rajdhani'}.ai-card{padding:20px;border:1px solid #27627e;border-radius:9px;margin-bottom:15px;background:#09283a}.ai-card h3{color:#7bddff;margin:0 0 8px}.ai-card p{color:#8cabbc;font-size:12px;line-height:1.8}.ai-card .tag{display:inline-block;background:#254153;border-radius:4px;padding:4px 8px;font-size:10px;color:#b3c4ce}dialog{background:linear-gradient(140deg,#10344b,#041521);color:#dff4ff;border:1px solid #4db6d6;border-radius:13px;width:min(560px,calc(100vw - 30px));padding:24px;box-shadow:0 20px 100px #000b;max-height:90dvh;overflow:auto}dialog::backdrop{background:#00101bdd;backdrop-filter:blur(7px)}.dialog-head{display:flex;justify-content:space-between;align-items:center;gap:15px;border-bottom:1px solid #255e77;margin-bottom:17px;padding-bottom:14px}.dialog-head h2{margin:0;font:700 20px 'Noto Sans Thai';letter-spacing:0}.dialog-head button{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;font-size:24px;line-height:1}#modal-body p{font-size:12px;color:#9fc0cf;line-height:1.9}#modal-body input{width:100%;margin-bottom:10px}#modal-body button{padding:10px 14px;margin:4px}.primary{background:linear-gradient(#116482,#0a354c);border-color:#47d5f7}.link-output{overflow-wrap:anywhere;font-size:11px;background:#051721;border:1px solid #316d80;padding:13px;user-select:all;margin:10px 0}.key-row{display:flex;align-items:center;gap:10px;border-bottom:1px solid #1c455b;padding:7px;font-size:11px}.key-row button{margin-left:auto!important;padding:5px 9px!important}#toast{position:fixed;z-index:20;bottom:45px;left:50%;transform:translateX(-50%);padding:12px 22px;border:1px solid #4db4d5;border-radius:8px;background:#0b2c40;box-shadow:0 10px 40px #0009;font-size:12px;max-width:90vw;text-align:center}[hidden]{display:none!important}@media(min-width:1650px){main{grid-template-columns:86px minmax(0,1fr) 380px}.lumi{min-height:250px}.lumi-portrait{width:220px;height:205px}.speech{left:165px;font-size:13px}.toolbar{flex-wrap:nowrap}.search input{width:200px}}@media(max-width:1100px){main{grid-template-columns:62px minmax(0,1fr) 275px}.metrics>div{padding:0 10px;gap:7px}.metrics small{font-size:10px}.filters button{font-size:10px;padding:6px}.toolbar{gap:6px}.search input{width:150px}.lumi-portrait{width:160px;height:150px;left:-20px}.speech{left:113px;font-size:11px}.metrics .total strong{font-size:18px}header img{width:180px}h1{font-size:28px;letter-spacing:4px}.lumi{min-height:218px;height:218px}}@media(max-width:800px){body{height:auto;min-height:100dvh;overflow:auto}header{height:65px;min-height:65px;padding:7px 12px}header img{width:130px}h1{font-size:20px;letter-spacing:2px}h1 small{font-size:8px;letter-spacing:0}header button{font-size:10px;padding:7px}.badge{display:none}.metrics{flex-wrap:wrap;padding:6px;gap:7px}.metrics>div{padding:0 6px;gap:6px}.metrics .total{flex-basis:100%;justify-content:center;border-top:1px solid #214b60;padding-top:5px}.metrics strong{font-size:22px}.metrics small{font-size:10px}main{display:flex;flex-direction:column;padding:0 6px;gap:7px}nav{flex-direction:row;padding:4px;gap:3px;order:0;justify-content:space-around}nav button{padding:6px;flex:1;font-size:10px}nav button b{font-size:19px;margin:0}.workspace{height:65dvh;min-height:470px;order:1}.toolbar{padding:7px}.filters{flex-basis:100%}.filters button{flex:1}.search{width:100%}.search input{width:100%;padding:6px}.prompt input{font-size:10px}.prompt{padding:6px 9px}aside{display:grid;grid-template-columns:1fr 1fr;overflow:visible;order:2}.selected-portfolio{grid-column:1/-1;grid-row:1}.detail-grid{grid-template-columns:repeat(3,1fr)}.lumi{min-height:225px}.speech{left:100px;font-size:10px}.lumi-portrait{left:-25px;width:150px;height:140px;bottom:30px}.section-title{font-size:14px}.section-title span{font-size:9px}.lumi-foot{font-size:8px}.brief{padding:12px}.brief h2{font-size:14px}.brief h2 small{display:none}.priority{font-size:10px;padding:7px}.ai-note{grid-column:1/-1}.ai-note p{display:inline;margin:0 10px}.ai-note small{display:block;margin-top:6px}footer{height:auto;padding:10px;font-size:9px;flex-wrap:wrap;gap:8px}#updated{max-width:55%}.map-caption{font-size:8px}#minimap{width:105px;height:70px}.map-tools{bottom:42px}.page-title{font-size:21px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.marker{transform:translate(-50%,-50%) scale(var(--marker-scale,1))}@media(max-width:800px){header img{width:112px}h1{font-size:17px;letter-spacing:1px}}
.metrics .total strong span{font:inherit}
