:root{--ui-radius:16px;--ui-border:#e5e8e0;--ui-canvas:#f5f6f2;--ui-shadow:0 12px 36px rgba(20,24,18,.065);--ui-shadow-hover:0 18px 45px rgba(20,24,18,.1)}
button,select,input{font:inherit}.demo-app{font-family:Inter,"Segoe UI",Arial,sans-serif}.demo-main{background:radial-gradient(circle at 92% 0,rgba(255,229,0,.055),transparent 28%),var(--ui-canvas)}
.demo-sidebar{box-shadow:10px 0 35px rgba(0,0,0,.08)}.demo-sidebar nav button{min-height:44px}.demo-topbar{box-shadow:0 3px 16px rgba(22,26,20,.035)}.demo-content{width:100%;box-sizing:border-box}.view-heading{padding-bottom:4px}.view-heading small{color:#858a80}.view-heading h2{line-height:1.08}.view-heading p{line-height:1.55}
.stat-grid article,.chart-card,.allocation-card,.table-card,.asset-grid article,.plan-grid article,.network-stat,.referral-tree,.location-list,.fake-map,.lesson-grid button,.settings-form,.settings-profile-card,.network-insights>article{border-radius:var(--ui-radius);border-color:var(--ui-border);box-shadow:var(--ui-shadow)}
.stat-grid article,.chart-card,.allocation-card,.table-card,.asset-grid article,.plan-grid article,.network-stat,.lesson-grid button,.network-insights>article{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.asset-grid article:hover,.lesson-grid button:hover,.network-insights>article:hover{transform:translateY(-2px);box-shadow:var(--ui-shadow-hover);border-color:#d8dbd2}
.outline,.yellow,.select-plan,.auth-submit,.settings-actions button{min-height:42px;border-radius:9px;font-weight:850;letter-spacing:.01em}.yellow,.auth-submit{box-shadow:0 7px 18px rgba(203,182,0,.18)}.yellow:hover,.auth-submit:hover{filter:brightness(.98);transform:translateY(-1px)}
.filters select,.filters input,.card-head select,.demo-language-picker select,.auth-panel-top select{border-radius:9px;border-color:#dfe2da;background-color:#fafbf8}.table-head{background:#f7f8f4;border-radius:8px}.table-row:not(.table-head):hover{background:#fafbf7}.notification-button,.demo-avatar{box-shadow:inset 0 0 0 1px rgba(0,0,0,.045)}
.auth-screen{grid-template-columns:minmax(0,1.12fr) minmax(430px,.88fr);background:#f4f5f1}.auth-visual{isolation:isolate;padding:5.5vh 5vw;background:radial-gradient(circle at 78% 42%,#2b2d26 0,#171815 28%,#10110f 68%);border-radius:0 30px 30px 0}.auth-visual:before{width:720px;height:720px;right:-235px;top:-245px;border-color:rgba(255,255,255,.08);box-shadow:0 0 0 90px rgba(255,255,255,.018),0 0 0 180px rgba(255,255,255,.012)}.auth-visual:after{display:none}.auth-visual>.keetaa-wordmark{box-shadow:0 10px 35px rgba(255,229,0,.13)}.auth-visual h1{font-size:clamp(54px,5.6vw,91px);max-width:700px}.auth-visual p{color:#aeb2aa}.auth-metrics{gap:10px}.auth-metrics span{min-width:120px;padding:14px 16px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.035);backdrop-filter:blur(8px)}.auth-metrics b{color:#fff}.auth-metrics small{color:#8e9388}
.auth-network-visual{position:absolute!important;right:4%;top:50%;width:39%;aspect-ratio:1;transform:translateY(-50%);z-index:1!important}.network-orbit{position:absolute;inset:11%;border:1px solid rgba(255,229,0,.26);border-radius:50%;transform:rotate(24deg) scaleY(.62)}.orbit-two{inset:1%;border-color:rgba(255,255,255,.09);transform:rotate(-31deg) scaleY(.74)}.auth-device{position:absolute;left:50%;top:50%;width:112px;height:178px;transform:translate(-50%,-50%) rotate(8deg);border-radius:25px;background:linear-gradient(150deg,#ffe500,#e4cd00);color:#111;box-shadow:24px 32px 65px rgba(0,0,0,.42);display:flex;flex-direction:column;align-items:center;padding:18px;box-sizing:border-box}.auth-device small{align-self:flex-start;color:#111;font-size:7px}.auth-device b{font-size:39px;margin:auto 0 2px;letter-spacing:-.06em}.auth-device i{width:42px;height:4px;border-radius:5px;background:#111;margin-top:5px;opacity:.85}.auth-device em{font-size:6px;font-style:normal;font-weight:900;margin-top:auto;letter-spacing:.13em}.network-node{position:absolute;width:11px;height:11px;border-radius:50%;background:#ffe500;box-shadow:0 0 0 7px rgba(255,229,0,.1)}.node-one{left:6%;top:33%}.node-two{right:6%;top:24%}.node-three{right:12%;bottom:21%}
.auth-panel{padding:4vh 4.5vw;background:linear-gradient(135deg,#f8f9f5,#eef0ea)}.auth-panel-top select{min-width:145px;padding:11px 32px 11px 13px}.auth-form{width:min(455px,100%);gap:17px;padding:34px;border:1px solid #e2e5dc;border-radius:22px;background:rgba(255,255,255,.92);box-shadow:0 25px 70px rgba(24,28,21,.1);backdrop-filter:blur(16px)}.auth-form h2{font-size:40px}.auth-form>label{gap:9px}.auth-form input[type=text],.auth-form input[type=password]{box-sizing:border-box;border-radius:10px;border-color:#daddd4;background:#f9faf7;padding:15px}.auth-form input:focus{outline:2px solid rgba(255,229,0,.75);border-color:#d0bd00}.auth-submit{font-size:10px;padding:16px}.auth-status{margin-top:2px}.auth-legal{color:#92968e}
@media(max-width:1100px){.auth-network-visual{opacity:.72;right:0;width:43%}.auth-visual h1{font-size:58px}.auth-metrics span{min-width:95px}}
@media(max-width:850px){.auth-screen{display:block;background:radial-gradient(circle at 90% 0,rgba(255,229,0,.16),transparent 28%),#eef0ea}.auth-panel{min-height:100vh;box-sizing:border-box;padding:22px 6vw}.auth-panel-top{margin-bottom:22px}.auth-form{margin:auto;padding:27px 24px;border-radius:18px}.auth-panel-top>.keetaa-wordmark{box-shadow:0 8px 25px rgba(203,182,0,.15)}.auth-legal{margin-top:22px}}
@media(max-width:560px){.demo-content{padding:22px 15px 70px}.view-heading{margin-bottom:22px}.view-heading h2{font-size:30px}.stat-grid,.dashboard-grid,.network-insights{gap:11px}.auth-form h2{font-size:34px}.auth-options{gap:10px}.auth-options label{line-height:1.35}}

.auth-error{display:none;margin:-6px 0 0!important;color:#c52f1c!important;font-size:11px!important;font-weight:800;line-height:1.4}.auth-error.show{display:block}.auth-form.auth-invalid input[type=text],.auth-form.auth-invalid input[type=password]{border-color:#d9442e;background:#fff8f6}.auth-form.auth-invalid input:focus{outline-color:rgba(217,68,46,.35)}
