:root{--bg:#07111f;--panel:#0d1b2d;--panel-2:#101f34;--line:#20334d;--line-soft:#192b42;--text:#edf5ff;--muted:#8fa5c0;--blue:#4b8dff;--blue-soft:#183b70;--green:#32d296;--red:#ff6474;--amber:#ffbd59;--shadow:0 22px 60px rgba(0,0,0,.24)}
*{box-sizing:border-box}
html{color-scheme:dark}
body{margin:0;min-height:100vh;background:radial-gradient(circle at 12% -8%,rgba(45,127,249,.18),transparent 31%),radial-gradient(circle at 92% 5%,rgba(38,194,129,.07),transparent 24%),var(--bg);color:var(--text);font-family:Inter,"Segoe UI",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit}h1,h2,h3,p{margin:0}
.topbar{min-height:78px;padding:0 max(24px,4vw);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;border-bottom:1px solid rgba(32,51,77,.8);background:rgba(7,17,31,.84);backdrop-filter:blur(18px);position:sticky;top:0;z-index:10}
.brand{display:inline-flex;align-items:center;gap:11px;width:max-content;text-decoration:none}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(75,141,255,.42);border-radius:12px;background:linear-gradient(145deg,#2976e9,#174380);box-shadow:0 8px 24px rgba(45,127,249,.22);font-size:18px;font-weight:900}.brand>span:last-child{display:flex;flex-direction:column;gap:2px}.brand small{color:#7792b2;font-size:9px;font-weight:800;letter-spacing:1.65px}.brand strong{font-size:15px;letter-spacing:-.2px}
.primary-nav{display:flex;align-items:center;padding:5px;border:1px solid var(--line-soft);border-radius:13px;background:rgba(12,27,46,.75)}.primary-nav a{display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:9px;color:var(--muted);font-size:12px;font-weight:700;text-decoration:none;transition:.2s}.primary-nav a:hover{color:var(--text)}.primary-nav a.active{color:#fff;background:#1c3557;box-shadow:inset 0 0 0 1px rgba(101,158,255,.15)}.primary-nav a span{color:#6ea7ff;font-size:13px}
.header-actions{display:flex;align-items:center;justify-content:flex-end;gap:14px}.connection{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:12px}.connection i{width:8px;height:8px;border-radius:50%;background:var(--amber);box-shadow:0 0 12px var(--amber)}.connection.live i{background:var(--green);box-shadow:0 0 12px var(--green)}.logout{padding:8px 12px;border:1px solid var(--line);border-radius:9px;color:#a7b8cc;text-decoration:none;font-size:11px;font-weight:700;transition:.2s}.logout:hover{border-color:#3b587b;color:#fff;background:#10223a}
main{width:min(1440px,92vw);margin:38px auto 64px}.eyebrow{display:block;margin-bottom:8px;color:#71a9ff;font-size:9px;font-weight:900;letter-spacing:2.1px}.page-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:25px}.page-heading h1,.report-heading h1{font-size:clamp(26px,3vw,38px);letter-spacing:-1.25px;line-height:1.08}.page-heading p,.report-heading p{margin-top:10px;color:var(--muted);font-size:13px;line-height:1.6}.updated-pill{padding:9px 12px;border:1px solid var(--line-soft);border-radius:9px;background:rgba(14,29,49,.65);color:var(--muted);font-size:11px;white-space:nowrap}
.summary{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}.summary article,.panel,.report-stats article{background:linear-gradient(145deg,rgba(17,34,57,.96),rgba(10,24,41,.96));border:1px solid var(--line);box-shadow:var(--shadow)}.summary article{min-height:142px;padding:21px 23px;border-radius:17px;position:relative;overflow:hidden}.summary article:after{content:"";position:absolute;right:-24px;top:-32px;width:104px;height:104px;border:20px solid rgba(75,141,255,.035);border-radius:50%}.summary span{color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:1.1px}.summary b{display:block;margin:9px 0 6px;font-size:36px;line-height:1}.summary small{color:#647d9a;font-size:10px}.summary .good b{color:var(--green)}.summary .bad b{color:var(--red)}.summary .warn b{color:var(--amber)}
.panel{padding:23px;border-radius:18px;margin-bottom:18px}.panel-title{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:19px}.panel-title h2{font-size:19px;letter-spacing:-.35px}.panel-hint{color:#667f9d;font-size:10px}.text-link{color:#83b2fa;font-size:11px;font-weight:700;text-decoration:none}.text-link span{display:inline-block;margin-left:5px;transition:.2s}.text-link:hover span{transform:translateX(3px)}
.device-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.device{padding:17px;border:1px solid var(--line-soft);border-radius:13px;background:rgba(7,20,35,.76);transition:.2s}.device:hover{transform:translateY(-2px);border-color:#365b86;background:#0b1a2d}.device-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.device-label{display:block;margin-bottom:4px;color:#54708e;font-size:8px;font-weight:800;letter-spacing:1.4px}.device h3{font-size:17px}.badge{display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:20px;font-size:9px;font-weight:900}.badge i{width:5px;height:5px;border-radius:50%;background:currentColor}.CALISIYOR .badge{color:#6de8b3;background:#123d31}.HATA{border-color:#71303d;background:#231522}.HATA .badge{color:#ff8995;background:#4c1d29}.STANDBY .badge,.OFFLINE .badge{color:#ffd17a;background:#49351b}.device-meta{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:23px;padding-top:12px;border-top:1px solid var(--line-soft);font-size:9px}.device-meta span{color:#617b9a;text-transform:uppercase;letter-spacing:.7px}.device-meta time{color:#9cafc4}
.history{max-height:410px;overflow:auto;padding-right:5px}.history::-webkit-scrollbar,.daily::-webkit-scrollbar{width:7px;height:7px}.history::-webkit-scrollbar-thumb,.daily::-webkit-scrollbar-thumb{border-radius:10px;background:#29415f}.event{display:grid;grid-template-columns:145px 90px 1fr;align-items:center;gap:18px;padding:13px 6px;border-bottom:1px solid var(--line-soft);font-size:12px}.event:last-child{border-bottom:0}.event time{color:#718aa8}.event b{font-size:12px}.event>span{display:flex;align-items:center;gap:10px}.event em{color:#8196af;font-style:normal}.event i{color:#49627e;font-style:normal}.status-text{font-size:10px}.status-text.CALISIYOR{color:var(--green)}.status-text.HATA{color:var(--red)}.status-text.STANDBY,.status-text.OFFLINE{color:var(--amber)}
.report-hero{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:23px;padding:4px 0 2px}.report-heading{max-width:760px}.date-control{min-width:295px;padding:13px 14px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(145deg,#102039,#0b1728);box-shadow:var(--shadow)}.date-control label{display:block;margin-bottom:8px;color:#6f88a6;font-size:9px;font-weight:800;letter-spacing:1px;text-transform:uppercase}.date-control>div{display:flex;gap:8px}.date-control input{flex:1;min-width:0}.date-control button{padding:9px 13px;border:1px solid #326abb;border-radius:9px;background:#15365f;color:#dceaff;font-size:10px;font-weight:800;cursor:pointer}.date-control button:hover{background:#1d4b83}
input[type=date]{padding:9px 11px;border:1px solid var(--line);border-radius:9px;background:#071321;color:var(--text);color-scheme:dark;font:inherit;font-size:11px;outline:0}input[type=date]:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(75,141,255,.12)}
.report-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:18px}.report-stats article{display:flex;align-items:center;gap:13px;min-height:92px;padding:17px 19px;border-radius:15px}.metric-icon{display:grid;place-items:center;flex:0 0 38px;height:38px;border-radius:11px;font-size:15px;font-weight:900}.metric-icon.blue{color:#83b4ff;background:#173968}.metric-icon.green{color:#6be9b1;background:#123d31}.metric-icon.red{color:#ff8b97;background:#4a1d28}.metric-icon.amber{color:#ffd078;background:#48351d}.report-stats small{display:block;margin-bottom:5px;color:#7289a5;font-size:9px;font-weight:800;letter-spacing:.7px;text-transform:uppercase}.report-stats b{font-size:19px;letter-spacing:-.4px}
.report-panel{padding:0;overflow:hidden}.report-panel-title{padding:21px 23px;margin:0;border-bottom:1px solid var(--line)}.report-legend{display:flex;gap:14px;color:#7890ac;font-size:9px}.report-legend span:before{content:"";display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%}.legend-good:before{background:var(--green)}.legend-bad:before{background:var(--red)}.legend-warn:before{background:var(--amber)}
.daily{overflow:auto}.daily table{width:100%;border-collapse:collapse;font-size:11px}.daily th,.daily td{text-align:left;padding:15px 14px;border-bottom:1px solid var(--line-soft);white-space:nowrap}.daily th{background:rgba(7,20,35,.46);color:#7189a6;font-size:9px;font-weight:800;letter-spacing:.6px;text-transform:uppercase}.daily tbody tr{transition:.18s}.daily tbody tr:hover{background:rgba(28,53,87,.28)}.daily tbody tr:last-child td{border-bottom:0}.daily td:first-child{padding-left:23px}.daily th:first-child{padding-left:23px}.device-name{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800}.device-name i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 9px rgba(50,210,150,.55)}.daily td:first-child small{display:block;margin:4px 0 0 15px;color:#607a99;font-size:8px}.duration{font-size:11px}.good-text{color:#66dfab}.bad-text{color:#ff8490}.warn-text{color:#f7c870}.muted-text{color:#8ea1b9}.fault-count{display:inline-grid;place-items:center;min-width:25px;height:25px;padding:0 7px;border-radius:8px;background:#14243a;color:#8197b2;font-weight:800}.fault-count.has-fault{background:#4b1e2a;color:#ff919c}.recoveries{display:flex;flex-wrap:wrap;gap:5px}.recovery,.no-fault{padding:5px 8px;border-radius:7px;font-size:9px}.recovery i{font-style:normal;font-weight:900}.recovery.resolved{color:#73deb0;background:#12382e}.recovery.open{color:#ffacb4;background:#451d28}.no-fault{color:#7187a2;background:#122238}.report-note{display:flex;align-items:center;gap:10px;margin:4px 2px 0;color:#7087a3;font-size:10px}.report-note>span{display:grid;place-items:center;width:19px;height:19px;border:1px solid #29496e;border-radius:50%;color:#72aaff;font-weight:800}
.empty{grid-column:1/-1;padding:34px 12px;color:var(--muted);text-align:center;font-size:11px}.empty.loading:before{content:"";display:inline-block;width:13px;height:13px;margin-right:9px;border:2px solid #2b4668;border-top-color:var(--blue);border-radius:50%;vertical-align:-3px;animation:spin .8s linear infinite}.empty.error{color:#ff8e99}@keyframes spin{to{transform:rotate(360deg)}}
.login-page{display:grid;place-items:center;padding:24px}.login-card{width:min(430px,100%);padding:34px;background:linear-gradient(145deg,#102039,#0b1728);border:1px solid var(--line);border-radius:20px;box-shadow:0 30px 80px #0008}.login-card h1{font-size:27px}.login-card h1 strong{color:var(--blue)}.login-card p{margin:9px 0 25px;color:var(--muted)}.login-card label{display:block;margin:16px 0;color:var(--muted);font-size:12px}.login-card input{display:block;width:100%;margin-top:7px;padding:13px;border:1px solid var(--line);border-radius:9px;background:#071321;color:var(--text)}.login-card button{width:100%;padding:13px;border:0;border-radius:9px;background:var(--blue);color:white;font-weight:800;cursor:pointer}.login-error{padding:11px;border-radius:8px;background:#4d1d28;color:#ff9ba5;font-size:12px}
@media(max-width:1050px){.topbar{grid-template-columns:1fr auto}.primary-nav{grid-row:2;grid-column:1/-1;justify-self:center;margin-top:-9px;margin-bottom:10px}.device-grid{grid-template-columns:repeat(2,1fr)}.report-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){main{width:min(94vw,680px);margin-top:25px}.topbar{padding:13px 4vw;gap:12px}.connection{display:none}.page-heading,.report-hero{align-items:flex-start;flex-direction:column}.updated-pill{align-self:flex-start}.summary{grid-template-columns:repeat(2,1fr)}.report-hero{gap:21px}.date-control{width:100%;min-width:0}.report-panel-title{align-items:flex-start;flex-direction:column}.daily{overflow:visible}.daily table,.daily thead,.daily tbody,.daily tr,.daily td{display:block}.daily thead{display:none}.daily tbody{padding:10px}.daily tr{margin-bottom:10px;padding:12px;border:1px solid var(--line-soft);border-radius:13px;background:rgba(7,20,35,.55)}.daily td,.daily td:first-child{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:9px 6px;border-bottom:1px solid var(--line-soft);white-space:normal;text-align:right}.daily td:last-child{border-bottom:0}.daily td:before{content:attr(data-label);color:#6f87a3;font-size:9px;font-weight:800;text-transform:uppercase}.daily td:first-child small{display:none}.recoveries{justify-content:flex-end}.event{grid-template-columns:110px 60px 1fr}}
@media(max-width:520px){.brand small{display:none}.brand strong{font-size:13px}.brand-mark{width:34px;height:34px}.primary-nav{width:100%}.primary-nav a{flex:1;justify-content:center;padding:9px 7px;font-size:10px}.logout{padding:7px 9px}.summary,.report-stats,.device-grid{grid-template-columns:1fr}.summary article{min-height:124px}.page-heading h1,.report-heading h1{font-size:27px}.event{grid-template-columns:1fr 55px}.event time{grid-column:1/-1}.report-legend{display:none}}