@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap";@import "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css";:root{--ink:#000;--bg:#f4faff;--card:#fff;--muted-ink:#414b57;--accent:#00e5ff;--accent-ink:#000;--accent-2:#fff176;--accent-3:#ff8a80;--accent-4:#b9ff66;--soft:#d7e2ea;--ok:#00c853;--warn:#ffca28;--danger:#ff5252;--shadow:#00000024;--radius:12px;--thick:4px;--shadow-offset:8px}*{box-sizing:border-box}html,body{height:100%}body{background:radial-gradient(1200px 800px at 10% -10%, #fafaf7, transparent 60%), radial-gradient(900px 600px at 110% 10%, #f3f4ef, transparent 55%), var(--bg);color:var(--ink);margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;line-height:1.5}.container{max-width:1200px;margin:0 auto;padding:24px}.nb-border{border:var(--thick) solid var(--ink)}.nb-shadow{box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--ink)}.nb-elev{box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--ink), 0 6px 30px var(--shadow)}.nb-radius{border-radius:var(--radius)}.header{background:var(--accent);color:var(--accent-ink);border-radius:var(--radius);border:var(--thick) solid var(--ink);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--ink);text-align:center;flex-direction:column;justify-content:center;align-items:center;margin-bottom:24px;padding:48px 28px;display:flex}.header img.logo{background:var(--card);border:var(--thick) solid var(--ink);border-radius:var(--radius);max-width:260px;box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--ink);margin:0 auto 10px;padding:12px;display:block}.header h1{letter-spacing:-.01em;color:var(--accent);margin:6px 0 4px;font-size:2.1rem;font-weight:800}.header p{color:var(--muted-ink);margin:4px 0 10px}.grid-container{grid-template-columns:repeat(12,1fr);gap:28px;display:grid}.card{background:var(--card);border-radius:var(--radius);border:var(--thick) solid var(--ink);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--ink);background-image:linear-gradient(135deg, var(--accent-4) 0%, var(--card) 60%);padding:22px;transition:transform .14s linear}.card:hover{transform:translate(-4px,-4px)}#clientListCard{background:var(--accent-2);color:var(--ink);border-radius:var(--radius);border:var(--thick) solid var(--ink);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--ink);background-image:none;grid-column:span 7;padding:22px}#addEditCard{background:var(--accent-3);color:var(--ink);border-radius:var(--radius);border:var(--thick) solid var(--ink);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--ink);background-image:none;grid-column:span 5;padding:22px}#controlsCard{background:var(--accent-4);color:var(--ink);border-radius:var(--radius);border:var(--thick) solid var(--ink);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--ink);background-image:none;grid-column:span 12;padding:22px}.card-header{border-bottom:var(--thick) solid var(--ink);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:22px;padding-bottom:16px;display:flex}.card h2{text-transform:uppercase;letter-spacing:1.4px;margin:0;font-size:1.1rem;font-weight:800}.form-group{margin-bottom:14px}.form-group label{margin-bottom:8px;font-weight:600;display:block}.form-group input,#clientSearch,textarea#wishMessage{border:var(--thick) solid var(--ink);width:100%;color:var(--ink);box-shadow:4px 4px 0 var(--ink);background:#fff;border-radius:12px;outline:none;padding:12px 14px;font-size:1rem}.form-group input:focus,#clientSearch:focus,textarea#wishMessage:focus{box-shadow:6px 6px 0 var(--ink);outline:3px solid #0000}.btn{appearance:none;border:var(--thick) solid var(--ink);background:var(--accent);color:var(--accent-ink);border-radius:var(--radius);cursor:pointer;box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--ink);padding:10px 16px;font-weight:800;transition:transform .12s}.btn:hover{transform:translate(-2px,-2px)}.btn:active{transform:translate(0)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn.btn-secondary{color:var(--ink);background:#fdfdfd}.btn.btn-danger{background:var(--danger);color:#fff}.btn-group{flex-wrap:wrap;gap:10px;display:flex}.quick-actions{justify-content:center;gap:12px;margin-bottom:18px;display:flex}.client-item{border:var(--thick) solid var(--ink);box-shadow:6px 6px 0 var(--ink);background:#fff;border-radius:12px;align-items:center;gap:14px;margin-bottom:12px;padding:14px;display:flex}.client-item.selected{background:#ffe5e7}.client-checkbox{accent-color:var(--accent);cursor:pointer;transform:scale(1.25)}.client-item h4{margin:0 0 6px;font-size:1rem}.client-item p{color:var(--muted-ink);margin:0}.mobile-nav{z-index:1000;gap:10px;margin-bottom:18px;display:none;position:sticky;top:10px}.mobile-nav-btn{border:var(--thick) solid var(--ink);color:var(--ink);box-shadow:6px 6px 0 var(--ink);cursor:pointer;background:#fff;border-radius:12px;flex:1;padding:10px 12px;font-weight:800}.mobile-nav-btn.active{background:var(--accent);color:#000}.card.mobile-hidden{display:none!important}.modal{z-index:1001;background:#0000008c;display:none;position:fixed;inset:0}.modal[style*="display: block"],.modal[style*=display\:block]{display:block}.modal{justify-content:center;align-items:flex-start;display:flex}.modal-content{background:var(--card);border:var(--thick) solid var(--ink);border-radius:var(--radius);width:92vw;max-width:560px;box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--ink);margin:10vh auto;padding:0;animation:.14s linear forwards modal-drop}.modal-header,.modal-footer{padding:16px 18px}.modal-header{border-bottom:var(--thick) dashed var(--ink)}.modal-body{padding:16px 18px}.modal-footer{border-top:var(--thick) dashed var(--ink);justify-content:flex-end;gap:10px;display:flex}#loading-overlay{z-index:2000;background:#f6f7f2e6;flex-direction:column;justify-content:center;align-items:center;gap:14px;display:none;position:fixed;inset:0}#loading-overlay[style*="display: flex"]{display:flex!important}#loading-overlay .spinner{color:var(--accent);font-size:2.2rem}#clientSearch{max-width:340px}@media (width<=980px){.grid-container{grid-template-columns:1fr;gap:18px}#clientListCard,#addEditCard,#controlsCard{grid-column:1/-1}.mobile-nav{display:flex}.header{text-align:left}.header img.logo{margin:0 0 8px}}@keyframes modal-drop{0%{opacity:.6;transform:translateY(-18px)}to{opacity:1;transform:translateY(0)}}