*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-deep:#0f0f1a;--bg-surface:#1a1a2e;--bg-card:#16213e;--bg-input:#0f3460;--bg-row-hover:#1e2a4a;--bg-modal:#12122a;--accent:#00d4aa;--accent-dim:#00a882;--accent-glow:#00d4aa26;--text-primary:#e8eaf0;--text-secondary:#8892a4;--text-muted:#4a5568;--text-accent:#00d4aa;--border:#2a2d4a;--border-focus:#00d4aa;--trophy:gold;--win:#48bb78;--loss:#fc8181;--neutral:#718096;--mana-w:#f9faf4;--mana-u:#4a90d9;--mana-b:#8b6914;--mana-r:#e05252;--mana-g:#3a9e5a;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--shadow-card:0 2px 12px #0006;--shadow-modal:0 8px 40px #000000b3;--transition:.18s ease;--font:-apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--font-mono:"SF Mono", "Fira Code", "Cascadia Code", monospace}html{-webkit-text-size-adjust:100%;font-size:16px}body{background:var(--bg-deep);color:var(--text-primary);font-family:var(--font);min-height:100dvh;line-height:1.5;overflow-x:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-surface)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}#topbar{z-index:100;background:var(--bg-surface);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;height:52px;padding:0 16px;display:flex;position:sticky;top:0}#topbar .brand{color:var(--text-primary);letter-spacing:.02em;align-items:center;gap:8px;font-size:1rem;font-weight:700;text-decoration:none;display:flex}#topbar .brand .logo-img{object-fit:contain;border-radius:50%;flex-shrink:0;width:36px;height:36px}#topbar .brand-sub{color:var(--text-secondary);font-size:.75rem;font-weight:400;display:none}#topbar .nav-actions{align-items:center;gap:8px;display:flex}#app{max-width:1200px;margin:0 auto;padding:16px}.section-title{letter-spacing:.1em;text-transform:uppercase;color:var(--text-secondary);margin-bottom:10px;padding-left:2px;font-size:.7rem;font-weight:600}.tab-bar{border-bottom:1px solid var(--border);gap:2px;margin-bottom:14px;padding-bottom:0;display:flex}.tab-btn{color:var(--text-secondary);cursor:pointer;font-family:var(--font);transition:color var(--transition), border-color var(--transition);white-space:nowrap;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-bottom:2px solid #0000;outline:none;margin-bottom:-1px;padding:8px 16px;font-size:.85rem;font-weight:600}.tab-btn:hover{color:var(--text-primary)}.tab-btn.active{color:var(--accent);border-bottom-color:var(--accent)}#performance-section{padding-top:4px}#overall-records{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);margin-bottom:20px;padding:16px 20px}.records-block{flex-direction:column;gap:6px;display:flex}.record-line{align-items:baseline;gap:8px;font-size:.9rem;display:flex}.record-key{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;flex-shrink:0;min-width:90px;font-size:.78rem;font-weight:600}.record-val{font-family:var(--font-mono);color:var(--text-primary);font-variant-numeric:tabular-nums;font-weight:700}.record-pct{color:var(--text-muted);font-size:.82rem}#chart-section{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;overflow:hidden}.chart-title{letter-spacing:.1em;text-transform:uppercase;color:var(--text-secondary);margin-bottom:12px;font-size:.7rem;font-weight:600}#winrate-chart{border-radius:var(--radius-md);width:100%;height:200px;display:block}@media (width>=560px){#winrate-chart{height:300px}}#filters-section{margin-bottom:12px}.filters-row{flex-wrap:wrap;align-items:flex-end;gap:8px;display:flex}.filter-group{flex-direction:column;flex:120px;gap:4px;min-width:0;display:flex}.filter-group label{text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary);font-size:.65rem;font-weight:600}.filter-group select,.filter-group input[type=date]{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font);appearance:none;cursor:pointer;width:100%;transition:border-color var(--transition), box-shadow var(--transition);outline:none;padding:7px 10px;font-size:.85rem}.filter-group select{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 d='M1 1l5 5 5-5' stroke='%238892a4' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 10px center;background-repeat:no-repeat;padding-right:30px}.filter-group select:focus,.filter-group input[type=date]:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px var(--accent-glow)}.filter-group input[type=date]::-webkit-calendar-picker-indicator{filter:invert(.6);cursor:pointer}.filter-group.date-range{flex:200px}.date-inputs{gap:6px;display:flex}.date-inputs input{flex:1;min-width:0}.filter-actions{flex-shrink:0;align-items:flex-end;gap:8px;display:flex}.btn{border-radius:var(--radius-md);cursor:pointer;font-family:var(--font);transition:background var(--transition), transform var(--transition), box-shadow var(--transition);white-space:nowrap;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;border:none;outline:none;justify-content:center;align-items:center;gap:6px;padding:8px 14px;font-size:.85rem;font-weight:600;text-decoration:none;display:inline-flex}.btn:active{transform:scale(.97)}.btn-primary{background:var(--accent);color:#0f0f1a}.btn-primary:hover{background:#00f0c4;box-shadow:0 4px 16px #00d4aa59}.btn-secondary{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border)}.btn-secondary:hover{border-color:var(--accent-dim);background:var(--bg-row-hover)}.btn-ghost{color:var(--text-secondary);border:1px solid var(--border);background:0 0}.btn-ghost:hover{color:var(--text-primary);border-color:var(--text-secondary)}.btn-danger{color:var(--loss);background:#fc818126;border:1px solid #fc81814d}.btn-danger:hover{background:#fc818140}.btn-icon{border-radius:var(--radius-md);width:34px;height:34px;padding:0;font-size:1rem}.btn-sm{padding:5px 10px;font-size:.78rem}.btn-lg{padding:11px 20px;font-size:.95rem}#btn-new-event,#btn-clear-filters{white-space:nowrap;flex-shrink:0}#events-section{position:relative}.table-meta{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;display:flex}.table-meta .section-title{margin-bottom:0}.event-count{color:var(--text-muted);background:var(--bg-card);border:1px solid var(--border);border-radius:20px;padding:2px 10px;font-size:.75rem}.table-wrapper{border-radius:var(--radius-lg);border:1px solid var(--border);background:var(--bg-card);display:none;overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:.875rem}thead tr{background:var(--bg-surface)}thead th{text-align:left;text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary);white-space:nowrap;border-bottom:1px solid var(--border);cursor:pointer;-webkit-user-select:none;user-select:none;transition:color var(--transition);padding:10px 14px;font-size:.68rem;font-weight:600}thead th:hover{color:var(--text-accent)}thead th .sort-icon{opacity:.4;margin-left:4px;font-size:.65rem}thead th.sorted .sort-icon{opacity:1;color:var(--accent)}tbody tr{border-bottom:1px solid var(--border);cursor:pointer;transition:background var(--transition)}tbody tr:last-child{border-bottom:none}tbody tr:hover,tbody tr.expanded{background:var(--bg-row-hover)}tbody td{vertical-align:middle;padding:11px 14px}tr.notes-row td{color:var(--text-secondary);cursor:default;border-bottom:1px solid var(--border);padding:8px 14px 14px;font-size:.82rem}tr.notes-row .notes-content{background:var(--bg-surface);border-radius:var(--radius-md);border-left:3px solid var(--accent-dim);align-items:flex-start;gap:10px;padding:10px 12px;display:flex}tr.notes-row .notes-content .notes-icon{flex-shrink:0;margin-top:1px;font-size:.9rem}.deck-code-block{background:var(--bg-deep);border:1px solid var(--border);border-radius:var(--radius-sm);font-family:var(--font-mono);color:var(--text-secondary);white-space:pre-wrap;word-break:break-all;max-height:200px;margin-top:8px;padding:10px 12px;font-size:.72rem;overflow-y:auto}.gem-positive{color:var(--win);font-weight:600}.gem-negative{color:var(--loss);font-weight:600}.gem-cell{font-family:var(--font-mono);white-space:nowrap;font-size:.8rem}.card-gem{font-size:.7rem;font-family:var(--font-mono)}#rewards-section{padding:16px}.rewards-legend{background:var(--bg-surface);border:1px solid var(--border);border-left:3px solid var(--accent-dim);border-radius:var(--radius-md);color:var(--text-secondary);flex-direction:column;gap:4px;margin-bottom:24px;padding:12px 16px;font-size:.8rem;display:flex}.rewards-legend strong{color:var(--text-primary)}.rewards-info-icon{cursor:help;color:var(--text-accent);margin:0 2px;font-style:normal}.rewards-group{margin-bottom:28px}.rewards-group-header{flex-wrap:wrap;align-items:baseline;gap:10px;margin-bottom:8px;display:flex}.rewards-format-name{color:var(--text-primary);font-size:.95rem;font-weight:700}.rewards-cost{color:var(--text-muted);font-size:.75rem}.rewards-table-scroll{-webkit-overflow-scrolling:touch;border:1px solid var(--border);border-radius:var(--radius-md);overflow-x:auto}.rewards-table{border-collapse:collapse;width:100%;min-width:680px;font-size:.8rem}.rewards-table th{text-align:right;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--border);background:var(--bg-surface);white-space:nowrap;cursor:default;padding:6px 12px;font-size:.68rem}.rewards-table th:first-child,.rewards-table th:nth-child(2){text-align:left}.rewards-table td{text-align:right;white-space:nowrap;border-bottom:1px solid #ffffff0a;padding:5px 12px}.rewards-table td:first-child,.rewards-table td:nth-child(2){text-align:left}.rewards-table .col-net-gem{background:#00d4aa0d;font-weight:700}.rewards-table th.col-net-gem{color:var(--text-accent);background:#00d4aa14}.rewards-table tr:last-child td{border-bottom:none}.rewards-table tr:hover td{background:var(--bg-row-hover)}.rewards-table tr:hover td.col-net-gem{background:#00d4aa1f}.rewards-pct,.rewards-packs{color:var(--text-secondary)}.rewards-usd{color:var(--text-muted);font-size:.75rem}tr.notes-row .row-actions{gap:8px;margin-top:8px;display:flex}.card-list{flex-direction:column;gap:10px;display:flex}.event-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);transition:border-color var(--transition), box-shadow var(--transition);cursor:pointer;overflow:hidden}.event-card:hover,.event-card:focus-within{border-color:var(--accent-dim);box-shadow:0 4px 16px #0000004d}.event-card.expanded{border-color:var(--accent-dim)}.card-main{grid-template-rows:auto auto;grid-template-columns:1fr auto;gap:6px 10px;padding:12px 14px;display:grid}.card-top{flex-wrap:wrap;align-items:center;gap:8px;min-width:0;display:flex}.card-bottom{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.card-record-col{flex-direction:column;grid-row:span 2;justify-content:center;align-items:flex-end;gap:6px;display:flex}.card-record{font-variant-numeric:tabular-nums;color:var(--text-primary);font-size:1.2rem;font-weight:700}.card-expand-hint{color:var(--text-muted);transition:color var(--transition), transform var(--transition);font-size:.68rem;display:inline-block}.event-card.expanded .card-expand-hint{color:var(--accent);transform:rotate(180deg)}.card-notes{padding:0 14px 12px;display:none}.event-card.expanded .card-notes{display:block}.card-notes-inner{background:var(--bg-surface);border-radius:var(--radius-md);border-left:3px solid var(--accent-dim);color:var(--text-secondary);padding:10px 12px;font-size:.82rem}.card-notes-inner .notes-label{text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:4px;font-size:.65rem;font-weight:600}.card-actions{gap:8px;padding:0 14px 12px;display:none}.event-card.expanded .card-actions{display:flex}.badge{letter-spacing:.04em;white-space:nowrap;border-radius:20px;flex-shrink:0;align-items:center;gap:4px;padding:2px 9px;font-size:.72rem;font-weight:700;display:inline-flex}.badge-trophy{color:var(--trophy);background:#ffd70026;border:1px solid #ffd70059}.badge-win{color:var(--win);background:#48bb7826;border:1px solid #48bb784d}.badge-loss{color:var(--loss);background:#fc81811f;border:1px solid #fc818140}.badge-neutral{color:var(--neutral);background:#71809626;border:1px solid #71809640}.format-pill{color:var(--text-accent);letter-spacing:.03em;white-space:nowrap;background:#00d4aa1a;border-radius:4px;flex-shrink:0;padding:2px 7px;font-size:.7rem;font-weight:600}.set-tag{font-family:var(--font-mono);color:var(--text-secondary);letter-spacing:.05em;font-size:.75rem;font-weight:700}.date-text{color:var(--text-muted);white-space:nowrap;font-size:.78rem}.record-cell{font-family:var(--font-mono);color:var(--text-primary);font-size:.9rem;font-weight:700}.col-trophy{text-align:center;width:28px;padding-left:6px!important;padding-right:6px!important}.trophy-star{color:var(--trophy);font-size:1rem;line-height:1}.trophy-star.empty{color:#0000;visibility:hidden}.rank-cell{color:var(--text-secondary);white-space:nowrap;font-size:.78rem}.card-ranks{color:var(--text-secondary);margin-top:4px;font-size:.72rem}.card-ranks .rank-label{text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);font-size:.65rem;font-weight:600}.mana-row{flex-wrap:wrap;align-items:center;gap:3px;display:flex}.mana-pip{border:1.5px solid #00000059;border-radius:50%;flex-shrink:0;width:14px;height:14px;display:inline-block}.mana-pip.W{background:var(--mana-w);border-color:#d0c8a0}.mana-pip.U{background:var(--mana-u)}.mana-pip.B{border-color:var(--mana-b);background:#2a1a00}.mana-pip.R{background:var(--mana-r)}.mana-pip.G{background:var(--mana-g)}.mana-pip.large{border-width:2px;width:20px;height:20px}.mana-pip.splash{opacity:.5;border-style:dashed}.row-actions{gap:6px;display:flex}#table-empty{display:none}.empty-state{text-align:center;color:var(--text-muted);padding:48px 24px}.empty-state .empty-icon{opacity:.5;margin-bottom:12px;font-size:3rem}.empty-state h3{color:var(--text-secondary);margin-bottom:6px;font-size:1rem}.empty-state p{margin-bottom:20px;font-size:.85rem}#modal-overlay{-webkit-backdrop-filter:blur(3px);z-index:200;opacity:0;background:#000000a6;justify-content:center;align-items:flex-end;padding:0;transition:opacity .22s;display:none;position:fixed;inset:0}#modal-overlay.visible{opacity:1;display:flex}#modal-overlay.entering{opacity:0}.modal{background:var(--bg-modal);border:1px solid var(--border);border-radius:var(--radius-xl) var(--radius-xl) 0 0;width:100%;max-width:560px;max-height:92dvh;box-shadow:var(--shadow-modal);flex-direction:column;transition:transform .22s;display:flex;overflow:hidden;transform:translateY(20px)}#modal-overlay.visible .modal{transform:translateY(0)}.modal-handle{background:var(--border);border-radius:2px;flex-shrink:0;width:36px;height:4px;margin:10px auto 6px}.modal-header{border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;padding:4px 18px 14px;display:flex}.modal-header h2{color:var(--text-primary);font-size:1rem;font-weight:700}.modal-body{flex:1;padding:18px;overflow-y:auto}.modal-footer{border-top:1px solid var(--border);background:var(--bg-modal);flex-shrink:0;gap:10px;padding:14px 18px;display:flex}.modal-footer .btn{flex:1;justify-content:center}.form-grid{grid-template-columns:1fr 1fr;gap:14px;display:grid}.field{flex-direction:column;gap:5px;display:flex}.field.full{grid-column:span 2}.field label{text-transform:uppercase;letter-spacing:.07em;color:var(--text-secondary);font-size:.72rem;font-weight:600}.field label .required{color:var(--loss);margin-left:2px}.field input,.field select,.field textarea{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font);width:100%;transition:border-color var(--transition), box-shadow var(--transition);appearance:none;outline:none;padding:9px 12px;font-size:.9rem}.field select{cursor:pointer;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 d='M1 1l5 5 5-5' stroke='%238892a4' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;padding-right:32px}.field textarea{resize:vertical;min-height:72px;line-height:1.5}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px var(--accent-glow)}.field input::placeholder,.field textarea::placeholder{color:var(--text-muted)}.field.error input,.field.error select,.field.error textarea{border-color:var(--loss)}.field .error-msg{color:var(--loss);font-size:.7rem;display:none}.field.error .error-msg{display:block}.number-stepper{border-radius:var(--radius-md);border:1px solid var(--border);transition:border-color var(--transition), box-shadow var(--transition);gap:0;display:flex;overflow:hidden}.number-stepper:focus-within{border-color:var(--border-focus);box-shadow:0 0 0 3px var(--accent-glow)}.number-stepper button{background:var(--bg-surface);color:var(--text-secondary);cursor:pointer;width:36px;transition:background var(--transition), color var(--transition);-webkit-tap-highlight-color:transparent;border:none;flex-shrink:0;font-size:1.1rem;font-weight:300;line-height:1}.number-stepper button:hover{background:var(--bg-input);color:var(--text-primary)}.number-stepper input[type=number]{text-align:center;min-width:0;box-shadow:none;border:none;border-radius:0;flex:1;padding:8px 4px;font-size:1rem;font-weight:700}.number-stepper input[type=number]:focus{box-shadow:none;border-color:#0000}.number-stepper input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}.number-stepper input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none}.color-select{flex-wrap:wrap;gap:8px;display:flex}.color-btn{cursor:pointer;width:40px;height:40px;transition:transform var(--transition), border-color var(--transition), box-shadow var(--transition);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;border:2px solid #0000;border-radius:50%;outline:none;flex-shrink:0;justify-content:center;align-items:center;font-size:.75rem;font-weight:800;display:flex}.color-btn:active{transform:scale(.92)}.color-btn[data-color=W]{background:var(--mana-w);color:#5a4e1a;border-color:#c8c0a0}.color-btn[data-color=U]{background:var(--mana-u);color:#fff;border-color:#2a70c0}.color-btn[data-color=B]{color:var(--mana-b);background:#2a1a00;border-color:#5a4008}.color-btn[data-color=R]{background:var(--mana-r);color:#fff;border-color:#c03030}.color-btn[data-color=G]{background:var(--mana-g);color:#fff;border-color:#2a8040}.color-btn.color-main{box-shadow:0 0 0 3px var(--accent-glow), 0 2px 8px #0006;transform:scale(1.08);border-color:var(--accent)!important}.color-btn.color-main:after{content:"✓";color:var(--accent);background:var(--bg-modal);text-align:center;border-radius:50%;justify-content:center;align-items:center;width:12px;height:12px;font-size:.6rem;line-height:12px;display:flex;position:absolute;bottom:-1px;right:-1px}.color-btn.color-splash{opacity:.75;transform:scale(1.04);border-style:dashed!important;border-color:#aaa!important}.color-btn.color-splash:after{content:"S";color:#fff;text-align:center;background:#888;border-radius:50%;justify-content:center;align-items:center;width:12px;height:12px;font-size:.55rem;font-weight:900;line-height:12px;display:flex;position:absolute;bottom:-1px;right:-1px}.color-btn{position:relative}.record-preview{color:var(--text-secondary);height:18px;margin-top:6px;font-size:.78rem}.record-preview .preview-val{color:var(--text-primary);font-weight:700}#toast-container{z-index:400;pointer-events:none;flex-direction:column;align-items:center;gap:8px;display:flex;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}.toast{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);color:var(--text-primary);white-space:nowrap;padding:10px 18px;font-size:.85rem;animation:.25s toastIn,.3s 2.5s forwards toastOut;box-shadow:0 4px 20px #00000080}.toast.success{border-color:var(--accent-dim);color:var(--accent)}.toast.error{color:var(--loss);border-color:#fc818166}@keyframes toastIn{0%{opacity:0;transform:translateY(10px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes toastOut{0%{opacity:1}to{opacity:0;transform:translateY(-6px)}}@media (width>=560px){#app{padding:20px 24px}#topbar{padding:0 24px}#topbar .brand-sub,.table-wrapper{display:block}.card-list{display:none}#table-empty{display:block}#modal-overlay{align-items:center;padding:20px}.modal{border-radius:var(--radius-xl);max-height:88dvh}.modal-handle{display:none}}@media (width>=768px){#app{padding:24px 32px}}@media (width>=1024px){#app{padding:28px 40px}}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.hidden{display:none!important}@keyframes rowPulse{0%{background:#00d4aa2e}to{background:0 0}}.row-new{animation:1.4s forwards rowPulse}
