/* ===== QUICKPRINT.PK — GLOBAL STYLES ===== */
*{margin:0;padding:0;box-sizing:border-box;}
:root{
  --green:#00c875;
  --green-dark:#00a85e;
  --gold:#f0b429;
  --bg:#060d1a;
  --bg2:#0a1628;
  --card:rgba(255,255,255,0.04);
  --border:rgba(255,255,255,0.09);
  --text:#e8f0fe;
  --muted:#7a9ab5;
}
body{font-family:'Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;}

/* Canvas */
canvas#bg{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none;}

/* Header */
.header{position:fixed;top:0;left:0;right:0;z-index:100;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;background:rgba(6,13,26,0.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);}
.logo{font-size:20px;font-weight:900;letter-spacing:1px;color:#fff;}
.logo span{color:var(--green);}
.header-badge{background:rgba(0,200,117,0.12);border:1px solid rgba(0,200,117,0.3);color:var(--green);font-size:11px;font-weight:700;padding:4px 12px;border-radius:20px;}

/* Step Progress Bar */
.step-bar{position:fixed;top:57px;left:0;right:0;z-index:99;background:rgba(6,13,26,0.9);backdrop-filter:blur(8px);padding:10px 20px;border-bottom:1px solid var(--border);}
.step-bar-inner{max-width:700px;margin:0 auto;display:flex;align-items:center;gap:0;}
.step-node{display:flex;flex-direction:column;align-items:center;gap:4px;flex:1;position:relative;}
.step-node:not(:last-child)::after{content:'';position:absolute;top:11px;left:50%;width:100%;height:2px;background:var(--border);z-index:-1;}
.step-node.done:not(:last-child)::after{background:var(--green);}
.step-dot{width:22px;height:22px;border-radius:50%;border:2px solid var(--border);background:var(--bg);display:flex;align-items:center;justify-content:center;font-size:9px;color:var(--muted);font-weight:700;transition:.3s;}
.step-node.done .step-dot{background:var(--green);border-color:var(--green);color:#000;}
.step-node.active .step-dot{background:var(--gold);border-color:var(--gold);color:#000;box-shadow:0 0 10px rgba(240,180,41,0.5);}
.step-label{font-size:9px;color:var(--muted);white-space:nowrap;}
.step-node.active .step-label{color:var(--gold);}
.step-node.done .step-label{color:var(--green);}

/* Main Page Wrapper */
.page{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:120px 20px 60px;}

/* Cards */
.card{background:var(--card);backdrop-filter:blur(16px);border:1px solid var(--border);border-radius:22px;padding:36px 32px;width:100%;max-width:500px;}
.card-title{font-size:22px;font-weight:800;margin-bottom:6px;text-align:center;}
.card-sub{font-size:13px;color:var(--muted);text-align:center;margin-bottom:28px;line-height:1.6;}

/* Inputs */
.form-group{margin-bottom:18px;}
label{display:block;font-size:12px;color:var(--muted);margin-bottom:7px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;}
input,select{width:100%;padding:14px 16px;background:rgba(255,255,255,0.06);border:1.5px solid var(--border);border-radius:12px;color:var(--text);font-size:15px;outline:none;transition:.2s;-webkit-appearance:none;}
input:focus,select:focus{border-color:var(--green);background:rgba(0,200,117,0.07);}
input.error{border-color:#e74c3c !important;}
select option{background:#0a1628;color:#fff;}

/* Buttons */
.btn{width:100%;padding:16px;border:none;border-radius:14px;font-size:16px;font-weight:800;cursor:pointer;transition:.25s;letter-spacing:.3px;}
.btn-primary{background:linear-gradient(135deg,var(--green-dark),var(--green));color:#000;}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(0,200,117,0.35);}
.btn-primary:active{transform:scale(0.98);}
.btn-gold{background:linear-gradient(135deg,#d4920a,var(--gold));color:#000;}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(240,180,41,0.35);}

/* Loading Overlay */
.loading{display:none;position:fixed;inset:0;background:var(--bg);z-index:500;flex-direction:column;align-items:center;justify-content:center;padding:30px;}
.loading.show{display:flex;}
.loading-ring{width:72px;height:72px;border-radius:50%;border:3px solid rgba(0,200,117,0.15);border-top:3px solid var(--green);animation:spin 1s linear infinite;margin-bottom:24px;}
@keyframes spin{to{transform:rotate(360deg);}}
.loading-title{font-size:18px;font-weight:800;margin-bottom:6px;}
.loading-msg{font-size:13px;color:var(--muted);margin-bottom:28px;text-align:center;}
.prog-wrap{width:100%;max-width:380px;height:5px;background:rgba(255,255,255,0.08);border-radius:10px;overflow:hidden;margin-bottom:24px;}
.prog-fill{height:100%;background:linear-gradient(90deg,var(--green-dark),var(--green));border-radius:10px;width:0%;transition:width .6s ease;}
.step-list{width:100%;max-width:380px;}
.sli{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,0.04);font-size:13px;color:var(--muted);opacity:.3;transition:.4s;}
.sli.done{opacity:1;color:var(--green);}
.sli.active{opacity:1;color:#fff;}
.sli-dot{width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,0.07);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:9px;}
.sli.done .sli-dot{background:var(--green);color:#000;}
.sli.active .sli-dot{background:var(--gold);animation:pulse 1s infinite;}
@keyframes pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.15);}}

/* Option Buttons */
.opt-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px;}
.opt-card{background:rgba(255,255,255,0.04);border:1.5px solid var(--border);border-radius:16px;padding:20px 14px;cursor:pointer;transition:.25s;text-align:center;color:var(--text);text-decoration:none;display:flex;flex-direction:column;align-items:center;gap:8px;}
.opt-card:hover{background:rgba(0,200,117,0.1);border-color:var(--green);transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,200,117,0.18);}
.opt-icon{font-size:28px;}
.opt-label{font-size:13px;font-weight:700;}
.opt-desc{font-size:11px;color:var(--muted);}

/* Blurred Data */
.data-box{background:rgba(0,0,0,0.25);border-radius:14px;padding:16px;margin-bottom:20px;}
.data-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid rgba(255,255,255,0.05);}
.data-row:last-child{border:none;}
.dk{font-size:12px;color:var(--muted);}
.dv{font-size:13px;font-weight:600;filter:blur(5px);background:rgba(0,200,117,0.1);padding:3px 12px;border-radius:6px;user-select:none;}
.dv.partial{filter:blur(0);color:var(--green);}

/* Trust badges */
.trust{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:20px;}
.tb{font-size:11px;color:var(--muted);display:flex;align-items:center;gap:5px;}
.tb b{color:var(--green);}

/* Timer */
.timer-box{background:rgba(240,180,41,0.08);border:1px solid rgba(240,180,41,0.2);border-radius:12px;padding:12px 20px;text-align:center;margin-bottom:20px;}
.timer-box p{font-size:12px;color:var(--muted);}
.timer-box span{font-size:22px;font-weight:900;color:var(--gold);}

/* Hero title */
.hero-title{font-size:clamp(24px,5vw,42px);font-weight:900;text-align:center;line-height:1.2;margin-bottom:12px;}
.hero-title em{font-style:normal;color:var(--green);}
.hero-sub{font-size:15px;color:var(--muted);text-align:center;margin-bottom:36px;max-width:520px;}
.hero-stats{display:flex;gap:28px;justify-content:center;flex-wrap:wrap;margin-top:28px;}
.hs{text-align:center;}
.hs-n{font-size:24px;font-weight:900;color:var(--green);}
.hs-l{font-size:11px;color:var(--muted);margin-top:2px;}

/* Alert */
.alert{background:rgba(0,200,117,0.08);border:1px solid rgba(0,200,117,0.2);border-radius:12px;padding:14px 18px;display:flex;align-items:center;gap:10px;margin-bottom:20px;font-size:13px;color:var(--muted);}

/* Tabs */
.tabs{display:flex;gap:6px;background:rgba(0,0,0,0.2);padding:4px;border-radius:14px;margin-bottom:24px;}
.tab{flex:1;padding:10px;border:none;background:transparent;color:var(--muted);border-radius:11px;cursor:pointer;font-size:13px;font-weight:700;transition:.2s;}
.tab.active{background:var(--green-dark);color:#fff;}

footer{position:relative;z-index:1;text-align:center;padding:24px 20px;color:var(--muted);font-size:12px;border-top:1px solid var(--border);}
