*{box-sizing:border-box}
:root{
 --navy:#0d2448;--green:#07963f;--green2:#08bd52;--soft:#f4f9fb;--card:#fff;
 --border:#dbe8ee;--muted:#6d8196;--cyan:#36b8e6;--shadow:0 8px 25px rgba(35,77,98,.08);
}
body{margin:0;background:#f2f8fb;color:var(--navy);font-family:Inter,Segoe UI,Arial,sans-serif}
button{font:inherit;color:inherit}
.top{height:84px;background:#fff;border-bottom:1px solid #e4eef2;display:grid;grid-template-columns:360px 1fr auto;align-items:center;padding:0 22px;gap:22px}
.brand{display:flex;align-items:center;gap:13px}.logo{width:54px;height:54px;display:grid;place-items:center;color:#087b3c}
.logo svg{width:48px;height:48px}.brand strong{font-size:27px;letter-spacing:.12em;font-weight:600;color:#073e35}.brand small{display:block;font-size:12px;letter-spacing:.05em;color:#365d79;margin-top:2px}
.nav{height:100%;display:flex;justify-content:center;gap:14px}.nav button{border:0;background:transparent;min-width:116px;padding:9px 13px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font-size:14px;cursor:pointer;border-radius:12px}
.nav button svg{width:25px;height:25px}.nav button.active{background:linear-gradient(#d8fae6,#ecfff3);color:#075e32;border-bottom:4px solid #11b94f;border-radius:13px 13px 0 0}
.person{display:flex;gap:12px}.personCard{min-width:160px;height:56px;border:1px solid var(--border);border-radius:12px;background:#fbfdfe;display:flex;align-items:center;gap:10px;padding:8px 13px}.personCard svg{color:#078a43}.personCard span{font-size:11px;color:var(--muted)}.personCard b{display:block;font-size:14px}

.shell{display:grid;grid-template-columns:190px minmax(700px,1fr) 270px;gap:12px;padding:12px}
.card{background:#fff;border:1px solid var(--border);border-radius:15px;box-shadow:var(--shadow)}
.leftCol{display:flex;flex-direction:column;gap:12px;min-width:0}.left{padding:10px;height:max-content}.left button{width:100%;border:0;background:transparent;border-radius:10px;padding:13px 11px;margin:2px 0;display:flex;align-items:center;gap:12px;text-align:left;cursor:pointer;font-size:14px}
.left button svg{width:25px}.left button.active{background:linear-gradient(135deg,#078d3c,#0fc954);color:#fff;box-shadow:0 6px 14px rgba(0,153,65,.2)}.left button:hover:not(.active){background:#edf9f2;color:#08793a}.left hr{border:0;border-top:1px solid var(--border);margin:8px 0}

.center{min-width:0}.viewer{padding:8px;position:relative}.stage{position:relative;height:min(590px,62vh);min-height:500px;border-radius:11px;overflow:hidden;background:#e8eef0}
.eye{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center;transform-origin:center;transition:.15s}
.irisMap{position:absolute;left:50%;top:50%;width:min(590px,68%);aspect-ratio:1;transform:translate(-50%,-50%);overflow:visible;transform-origin:center;transition:.15s}
.ring,.ray{fill:none;stroke:#53c9ef;stroke-width:1.15;opacity:.92}.major{stroke:#139ecf;stroke-width:1.6}.pupilRing{fill:none;stroke:#ffd20a;stroke-width:3}
.zone{fill:transparent;stroke:transparent;cursor:pointer;transition:.18s}.zone:hover{fill:rgba(33,204,82,.24);stroke:#19a94c;stroke-width:2}.zone.selected{fill:rgba(18,210,75,.52);stroke:#fff;stroke-width:2}
.pin{fill:#08b94d;stroke:#fff;stroke-width:4;pointer-events:none}
.zoom{position:absolute;left:15px;bottom:15px;display:flex;align-items:center;gap:4px;background:#fff;border:1px solid var(--border);border-radius:9px;padding:5px;box-shadow:var(--shadow)}.zoom button{width:34px;height:32px;border:0;background:#fff;border-radius:7px;display:grid;place-items:center;cursor:pointer}.zoom b{padding:0 8px;font-size:14px}

.floatInfo{position:absolute;right:12px;top:12px;width:325px;background:#fff;border:2px solid #b9efd0;border-radius:13px;overflow:hidden;box-shadow:0 14px 30px rgba(0,74,35,.18)}.floatHead{background:linear-gradient(135deg,#057c34,#0ba84a);color:#fff;padding:13px 16px;display:flex;align-items:center;gap:10px;font-size:20px;font-weight:700}.floatHead .close{margin-left:auto;cursor:pointer}.floatBody{padding:14px 16px;font-size:13px;line-height:1.5}.floatBody p{margin:0 0 10px}.floatBody ul{margin:4px 0 12px;padding-left:20px}.note{background:#dff9e9;color:#155d35;border-radius:9px;padding:10px}

.systemBar{margin-top:12px;padding:12px 15px}.systemBar h3{margin:0;font-size:16px}.regionHead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.regionHead h3 span{font-weight:400;color:#6d8196}.regionCount{font-size:11px;font-weight:700;color:#087d42;background:#e9fff2;border:1px solid #c9efda;border-radius:999px;padding:5px 9px;white-space:nowrap}.regionCatalog{max-height:310px;overflow-y:auto;padding-right:4px;scrollbar-width:thin}.regionGroup{margin-bottom:12px}.regionGroup:last-child{margin-bottom:0}.regionGroupTitle{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#647b8d;margin:0 0 6px 2px}.systems{display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:7px}.sys{border:1px solid #e1edf1;background:#f9fcfd;border-radius:10px;min-height:100px;padding:8px 4px 6px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:7px;cursor:pointer;font-size:10px;line-height:1.15;text-align:center;transition:.18s}.sys:hover{transform:translateY(-2px);box-shadow:0 7px 15px rgba(40,80,100,.10)}.sys.active{border:2px solid #19b950;background:#f0fff5}.sysIcon{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#fff;box-shadow:inset 0 -4px 10px rgba(0,0,0,.08)}.sysIcon svg{width:27px;height:27px;stroke-width:2.3}.c1{background:#079d3e}.c2{background:#058943}.c3{background:#ff9d1a}.c4{background:#ff315c}.c5{background:#ef35c5}.c6{background:#7950d9}.c7{background:#ed282d}.c8{background:#3b82e9}.c9{background:#08a53b}.c10{background:#2e83dc}.c11{background:#1db5d1}.c12{background:#ef3c83}.c13{background:#35a7e9}.c14{background:#ff8015}.c15{background:#995027}

.mapControl{padding:12px 10px}.mapControl h3{margin:0 0 4px;font-size:14px}.mapControl .sub{font-size:10px;color:var(--muted);margin-bottom:10px}.dpad{width:132px;height:132px;margin:2px auto 10px;display:grid;grid-template:repeat(3,1fr)/repeat(3,1fr);gap:5px}.dpad button,.sizeBtn{border:1px solid var(--border);background:#f9fcfd;border-radius:9px;display:grid;place-items:center;cursor:pointer;color:#08793a}.dpad button:hover,.sizeBtn:hover{background:#e9f9ef;border-color:#72d79a}.dpad .home{background:linear-gradient(135deg,#078d3c,#0fc954);color:#fff;border:0}.dpad svg{width:19px;height:19px}.sizeRow{display:grid;grid-template-columns:40px 1fr 40px;gap:5px;align-items:center}.sizeBtn{height:36px;font-size:20px;font-weight:700}.sizeLabel{text-align:center;font-size:10px;color:var(--muted)}.sizeLabel b{display:block;color:var(--navy);font-size:12px}.lockMap{width:100%;margin-top:9px;border:0;border-radius:9px;background:linear-gradient(135deg,#078d3c,#08ae49);color:#fff;padding:10px 6px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:7px}.lockMap.locked{background:#153b31}.mapReadout{text-align:center;font-size:9px;color:#7b8e9d;margin-top:7px}.mapControl.disabled .dpad,.mapControl.disabled .sizeRow{opacity:.42;pointer-events:none}
.right{display:flex;flex-direction:column;gap:12px}.right .card{padding:14px}.right h3{margin:0 0 10px;font-size:16px}.toggleRow{display:flex;justify-content:space-between;align-items:center;padding:8px 0;font-size:13px}.switch{width:44px;height:24px;border-radius:99px;background:#cbd9de;padding:3px;cursor:pointer;transition:.2s}.switch i{display:block;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 5px #809099;transition:.2s}.switch.on{background:#0a9543}.switch.on i{transform:translateX(20px)}.tools{display:grid;grid-template-columns:1fr 1fr;gap:8px}.tool{border:1px solid var(--border);background:#f9fcfd;border-radius:9px;padding:10px 5px;display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;font-size:12px}.primary{width:100%;margin-top:12px;border:0;border-radius:9px;background:linear-gradient(135deg,#078c3c,#08ae49);color:#fff;padding:14px 8px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}

.modalBack{display:none;position:fixed;inset:0;background:rgba(8,31,42,.48);z-index:50;place-items:center}.modalBack.open{display:grid}.modal{width:min(550px,92vw);background:#fff;border-radius:17px;padding:19px;box-shadow:0 25px 80px rgba(0,0,0,.25)}.modalTop{display:flex;justify-content:space-between;align-items:center}.modalTop h2{margin:0;font-size:20px}.form{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:15px}label{font-size:12px;font-weight:600}input,textarea{width:100%;margin-top:5px;border:1px solid var(--border);border-radius:9px;padding:10px;font:inherit}.full{grid-column:1/-1}.modalActions{display:flex;justify-content:flex-end;gap:8px;margin-top:13px}.secondary{border:1px solid var(--border);background:#fff;border-radius:9px;padding:10px 14px;cursor:pointer}

@media(max-width:1300px){.shell{grid-template-columns:170px 1fr 245px}.systems{grid-template-columns:repeat(auto-fill,minmax(76px,1fr))}.top{grid-template-columns:300px 1fr auto}}
@media(max-width:900px){.top{height:auto;grid-template-columns:1fr;padding:10px}.nav{overflow:auto;justify-content:flex-start}.person{display:none}.shell{grid-template-columns:1fr}.left{display:grid;grid-template-columns:repeat(3,1fr)}.right{display:grid;grid-template-columns:1fr 1fr}.stage{min-height:440px}.floatInfo{width:290px}}
.clockLabel{font-size:16px;font-weight:800;fill:#0d2448;paint-order:stroke;stroke:#fff;stroke-width:4px;stroke-linejoin:round;pointer-events:none}.rayMinor{stroke:#63c8e8;stroke-width:.8;opacity:.72;stroke-dasharray:3 3}.rayHour{stroke:#079ecf;stroke-width:1.8;opacity:.98}.ringRef{fill:none;stroke:#4fc2e6;stroke-width:1.05;opacity:.88}.ringRef.major{stroke:#078fbd;stroke-width:1.65}.pupilRef{fill:none;stroke:#ffd20a;stroke-width:3}.mapCenterDot{fill:#fff;stroke:#07963f;stroke-width:2}.sectorHit{fill:transparent;stroke:transparent;cursor:pointer}.sectorHit:hover,.sectorHit.selected{fill:rgba(18,210,75,.30);stroke:#fff;stroke-width:1.5}.sectorText{display:none}.saveAlignment{width:100%;border:1px solid var(--border);background:#f5fbf7;color:#08793a;border-radius:8px;padding:8px;margin-top:7px;font-size:11px;font-weight:700;cursor:pointer}.coordinateBadge{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:5;background:rgba(255,255,255,.94);border:1px solid var(--border);border-radius:8px;padding:6px 10px;font-size:11px;font-weight:700;box-shadow:var(--shadow);pointer-events:none}
.eyeBadge{position:absolute;left:18px;top:18px;z-index:6;background:rgba(5,45,39,.88);color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:9px;padding:7px 11px;font-size:12px;font-weight:800;letter-spacing:.02em;box-shadow:0 4px 14px rgba(0,0,0,.15)}
.exportBtn{background:#0b6b5d!important;margin-top:8px!important}

/* 007 -> 008: atalhos principais + seleção compacta das regiões */
.compactRegionPicker{padding:12px 15px}.regionPickerRow{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:14px;align-items:stretch}.mainShortcuts{display:grid;grid-template-columns:repeat(12,minmax(62px,1fr));gap:7px}.mainShortcuts .sys{min-height:91px;padding:7px 3px 5px}.mainShortcuts .sysIcon{width:42px;height:42px}.mainShortcuts .sysIcon svg{width:24px;height:24px}.regionSelectPanel{border-left:1px solid #e1edf1;padding-left:14px;display:grid;grid-template-columns:1fr;align-content:start;gap:5px}.regionSelectPanel label{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#647b8d;margin-top:1px}.regionSelectPanel select{width:100%;height:36px;border:1px solid #d9e7ec;border-radius:8px;background:#fff;color:#17314b;padding:0 34px 0 10px;font:600 12px inherit;outline:none}.regionSelectPanel select:focus{border-color:#14ad55;box-shadow:0 0 0 3px rgba(20,173,85,.10)}.selectHint{margin-top:4px;display:flex;gap:7px;align-items:flex-start;color:#6d8196;font-size:10px;line-height:1.3}.selectHint svg{width:15px;height:15px;flex:none;color:#0a9b48}.regionCatalog{display:none!important}@media(max-width:1250px){.regionPickerRow{grid-template-columns:1fr}.regionSelectPanel{border-left:0;border-top:1px solid #e1edf1;padding:10px 0 0}.mainShortcuts{grid-template-columns:repeat(6,minmax(70px,1fr))}}@media(max-width:800px){.mainShortcuts{grid-template-columns:repeat(4,minmax(68px,1fr))}}


/* 008 -> 009: atalhos menores e seleção em faixa própria */
.regionPickerRow{display:block}
.mainShortcuts{grid-template-columns:repeat(12,minmax(54px,1fr));gap:6px}
.mainShortcuts .sys{min-height:78px;padding:6px 2px 5px;font-size:9px;gap:5px}
.mainShortcuts .sysIcon{width:36px;height:36px}
.mainShortcuts .sysIcon svg{width:21px;height:21px}
.regionSelectPanel{margin-top:10px;border-left:0;border-top:1px solid #e1edf1;padding:10px 0 0;display:grid;grid-template-columns:110px minmax(180px,1fr) 130px minmax(220px,1.4fr);gap:7px 10px;align-items:center}
.regionSelectPanel label{margin:0}
.regionSelectPanel select{height:34px}
.regionSelectPanel .selectHint{grid-column:1/-1;margin-top:1px}
@media(max-width:1250px){.mainShortcuts{grid-template-columns:repeat(6,minmax(64px,1fr))}.regionSelectPanel{grid-template-columns:100px 1fr 115px 1fr}}
@media(max-width:800px){.mainShortcuts{grid-template-columns:repeat(4,minmax(62px,1fr))}.regionSelectPanel{grid-template-columns:1fr}.regionSelectPanel label{margin-top:4px}}
/* 010 — destaque da região selecionada */
.sectorHit.selected{fill:rgba(20,190,82,.46);stroke:#13a34b;stroke-width:2.2;filter:drop-shadow(0 0 3px rgba(14,128,58,.35))}

.addAnalysis{width:100%;margin-top:10px;border:0;border-radius:9px;background:#07963f;color:#fff;padding:11px 12px;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:7px}.addAnalysis:hover{background:#078638}.addAnalysis svg{width:17px;height:17px}