@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;900&display=swap');
:root{color-scheme:dark;--bg:#07111f;--panel:#102339;--line:#294860;--gold:#eec879;--cyan:#65d9ed;--muted:#8da5b9}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 40% 0,#173955 0,transparent 55%),var(--bg);color:#edf5fc;font:14px Cairo,system-ui,sans-serif;min-height:100vh}button,input,select{font:inherit}button{cursor:pointer;color:inherit}button:disabled{opacity:.4;cursor:not-allowed}button,.control{border:1px solid var(--line);background:#152c42;border-radius:9px;padding:10px 16px}button:hover{border-color:var(--cyan)}input,select{background:#091a2b;color:#edf5fc;border:1px solid #38536c;border-radius:7px;padding:10px;max-width:100%}input[type=number]{width:88px}input[type=color]{width:55px;height:44px;padding:4px}label{display:flex;gap:8px;align-items:center;flex-wrap:wrap;color:var(--muted)}.gold{background:linear-gradient(#efcf8b,#b98c42);border:1px solid #f8e0ab;color:#201b12;font-weight:800;box-shadow:0 4px 0 #765822,0 10px 28px #0005}.shell{display:grid;grid-template-columns:230px minmax(0,1fr);min-height:100vh}.sidebar{background:#081522d9;border-inline-end:1px solid var(--line);padding:28px 20px;display:flex;flex-direction:column;gap:10px}.crest{width:65px;height:73px;margin:0 auto 15px;display:grid;place-items:center;font-size:32px;color:var(--gold);background:linear-gradient(135deg,#345c72,#102238);clip-path:polygon(50% 0,100% 22%,91% 78%,50% 100%,9% 78%,0 22%);filter:drop-shadow(0 4px 5px #000)}.brand{text-align:center;font-size:19px;font-weight:900;direction:ltr}.eyebrow{font:11px system-ui;color:var(--gold);letter-spacing:3px;margin:8px 0 30px;text-align:center}.nav{display:flex;align-items:center;gap:12px;text-align:start;background:none;border-color:transparent;color:var(--muted)}.nav.active{background:linear-gradient(90deg,#1b3f55,#102638);border-color:#386779;color:#a9efff;box-shadow:inset 3px 0 #65d9ed}.sidefoot{margin-top:auto;color:var(--muted);font-size:11px;padding-top:35px}main{padding:26px 38px;min-width:0}.topbar{display:flex;justify-content:space-between;align-items:center;gap:12px}.langs{display:flex;gap:4px}.langs button{padding:6px 10px;background:transparent}.langs button.selected{color:var(--gold);border-color:#b58d4d}.status{color:var(--muted);font-size:12px}.demo{margin-top:24px;border:1px solid #695b36;background:#302a1e99;border-radius:8px;color:#edcf92;padding:10px 15px;font-size:12px}.hero{display:flex;justify-content:space-between;align-items:center;gap:25px;margin:24px 0}.hero h1{font-size:30px;margin:0 0 7px}.hero p{color:var(--muted);margin:0}.heroicon{font-size:65px;filter:drop-shadow(0 10px 0 #0005);transform:rotate(-12deg)}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:25px 0}.stat,.panel{background:linear-gradient(140deg,#18354a99,#0d1d30);border:1px solid var(--line);box-shadow:0 7px 0 #040b13,0 18px 35px #0003,inset 0 1px #ffffff0c;border-radius:14px}.stat{padding:20px 24px;position:relative;overflow:hidden}.stat small{color:var(--muted)}.stat strong{display:block;font-size:30px;color:var(--gold)}.stat:after{content:'◇';position:absolute;inset-inline-end:22px;top:17px;font-size:50px;color:#65d9ed29}.panel{padding:22px;margin-bottom:25px}.toolbar{display:flex;gap:15px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:22px}.inputs{display:flex;gap:18px;flex-wrap:wrap}.target{display:flex;gap:7px}.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:start}th{color:var(--muted);font-size:12px;font-weight:600;background:#081725;padding:15px;text-align:start}td{padding:19px 15px;border-bottom:1px solid #29435a77}tr:last-child td{border-bottom:0}.member{display:flex;gap:13px;align-items:center}.avatar{background:#213c51;color:#8fdbed;width:35px;height:35px;border-radius:10px;display:grid;place-items:center;font-weight:800}.buff{display:inline-grid;place-items:center;min-width:43px;padding:4px 12px;color:var(--gold);border:1px solid #a8884a;border-radius:8px;background:#40351d66;font-weight:900;font-size:19px}.rowbutton{background:none;border:0;padding:3px 8px;color:var(--muted)}.foot{color:var(--muted);font-size:12px;margin-top:17px;display:flex;justify-content:space-between}.empty{padding:30px;color:var(--muted);text-align:center}.maplayout{display:grid;grid-template-columns:minmax(0,1fr) 245px;gap:20px}.mapcanvas{overflow:auto;min-height:550px;max-height:760px;background:radial-gradient(#153750,#081523 70%);border-radius:12px}.mapcanvas svg{display:block;min-width:560px;width:100%;touch-action:pan-x pan-y}.tile{cursor:pointer;stroke:#426277;stroke-width:1.2;transition:filter .2s}.tile:hover{filter:brightness(1.65);stroke:#f1d396;stroke-width:2}.tile.chosen{stroke:#ffe39f;stroke-width:3}.tiletext{fill:#deedf6;font:9px system-ui;pointer-events:none;text-anchor:middle}.legend{display:grid;gap:10px;color:var(--muted);font-size:12px}.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-inline-end:7px}.stack{display:grid;gap:14px}.muted{color:var(--muted)}.pill{border:1px solid var(--line);border-radius:20px;padding:4px 10px;font-size:12px;color:var(--cyan)}dialog{background:#112438;color:#edf5fc;border:1px solid #42637c;border-radius:15px;width:min(520px,94vw);padding:28px;box-shadow:0 30px 100px #000b}dialog::backdrop{background:#020910bb;backdrop-filter:blur(5px)}dialog h2{margin-top:0}dialog form{display:grid;gap:18px}dialog label{justify-content:space-between}dialog input:not([type=checkbox]):not([type=number]){width:65%}.actions{display:flex;gap:10px;justify-content:flex-end}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#224257;padding:14px 24px;border:1px solid var(--cyan);border-radius:10px;z-index:10}.login{max-width:460px;margin:14vh auto}.login input{width:100%!important}a{color:var(--cyan)}@media(max-width:950px){.shell{grid-template-columns:80px minmax(0,1fr)}.sidebar{padding:20px 8px}.brand,.eyebrow,.nav span,.sidefoot{display:none}.crest{width:48px;height:55px}.nav{justify-content:center;font-size:21px}main{padding:20px}.maplayout{grid-template-columns:1fr}.mapaside{display:grid;grid-template-columns:1fr 1fr;gap:15px}}@media(max-width:600px){.shell{display:block}.sidebar{position:sticky;top:0;z-index:5;flex-direction:row;justify-content:center;padding:8px;background:#081522}.crest{display:none}.nav{padding:8px 17px}.topbar{flex-wrap:wrap}.hero h1{font-size:24px}.heroicon{display:none}.stats{gap:8px}.stat{padding:12px}.stat strong{font-size:23px}.stat:after{display:none}.panel{padding:14px}main{padding:16px}.target input{width:60px}.mapaside{display:block}.status{font-size:10px}td,th{padding:13px 8px}.foot{gap:10px;flex-wrap:wrap}}
