:root{--color-navy: #112a44;--color-navy-light: #1c3f63;--color-teal: #219ebc;--color-teal-light: #8ecae6;--color-bg: #f5f7fa;--color-surface: #ffffff;--color-text: #16202a;--color-text-muted: #6b7785;--color-border: #e3e8ee;--color-success-bg: #e3f6ea;--color-success-text: #1e7a44;--color-danger-bg: #fdeceb;--color-danger-text: #b3261e;--color-warning-bg: #fff4dc;--color-warning-text: #8a5300;--radius: 16px;--shadow: 0 2px 10px rgba(17, 42, 68, .06);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--color-bg);color:var(--color-text);-webkit-tap-highlight-color:transparent}button,input{font:inherit}.page{max-width:480px;margin:0 auto;padding:16px 16px 32px;min-height:100%;display:flex;flex-direction:column;gap:16px}.page-loading,.empty-state{color:var(--color-text-muted);text-align:center;padding:24px 0}.topbar{display:flex;align-items:center;gap:8px;padding:4px 0 8px}.topbar-title{flex:1;text-align:center;font-size:1.1rem;margin:0}.topbar-back{border:none;background:var(--color-surface);box-shadow:var(--shadow);width:36px;height:36px;border-radius:50%;font-size:1.1rem;cursor:pointer}.topbar-spacer{width:36px}.dashboard-header{display:flex;justify-content:space-between;align-items:flex-start;padding-top:8px}.dashboard-eyebrow{margin:0;font-size:.75rem;letter-spacing:.12em;color:var(--color-text-muted);font-weight:700}.dashboard-header h1{margin:4px 0 0;font-size:1.5rem}.logout-link{border:none;background:none;color:var(--color-teal);font-weight:600;cursor:pointer;padding:8px 0}.card{background:var(--color-surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;text-align:left;border:none;width:100%;display:block}.card-clickable{cursor:pointer}.card-header{display:flex;align-items:center;gap:10px;margin-bottom:10px}.card-icon{font-size:1.4rem}.card-title{font-weight:700;color:var(--color-text-muted);font-size:.85rem;text-transform:uppercase;letter-spacing:.04em}.card-line-strong{margin:2px 0;font-size:1.05rem;font-weight:600}.card-line-muted{margin:2px 0;color:var(--color-text-muted);font-size:.9rem}.card-line-label{margin:10px 0 0;color:var(--color-text-muted);font-size:.8rem}.badge{display:inline-block;align-self:flex-start;margin-top:8px;padding:4px 10px;border-radius:999px;background:var(--color-teal-light);color:var(--color-navy);font-size:.78rem;font-weight:700}.badge-success{background:var(--color-success-bg);color:var(--color-success-text)}.badge-expired{background:var(--color-danger-bg);color:var(--color-danger-text)}.badge-pending{background:var(--color-warning-bg);color:var(--color-warning-text)}.card .btn-primary{width:100%;margin-top:12px}.menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.menu-button{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:18px 12px;display:flex;flex-direction:column;align-items:center;gap:8px;font-weight:600;font-size:.88rem;cursor:pointer;color:var(--color-text)}.menu-button-icon{font-size:1.6rem}.login-page{min-height:100%;display:flex;flex-direction:column;justify-content:center;padding:24px;max-width:420px;margin:0 auto;gap:32px}.login-brand{text-align:center}.login-logo{width:88px;height:88px;margin:0 auto 12px;border-radius:50%;display:block;object-fit:contain}.login-brand h1{margin:0;font-size:1.6rem}.login-brand p{color:var(--color-text-muted);margin:4px 0 0}.login-form{display:flex;flex-direction:column;gap:16px}.field{display:flex;flex-direction:column;gap:6px;font-size:.85rem;font-weight:600;color:var(--color-text-muted)}.field input{border:1px solid var(--color-border);border-radius:12px;padding:12px 14px;font-size:1rem;color:var(--color-text)}.field input:focus,.field select:focus{outline:2px solid var(--color-teal);outline-offset:1px}.field select{border:1px solid var(--color-border);border-radius:12px;padding:12px 14px;font-size:1rem;color:var(--color-text);background:var(--color-surface)}.field input[aria-invalid=true]{border-color:var(--color-danger-text)}.field-error{color:var(--color-danger-text);font-size:.8rem;font-weight:500;margin:0}.field-help{color:var(--color-text-muted);font-size:.78rem;font-weight:400;margin:0}.field-row{display:flex;gap:10px}.field-grow{flex:1;min-width:0}.field-check-digit{width:64px}.field-check-digit input{width:100%;text-align:center}.serial-list{display:flex;flex-direction:column;gap:8px}.serial-row{display:flex;gap:8px;align-items:center}.serial-row input{flex:1;min-width:0;border:1px solid var(--color-border);border-radius:12px;padding:12px 14px;font-size:1rem;color:var(--color-text)}.serial-row-wrapper{display:flex;flex-direction:column;gap:4px}.icon-button{width:40px;height:40px;flex-shrink:0;border:1px solid var(--color-border);border-radius:10px;background:var(--color-surface);color:var(--color-text-muted);font-size:1rem;cursor:pointer}.add-row-button{align-self:flex-start;border:none;background:none;color:var(--color-teal);font-weight:600;font-size:.9rem;padding:4px 0;cursor:pointer}.btn-secondary{background:var(--color-surface);color:var(--color-navy);border:1px solid var(--color-border);border-radius:12px;padding:14px;font-size:1rem;font-weight:700;cursor:pointer}.add-serial-form{display:flex;flex-direction:column;gap:12px}.add-serial-form .card-title{margin:0}.notice{background:var(--color-warning-bg);color:var(--color-warning-text);padding:12px 14px;border-radius:12px;font-size:.9rem;margin:0}.notice p{margin:0}.notice .login-hint{text-align:left;margin-top:6px}.notice-success{background:var(--color-success-bg);color:var(--color-success-text)}.btn-primary{background:var(--color-navy);color:#fff;border:none;border-radius:12px;padding:14px;font-size:1rem;font-weight:700;cursor:pointer}.btn-primary:disabled{opacity:.6;cursor:default}.login-hint{text-align:center;color:var(--color-text-muted);font-size:.82rem}.help-link{color:var(--color-teal);font-weight:600}.form-error{background:var(--color-danger-bg);color:var(--color-danger-text);padding:10px 12px;border-radius:10px;font-size:.88rem;margin:0}.order-items{list-style:none;margin:0;padding:0;background:var(--color-surface);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.order-item{display:flex;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--color-border);font-size:.95rem}.order-item:last-child{border-bottom:none}.order-total{display:flex;justify-content:space-between;font-weight:700;font-size:1.1rem;padding:4px}.coming-soon{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:16px;color:var(--color-text-muted);padding:32px 8px}.coming-soon-icon{font-size:2.5rem}.coming-soon .btn-primary{width:100%;max-width:280px}