@media (min-width:1200px){
  main{max-width:1540px;padding-left:28px;padding-right:28px}
  .grid{gap:18px}
  .card{padding:15px}
}
@media (min-width:1600px){main{max-width:1680px}}

body{
  background:
    radial-gradient(circle at 9% 10%,rgba(171,236,215,.46),transparent 30%),
    radial-gradient(circle at 91% 8%,rgba(191,213,252,.52),transparent 28%),
    linear-gradient(180deg,#f8fbfa 0%,#f5f9f8 48%,#f8fafc 100%);
  background-attachment:fixed;
}
main{position:relative;isolation:isolate}
main:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:linear-gradient(120deg,transparent 0 42%,rgba(255,255,255,.34) 50%,transparent 58%);opacity:.55}
header{position:relative;overflow:hidden;background:linear-gradient(135deg,rgba(220,246,238,.94),rgba(230,239,252,.95));border:1px solid rgba(194,216,210,.92);box-shadow:0 22px 60px rgba(34,65,57,.12),inset 0 1px 0 rgba(255,255,255,.92),inset 0 -1px 0 rgba(119,157,146,.14)}
header:after{content:"";position:absolute;top:-70%;left:8%;width:42%;height:220%;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);pointer-events:none}
.kpis article{position:relative;overflow:hidden;background:linear-gradient(160deg,rgba(255,255,255,.98),rgba(250,253,252,.94));border:1px solid rgba(210,226,221,.92);box-shadow:0 12px 28px rgba(26,62,52,.08),0 2px 8px rgba(26,62,52,.05),inset 0 1px 0 #fff}
.kpis article:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:linear-gradient(180deg,#8bd5bd,#99bdf0);opacity:.72}
.kpis b{letter-spacing:-.5px;text-shadow:0 1px 0 #fff}
.card{position:relative;overflow:visible;border-color:rgba(213,229,224,.94);box-shadow:0 16px 34px rgba(29,61,52,.075),0 3px 10px rgba(29,61,52,.045),inset 0 1px 0 #fff;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
@media (hover:hover){.card:hover{transform:translateY(-2px);box-shadow:0 22px 45px rgba(29,61,52,.10),0 4px 12px rgba(29,61,52,.06),inset 0 1px 0 #fff;border-color:#c8dfd7}}
.card.done{box-shadow:0 18px 38px rgba(38,131,95,.15),inset 0 1px 0 rgba(255,255,255,.9)}
.cand{background:linear-gradient(155deg,#fbfdfc,#f5faf8);box-shadow:0 5px 14px rgba(35,66,57,.045),inset 0 1px 0 #fff}
button,label,input,select,textarea{transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease,background .15s ease}
button:hover,label:hover{border-color:#bfd6cf}
button:active{transform:translateY(1px)}
input:focus,select:focus,textarea:focus{outline:none;border-color:#86bba9;box-shadow:0 0 0 3px rgba(63,137,112,.10)}
.primary{background:linear-gradient(180deg,#edf9f4,#dff2ea);box-shadow:inset 0 1px 0 #fff,0 3px 8px rgba(45,110,87,.08)}
.toolbar button{background:rgba(255,255,255,.9);backdrop-filter:blur(8px);box-shadow:0 4px 12px rgba(32,64,55,.05)}

/* NDR AI — compact layered orb */
.aiFloat{
  position:fixed!important;left:20px!important;right:auto!important;bottom:20px!important;z-index:90!important;
  width:64px!important;height:64px!important;padding:0!important;border:0!important;border-radius:50%!important;
  display:grid!important;place-items:center!important;overflow:visible!important;color:#fff!important;
  background:conic-gradient(from 210deg,#5ee0b1,#8bbaf4,#b393f1,#63e3c1,#5ee0b1)!important;
  box-shadow:0 12px 30px rgba(23,63,52,.24),0 2px 8px rgba(23,63,52,.18)!important;
  transform:none!important;isolation:isolate!important;
}
.aiFloat:before{
  content:""!important;position:absolute!important;inset:3px!important;border-radius:50%!important;z-index:-1!important;
  background:radial-gradient(circle at 35% 24%,#31584c 0 10%,#14241f 42%,#0d1714 100%)!important;
  border:1px solid rgba(255,255,255,.22)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 -10px 22px rgba(0,0,0,.26)!important;
}
.aiFloat:after{content:""!important;position:absolute!important;inset:-7px!important;border:1px solid rgba(79,183,148,.22)!important;border-radius:50%!important;animation:ndrOrbit 5s linear infinite!important;pointer-events:none!important}
.aiCore{display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;transform:translateY(1px)}
.aiCore b{font-size:13px;letter-spacing:.8px;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.3)}
.aiCore small{font-size:8px;letter-spacing:1.6px;color:#aef8df;margin-top:4px}
.aiStatus{position:absolute;width:8px;height:8px;border-radius:50%;background:#83f0c8;left:8px;bottom:8px;border:2px solid #10201b;box-shadow:0 0 0 3px rgba(131,240,200,.12),0 0 10px rgba(131,240,200,.55)}
@media (hover:hover){.aiFloat:hover{transform:translateY(-3px)!important;box-shadow:0 18px 38px rgba(23,63,52,.3),0 3px 10px rgba(23,63,52,.2)!important}}
.aiFloat:focus-visible{outline:3px solid rgba(84,180,149,.28);outline-offset:5px}
@keyframes ndrOrbit{to{transform:rotate(360deg)}}

/* NDR AI — light glass conversation panel */
.panel{
  position:fixed!important;left:20px!important;right:auto!important;bottom:98px!important;z-index:89!important;
  width:min(360px,calc(100vw - 40px))!important;height:min(430px,58vh)!important;
  border:1px solid rgba(199,218,212,.9)!important;border-radius:24px!important;
  background:rgba(252,254,253,.94)!important;backdrop-filter:blur(22px) saturate(1.15)!important;
  box-shadow:0 28px 74px rgba(20,52,43,.18),0 8px 22px rgba(20,52,43,.08),inset 0 1px 0 rgba(255,255,255,.95)!important;
  overflow:hidden!important;
}
.panel.on{display:flex!important}
.phead{
  min-height:68px;padding:12px 14px!important;background:linear-gradient(135deg,rgba(246,251,249,.98),rgba(237,247,244,.98))!important;
  border-bottom:1px solid #e2ece8!important;color:#14201c!important;display:flex!important;align-items:center!important;justify-content:space-between!important;
}
.aiPanelTitle{display:flex;align-items:center;gap:10px}
.aiPanelMark{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;font-size:15px;font-weight:900;color:#fff;background:linear-gradient(145deg,#183f33,#255f4c);box-shadow:0 7px 16px rgba(28,80,62,.16),inset 0 1px 0 rgba(255,255,255,.2)}
.aiPanelTitle div{display:flex;flex-direction:column;gap:2px}
.aiPanelTitle b{font-size:14px;letter-spacing:.2px}
.aiPanelTitle small{font-size:10px;color:#75837e;font-weight:400}
.aiClose{width:34px;height:34px;padding:0!important;border-radius:11px!important;border:1px solid #dce7e3!important;background:#fff!important;color:#66736e!important;font-size:20px!important;line-height:1!important}
.quick{display:flex!important;gap:6px!important;padding:9px 10px!important;border-bottom:1px solid #e9f0ed!important;background:rgba(249,252,251,.95)!important;overflow-x:auto!important}
.quick button{font-size:10px!important;padding:7px 9px!important;white-space:nowrap!important;border-radius:999px!important;background:#fff!important;border:1px solid #dce8e3!important;color:#35423e!important;font-weight:700!important;box-shadow:none!important}
.chat{flex:1!important;overflow:auto!important;padding:12px!important;display:flex!important;flex-direction:column!important;gap:9px!important;background:linear-gradient(180deg,rgba(252,254,253,.9),rgba(247,251,249,.92))!important}
.aiWelcome{margin:auto;text-align:center;color:#8a9792;font-size:11px;max-width:210px;line-height:1.7}
.bot,.user{max-width:88%!important;padding:9px 11px!important;border-radius:15px!important;line-height:1.6!important;white-space:pre-wrap!important;font-size:12px!important;box-shadow:none!important}
.bot{background:#edf6f2!important;color:#1c2a25!important;align-self:flex-start!important;border-bottom-left-radius:5px!important}
.user{background:#183d32!important;color:#fff!important;align-self:flex-end!important;border-bottom-right-radius:5px!important}
.form{display:grid!important;grid-template-columns:1fr auto!important;gap:7px!important;padding:9px!important;border-top:1px solid #e5eeea!important;background:#fbfdfc!important;align-items:end!important}
.form textarea{min-height:42px!important;max-height:100px!important;resize:none!important;border-radius:13px!important;background:#fff!important;padding:10px 11px!important}
.form button{height:42px!important;padding:0 13px!important;border:0!important;border-radius:12px!important;background:#183d32!important;color:#fff!important;box-shadow:0 5px 13px rgba(24,61,50,.16)!important}

@media(max-width:760px){
  .aiFloat{left:12px!important;bottom:12px!important;width:58px!important;height:58px!important}
  .panel{left:10px!important;right:auto!important;bottom:82px!important;width:calc(100vw - 20px)!important;height:min(410px,62vh)!important;border-radius:20px!important}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}.aiFloat:after{animation:none!important}}