body,#root,.app-root{height:100vh;margin:0;background:#111;font-family:Consolas,monospace;color:#ededed}.app-root{display:flex;height:100vh;width:100vw;background:#111}.sidebar{width:21vw;min-width:120px;max-width:300px;background:#181818;border-right:1.5px solid #222;padding:32px 18px 0;box-sizing:border-box;display:flex;flex-direction:column;box-shadow:4px 0 16px #09090955}.sidebar-title{font-size:2rem;font-weight:700;margin-bottom:32px;letter-spacing:2px;color:#ededed;text-shadow:0 2px 8px #0003}.sidebar-empty{color:#555;margin-bottom:8px;font-size:1rem}.sidebar-client{padding:14px 16px;margin-bottom:11px;border-radius:10px;cursor:pointer;background:none;font-size:1.32rem;transition:background .18s,color .18s,box-shadow .15s;color:#bebebe}.sidebar-client.active,.sidebar-client:hover{background:#232323;color:#fff;font-weight:700;box-shadow:0 0 0 2px #1b1b1b}.main-area{flex:1;background:#181818;color:#ededed;padding:44px 54px;box-sizing:border-box;min-width:0;display:flex;flex-direction:column;align-items:flex-start}.tabbar{display:flex;gap:18px;margin-bottom:24px;border-bottom:1.5px solid #222}.tab{font-size:1.16rem;font-weight:600;padding:12px 28px 9px;border-radius:7px 7px 0 0;cursor:pointer;background:none;color:#999;transition:background .13s,color .13s;margin-bottom:-2px;-webkit-user-select:none;user-select:none}.tab.active{background:#1a1a1a;color:#ededed;border-bottom:2.5px solid #2a2a2a;font-weight:700;z-index:2}.tab:hover{color:#fafafa;background:#222}.screen-preview{margin-bottom:28px;background:#171717;padding:24px;border-radius:16px;border:1.5px solid #232323;min-height:420px;min-width:700px;max-width:98vw;max-height:70vh;box-sizing:border-box;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 32px #0c0c0c22;overflow:auto}.screen-img{display:block;width:100%;height:auto;max-width:1100px;max-height:64vh;border-radius:12px;background:#1c1c1c;border:1px solid #252525;box-shadow:0 2px 12px #13131333;object-fit:contain}.btn{padding:13px 34px;margin-right:24px;font-size:1.1rem;border:none;border-radius:7px;margin-bottom:12px;cursor:pointer;transition:background .15s,color .15s,filter .17s,box-shadow .17s;box-shadow:0 0 0 transparent}.btn-primary{background:linear-gradient(90deg,#292929,#111);color:#ededed;font-weight:600;letter-spacing:1px;box-shadow:0 2px 16px #10101033}.btn-secondary{background:#222;color:#bbb;font-weight:600}.btn-primary:hover,.btn-secondary:hover{filter:brightness(1.14) drop-shadow(0 2px 16px #18181888);color:#fff}.main-placeholder{color:#555;font-size:1.4rem;font-weight:500;margin-top:50px;letter-spacing:.5px}@media (max-width: 900px){.screen-preview{min-width:0;padding:4vw;max-width:98vw}.screen-img{max-width:98vw;max-height:40vh}}.client-card{background:#191919;border:2px solid #393939;border-radius:13px;margin-bottom:20px;padding:17px 22px 15px;box-shadow:0 2px 16px #07070722;font-family:Consolas,monospace;color:#ededed;font-size:1.18rem;cursor:pointer;transition:border .18s,box-shadow .16s,background .15s;display:flex;flex-direction:column;gap:10px;position:relative;overflow:hidden}.client-card.selected,.client-card:hover{border-color:#ededed;background:#222;box-shadow:0 3px 22px #0d0d0d33}.client-status-outer{position:absolute;left:14px;bottom:14px;width:38px;height:28px;display:flex;align-items:center;justify-content:center;border:2.3px solid #14ff52;border-radius:10px;background:transparent;box-sizing:border-box;box-shadow:0 0 3px #14ff5277}.client-entry{position:relative;background:#111;border:1px solid #333;border-radius:8px;padding:22px 12px 35px 18px;margin-bottom:16px;min-height:70px;cursor:pointer;transition:border-color .2s,background .2s,transform .2s;box-sizing:border-box;display:flex;align-items:flex-start}.client-entry:hover{background:#1a1a1a;transform:translate(2px)}.client-entry.active{border-color:#bbb}.entry-body{display:flex;flex-direction:column;gap:4px}.entry-id{font-family:Consolas,monospace;font-size:.97rem;color:#fff}.entry-detail{font-family:Consolas,monospace;font-size:.8rem;color:#ccc;line-height:1.2}.status-dot-container{position:absolute;bottom:11px;left:17px;width:24px;height:16px;border:1.6px solid #27c93f;border-radius:6px;background:#1e1e1eeb;display:flex;align-items:center;justify-content:center;box-shadow:0 0 4px #27c93f66;z-index:2}.status-dot{width:8px;height:8px;background:#27c93f;border-radius:50%;box-shadow:0 0 3px #27c93f99}.btn{display:inline-block;padding:12px 30px;margin:0 14px 12px 0;font-size:1.05rem;font-family:Consolas,monospace;border:none;border-radius:7px;background:#191919;color:#e0e0e0;font-weight:600;letter-spacing:.6px;box-shadow:0 2px 12px #0005;cursor:pointer;transition:background .16s,color .14s,filter .14s,box-shadow .15s;outline:none;-webkit-user-select:none;user-select:none}.btn-primary{background:linear-gradient(90deg,#222,#171);color:#c3ffc3;border:1.7px solid #27c93f;box-shadow:0 3px 12px #27c93f33}.btn-secondary{background:#232323;color:#bbb;border:1.3px solid #444}.btn:hover,.btn:focus-visible{filter:brightness(1.13);background:#252525;color:#fff;box-shadow:0 3px 24px #1a1a1a66}.btn-primary:hover,.btn-primary:focus-visible{background:linear-gradient(90deg,#262,#191);color:#fff;border-color:#40ff5a;box-shadow:0 5px 24px #27c93f44}.btn:active{filter:brightness(.97);background:#171717}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0c1218bf;z-index:1000;display:flex;align-items:center;justify-content:center}.custom-modal{background:#16191e;color:#eee;border-radius:11px;padding:32px 32px 18px;min-width:350px;box-shadow:0 8px 38px #000b,0 2px 8px #0006;display:flex;flex-direction:column;align-items:stretch;animation:modalIn .22s cubic-bezier(.57,.02,.45,.97)}@keyframes modalIn{0%{transform:scale(.93) translateY(30px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.modal-title{font-size:1.23rem;font-weight:600;color:#8fe879;margin-bottom:16px;text-shadow:0 2px 8px #171;letter-spacing:.7px}.modal-input{background:#222529;color:#e8ffe2;border:1.5px solid #273;border-radius:7px;padding:11px 13px;margin-bottom:9px;font-size:1.05rem;font-family:Consolas,monospace;resize:none;outline:none;transition:border .14s}.modal-input:focus{border-color:#27c93f}.modal-btn-row{display:flex;justify-content:flex-end;gap:16px;margin-top:22px}
