:root{--bg:#0d1813;--surface:#14221c;--surface-2:#1a2d24;--border:#1e3029;--border-chalk:#2a4036;--fg:#f0f5f1;--muted:#8fa89a;--accent:#ff5f1f;--accent-hover:#ff7a45;--primary:#0a3d2a;--gold:#d9a86c;--gold-soft:#d9a86c26;--success:#4caf50;--success-bg:#4caf5026;--danger:#e53935;--danger-bg:#e5393526;--warning:#ffb300;--warning-bg:#ffb30026;--info:#29b6f6;--info-bg:#29b6f626;--font-display:"Readex Pro", "Almarai", system-ui, sans-serif;--font-body:"Almarai", "Readex Pro", system-ui, sans-serif;--text-xs:12px;--text-sm:14px;--text-base:16px;--text-lg:20px;--text-xl:28px;--text-2xl:36px;--text-3xl:48px;--leading-body:1.6;--radius-sm:8px;--radius:14px;--radius-lg:20px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--shadow-sm:0 1px 3px #0000004d;--shadow:0 4px 12px #00000059;--shadow-lg:0 8px 24px #0006}.light{--bg:#fbf5ec;--surface:#fff;--surface-2:#f5efe3;--border:#e8dcc8;--border-chalk:#d5c9b5;--fg:#1a2b22;--muted:#6b7d72;--accent:#ff5f1f;--accent-hover:#e54e0e;--primary:#0a3d2a;--gold:#c49050;--gold-soft:#c490501f;--success:#2e7d32;--success-bg:#2e7d321f;--danger:#c62828;--danger-bg:#c628281a;--warning:#e65100;--warning-bg:#e651001a;--info:#0277bd;--info-bg:#0277bd1a;--shadow-sm:0 1px 3px #00000014;--shadow:0 4px 12px #0000001a;--shadow-lg:0 8px 24px #0000001f}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body{height:100%;overflow-x:hidden}body{font-family:var(--font-body);font-size:var(--text-base);line-height:var(--leading-body);color:var(--fg);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{flex-direction:column;min-height:100vh;display:flex}h1,h2,h3,h4{font-family:var(--font-display);color:var(--fg);font-weight:600}button{font-family:var(--font-body);cursor:pointer;color:inherit;background:0 0;border:none}input,select,textarea{font-family:var(--font-body);font-size:var(--text-base)}.app-container{flex:1;width:100%;max-width:600px;margin:0 auto;padding-bottom:72px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-4);box-shadow:var(--shadow-sm)}.card-chalk{background:var(--surface);border:1px dashed var(--border-chalk);border-radius:var(--radius);padding:var(--space-4)}.btn{justify-content:center;align-items:center;gap:var(--space-2);border-radius:var(--radius);font-size:var(--text-base);min-height:44px;font-weight:700;font-family:var(--font-body);padding:10px 20px;transition:all .15s;display:inline-flex}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.btn-primary:active{transform:scale(.97)}.btn-secondary{background:var(--surface-2);color:var(--fg);border:1px solid var(--border)}.btn-secondary:hover{border-color:var(--accent)}.btn-ghost{color:var(--muted);background:0 0;padding:8px 12px}.btn-ghost:hover{color:var(--fg)}.btn-danger{background:var(--danger-bg);color:var(--danger)}.btn-danger:hover{background:var(--danger);color:#fff}.btn-icon{border-radius:var(--radius-sm);justify-content:center;align-items:center;width:40px;height:40px;transition:all .15s;display:inline-flex}.btn-icon:hover{background:var(--surface-2)}.field{gap:var(--space-1);flex-direction:column;display:flex}.field label{font-size:var(--text-sm);color:var(--muted);font-weight:700}.field input,.field select,.field textarea{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--fg);outline:none;width:100%;min-height:44px;padding:12px 14px;transition:border-color .15s}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent)}.field input::placeholder,.field textarea::placeholder{color:var(--muted);opacity:.6}.field textarea{resize:vertical;min-height:80px}.field select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%238FA89A' d='M6 8L0 0h12z'/%3E%3C/svg%3E");background-position:14px;background-repeat:no-repeat;padding-left:36px}.badge{font-size:var(--text-xs);white-space:nowrap;border-radius:100px;align-items:center;gap:4px;padding:3px 10px;font-weight:700;display:inline-flex}.badge-success{background:var(--success-bg);color:var(--success)}.badge-danger{background:var(--danger-bg);color:var(--danger)}.badge-warning{background:var(--warning-bg);color:var(--warning)}.badge-info{background:var(--info-bg);color:var(--info)}.badge-gold{background:var(--gold-soft);color:var(--gold)}.badge-muted{background:var(--surface-2);color:var(--muted)}.bottom-nav{background:var(--surface);border-top:1px solid var(--border);z-index:100;justify-content:space-around;align-items:center;max-width:600px;height:64px;margin:0 auto;display:flex;position:fixed;bottom:0;left:0;right:0}.nav-item{border-radius:var(--radius-sm);color:var(--muted);flex-direction:column;align-items:center;gap:2px;min-width:48px;padding:6px 10px;font-size:11px;font-weight:700;transition:color .15s;display:flex}.nav-item.active{color:var(--accent)}.nav-item:active{transform:scale(.92)}.modal-overlay{z-index:200;background:#0009;justify-content:center;align-items:flex-end;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.modal{background:var(--surface);border-radius:var(--radius-lg) var(--radius-lg) 0 0;width:100%;max-width:600px;max-height:90vh;padding:var(--space-5);border-top:1px solid var(--border);animation:.25s slideUp;overflow-y:auto}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.pulse{animation:2s infinite pulse}.pitch-bg{border-radius:var(--radius);background:linear-gradient(#0a3d2a 0%,#0d4a32 50%,#0a3d2a 100%);position:relative;overflow:hidden}.pitch-bg:before{content:"";background-image:linear-gradient(#ffffff0f 1px,#0000 1px),linear-gradient(90deg,#ffffff0f 1px,#0000 1px);background-size:40px 40px;position:absolute;inset:0}.pitch-line{background:#ffffff40;position:absolute}