.home-view{background:#f7f7fa;color:#222c3b}.home-view .bg{background:radial-gradient(ellipse at 0 0,#ffbe8b66,transparent 34%),radial-gradient(ellipse at 100% 0,#ffe79c55,transparent 30%),radial-gradient(ellipse at 45% 100%,#f0d1da44,transparent 34%)}
.home-view header{position:relative;background:transparent;box-shadow:none;color:#313b4b;padding:22px 36px;gap:20px}.home-view header h1{display:flex;align-items:center;gap:10px;font-size:18px;letter-spacing:-.4px}.home-view .logo{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:11px;background:#f36c1c;color:white}.home-view header>div{display:flex;align-items:center;gap:20px}.home-view .clock{display:none}.home-view nav{gap:4px}.home-view nav button{font-size:14px;background:transparent;color:#727988;border:1px solid transparent;border-radius:9px;padding:9px 15px}.home-view nav button:hover{background:#fff9}.home-view nav button[aria-current=page]{color:#a83d0b;background:white;border-color:#f0e3d9;box-shadow:0 2px 4px #834a1410}
.home-view .container{width:100%;max-width:780px;margin:18px auto 24px;padding:0 20px}.home-view .card{position:relative;padding:40px 44px 48px;background:#fff;border:1px solid #fff;border-radius:28px;box-shadow:0 10px 22px #2932460c,0 30px 60px #29324624;overflow:hidden}.home-view .card::before{content:'';position:absolute;top:0;left:26px;right:26px;height:4px;background:linear-gradient(90deg,#ff923e,#ef6214 55%,#ffe18a);border-radius:0 0 8px 8px}.home-view .head .chip{display:inline-flex;align-items:center;gap:7px;font-size:12px;letter-spacing:.5px;padding:6px 14px;color:#ae3d0a;background:#fff8f1;border-color:#ffd0a8;text-transform:uppercase}.home-view .head h2{font-size:28px;letter-spacing:-.8px;font-weight:800;line-height:1.3;margin:19px 0 10px}.home-view .head p{font-size:15px;line-height:1.7;color:#758093;margin:0 auto;max-width:570px}.home-view .step{margin-top:33px}.home-view .label{display:flex;align-items:center;gap:10px;font-size:14px;color:#6f7989;letter-spacing:.55px;font-weight:750;line-height:1.5}.home-view .num{width:27px;height:27px;margin:0;flex-shrink:0;background:linear-gradient(135deg,#ff933c,#ed580d);box-shadow:0 3px 7px #e9652433;font-size:15px}.serial-wrap{position:relative}.home-view .serial{width:100%;height:100px;margin-top:12px;background:#fafbfd;border:2px solid #e7ecf3;border-radius:24px;padding:22px 24px;color:#344155;font:650 26px 'Segoe UI',Arial,sans-serif;letter-spacing:.8px;transition:border-color .18s,box-shadow .18s,background .18s}.home-view .serial::placeholder{color:#a0a9b7;font-weight:600;letter-spacing:0}.home-view .serial:focus{outline:none;border-color:#ffac77;background:#fff;box-shadow:0 0 0 4px #fff2e7}.home-view .serial.ok{border-color:#51a477;background:#f6fcf8}.home-view .serial.bad{border-color:#db8787;background:#fffafa}.home-view .divider{display:flex;align-items:center;gap:19px;margin:26px 0 19px;color:#ef742a;font-size:18px}.home-view .divider::before,.home-view .divider::after{content:'';height:1px;flex:1;background:linear-gradient(90deg,transparent,#f8cfa6,transparent)}.home-view .divider span{display:grid;place-items:center;flex-shrink:0;width:38px;height:38px;border:2px solid #ffd4ac;border-radius:50%;font-size:19px}.home-view .divider+.step{margin-top:0}.home-view .employees{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}.home-view .employee{display:flex;align-items:center;justify-content:center;gap:10px;min-height:64px;border:2px solid #e6ebf2;background:#fafbfd;color:#303b4d;border-radius:16px;padding:15px 10px;font-size:15px;font-weight:650;line-height:1.4;overflow-wrap:anywhere;transition:border-color .18s,background .18s,box-shadow .18s,transform .18s}.home-view .employee svg{width:19px;height:19px;flex-shrink:0;color:#b38360}.home-view .employee:disabled{cursor:not-allowed;color:#606c7d}.home-view .employee:hover:not(:disabled){background:#fff5eb;border-color:#f7b783;box-shadow:0 5px 14px #ee751215;transform:translateY(-2px)}.home-view .employee:active:not(:disabled){transform:translateY(0);background:#ffecd9}.home-view .employee:not(:disabled){border-color:#f6cfaf;background:#fffaf5;color:#8f3a0e}.home-view #status:empty{min-height:32px}.home-view .status{margin:22px 0 0;font-size:14px;line-height:1.6;border:1px solid #dbeee1;padding:14px 16px}.home-view .status.badmsg{border-color:#f1d7d7}.home-view .notice{margin-bottom:20px;font-size:15px;line-height:1.5}.home-view footer{font-size:12px;line-height:1.7;color:#9299a6;padding:8px 20px 26px}.home-view :is(button,a):focus-visible{outline:3px solid #f79856;outline-offset:4px}.home-view .employees>p{grid-column:1/-1;font-size:14px;line-height:1.6}.home-view .icon{width:20px;height:20px}
@media(min-height:950px){.home-view .container{margin-top:45px}}
@media(max-width:650px){.home-view header{padding:18px 20px;justify-content:center;gap:16px}.home-view header>div{justify-content:center}.home-view header h1{font-size:17px}.home-view nav button{padding:8px 12px}.home-view .container{padding:0 16px;margin:14px auto 22px}.home-view .card{padding:30px 22px 30px;border-radius:23px;box-shadow:0 18px 36px #2932461b}.home-view .head h2{font-size:25px;max-width:320px;margin:18px auto 10px}.home-view .head p{font-size:14px}.home-view .serial{height:86px;font-size:20px;border-radius:18px;padding:18px 10px;letter-spacing:0}.home-view .serial::placeholder{font-size:18px}.home-view .employees{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.home-view .employee{min-height:62px;font-size:14px;padding:12px 8px;gap:7px;border-radius:13px}.home-view .step{margin-top:27px}.home-view .divider{margin:22px 0 18px}.home-view .label{font-size:13px}.home-view #status:empty{min-height:12px}}
@media(max-width:360px){.home-view .card{padding:28px 16px}.home-view .employee{flex-direction:column;gap:5px}.home-view .serial::placeholder{font-size:16px}}
@media(prefers-reduced-motion:reduce){.home-view *{transition:none!important}}