:root{--brand-frame: linear-gradient(145deg, #8b7cff, #3fb8c8 48%, #b78cff 100%);--brand-panel: #13171f;--brand-ink: #a99bff;--brand-stars: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cg fill='%238b7cff' opacity='0.24'%3E%3Cpath d='M10 2.5 11.556 8.444 17.5 10 11.556 11.556 10 17.5 8.444 11.556 2.5 10 8.444 8.444Z'/%3E%3Cpath d='M30 22.5 31.556 28.444 37.5 30 31.556 31.556 30 37.5 28.444 31.556 22.5 30 28.444 28.444Z'/%3E%3C/g%3E%3C/svg%3E");--brand-star-tile: 40px;--brand-ring-width: 2px;--brand-ring-face: radial-gradient(circle at 50% 42%, #1b2030, #0f1219 70%)}:root{--bg: #0b0d12;--bg-raised: #15181f;--line: #262b36;--ink: #e9ecf2;--ink-dim: #99a1b3;--accent: #6ea8fe;--danger: #ff6b6b;--card-w-design: 368px;--card-w: var(--card-w-design);--card-rows: 5;--holo: linear-gradient( 145deg, #ffe9a8 0%, #ff9ec4 16%, #c9a3ff 32%, #8fd4ff 48%, #9ff2c0 64%, #ffd166 82%, #ff9ec4 100% );--display: "Avenir Next Condensed", "Futura", "Avenir Next", system-ui, sans-serif;--body: system-ui, -apple-system, "Helvetica Neue", sans-serif;--numeral: "DIN Alternate", "Avenir Next Condensed", system-ui, sans-serif;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:radial-gradient(1200px 600px at 50% -10%,#1a1f2b,var(--bg)) fixed;color:var(--ink);font:14px/1.5 var(--body)}.app{max-width:1400px;margin:0 auto;padding:24px 20px 64px}.topbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:28px}.topbar h1{margin:0;font:600 28px/1 var(--display);letter-spacing:.06em;text-transform:uppercase}.topbar-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.sort{display:flex;gap:6px;align-items:center;color:var(--ink-dim)}button,select,input,textarea{font:inherit;color:var(--ink);background:var(--bg-raised);border:1px solid var(--line);border-radius:8px;padding:7px 11px}button{cursor:pointer}button:hover:not(:disabled){border-color:#3c4454;background:#1c212b}button:disabled{opacity:.45;cursor:default}button.primary{background:var(--accent);border-color:var(--accent);color:#06111f;font-weight:600}button.primary:hover:not(:disabled){background:#8dbbff;border-color:#8dbbff}button.danger:hover:not(:disabled){color:var(--danger);border-color:#5b2b2b}button.link{background:none;border:none;padding:4px;color:var(--ink-dim);text-decoration:underline}input:focus-visible,textarea:focus-visible,select:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.placeholder{display:grid;gap:14px;justify-items:center;padding:80px 0;color:var(--ink-dim)}.error{color:var(--danger)}.error.banner{border:1px solid #5b2b2b;background:#2a1414;border-radius:8px;padding:10px 14px;cursor:pointer}.hint{color:var(--ink-dim);font-size:12px;margin:0}@media(pointer:coarse){input,select,textarea{font-size:16px}}.grid{display:grid;grid-template-columns:repeat(auto-fill,var(--card-w));gap:28px;justify-content:center}.card-slot{display:grid;gap:10px;justify-items:center;width:var(--card-w)}.card-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.card-actions button{font-size:12px;padding:5px 9px}.card-error{color:var(--danger);font-size:12px;margin:0;text-align:center}.card{width:var(--card-w);padding:9px;border-radius:20px;background:var(--frame);box-shadow:0 18px 40px -18px #000,0 0 0 1px #0005 inset}.card-inner{display:flex;flex-direction:column;gap:10px;padding:13px 13px 9px;border-radius:13px;background:linear-gradient(170deg,#171b24,#101319 60%,#141821)}.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;height:22px;margin-bottom:-2px}.card-name{margin:0;font:600 19px/1.15 var(--display);letter-spacing:.02em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-tier{flex:none;font:600 9px/1 var(--display);letter-spacing:.14em;text-indent:.14em;text-transform:uppercase;padding:5px 7px 4.3px;border-radius:999px;color:var(--tier-ink);background:var(--tier-wash);border:1px solid var(--tier-edge)}.card-photo{border-radius:9px;overflow:hidden;padding:2px;background:var(--tier-line-img)}.card-photo img{display:block;width:100%;height:auto;aspect-ratio:4 / 3;object-fit:cover;border-radius:7px}.card-photo-empty{width:100%;height:auto;aspect-ratio:4 / 3;display:grid;place-items:center;border-radius:7px;background:#0b0e14;color:#4a5367;font:600 10px/1 var(--display);letter-spacing:.18em;text-transform:uppercase}.card-flavor{position:relative;margin:0;padding-left:8px;color:#a8b0c2;font-size:11.5px;font-style:italic;line-height:1.4;height:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-flavor:before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;border-radius:999px;background-image:var(--tier-marker-img, var(--tier-line-img))}.card-flavor.empty{visibility:hidden}.card-stats{display:grid;gap:5px;align-content:start;min-height:calc(var(--card-rows) * 18px + (var(--card-rows) - 1) * 5px)}.card-stats-empty{color:#4a5367;font-size:11px;font-style:italic}.stat{display:grid;grid-template-columns:1fr 64px 30px;gap:8px;align-items:center;height:18px}.stat-name{font-size:11.5px;color:#c4cbdb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stat-bar{height:5px;border-radius:999px;background:#272d3a;overflow:hidden}.stat-bar i{display:block;height:100%;border-radius:999px;background:var(--tier-bar)}.stat-value{font:600 14px/1 var(--numeral);text-align:right;color:var(--ink)}.stat-over .stat-value{color:#ffd166}.stat-over .stat-bar i{background:linear-gradient(90deg,#f0a93c,#ffd166)}.card-foot{display:flex;align-items:flex-end;justify-content:flex-end;gap:8px;margin-top:2px;padding-top:10px;border-top:1px solid #242a36}.card-total{display:flex;align-items:baseline;gap:7px}.card-total-label{font:600 10px/1 var(--display);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-dim)}.card-total-value{font:600 34px/.85 var(--numeral);color:var(--tier-ink)}.tier-mythic .card-total-value{background-image:var(--holo);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}.tier-mythic{--frame: var(--holo);--tier-line-img: var(--holo);--tier-marker-img: linear-gradient(180deg, #f2aebf, #e9a2ce 40%, #8fd4ff);--tier-ink: #efa5c5;--tier-edge: #644553;--tier-line: #d0a74f;--tier-wash: #35242b;--tier-bar: linear-gradient(90deg, #ff8c42, #ffd166)}.tier-legendary{--frame: linear-gradient(145deg, #f3a953, #d2691e 55%, #ffd8a1);--tier-ink: #f6b26b;--tier-edge: #63441f;--tier-line: #c78f53;--tier-line-img: linear-gradient(#c78f53, #c78f53);--tier-wash: #35250f;--tier-bar: linear-gradient(90deg, #d2691e, #f6b26b)}.tier-rare{--frame: linear-gradient(145deg, #8ab4ff, #6a5acd 55%, #bcd4ff);--tier-ink: #9ec1ff;--tier-edge: #31436d;--tier-line: #7b99d0;--tier-line-img: linear-gradient(#7b99d0, #7b99d0);--tier-wash: #18223c;--tier-bar: linear-gradient(90deg, #6a5acd, #8ab4ff)}.tier-uncommon{--frame: linear-gradient(145deg, #7fd1ae, #2f9e78 55%, #b9efd8);--tier-ink: #8fdcb9;--tier-edge: #255043;--tier-line: #6daf93;--tier-line-img: linear-gradient(#6daf93, #6daf93);--tier-wash: #122a24;--tier-bar: linear-gradient(90deg, #2f9e78, #7fd1ae)}.tier-common{--frame: linear-gradient(145deg, #8b93a7, #5a6276 55%, #b4bbc9);--tier-ink: #b9c0cf;--tier-edge: #3b4252;--tier-line: #9198a7;--tier-line-img: linear-gradient(#9198a7, #9198a7);--tier-wash: #1c212c;--tier-bar: linear-gradient(90deg, #5a6276, #8b93a7)}.tier-unscored{--frame: linear-gradient(145deg, #4a5062, #343a48);--tier-ink: #8d95a8;--tier-edge: #333a48;--tier-line: #707889;--tier-line-img: linear-gradient(#707889, #707889);--tier-wash: #1a1f28;--tier-bar: #4a5062}@media(max-width:400px){:root{--card-w: calc(100vw - 32px) }}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#05070bcc;display:grid;place-items:start center;padding:32px 16px;overflow:auto;z-index:10}.panel{width:100%;max-width:460px;display:grid;gap:14px;padding:22px;border-radius:14px;background:#13161d;border:1px solid var(--line);box-shadow:0 30px 80px -30px #000}.panel h2{margin:0;font:600 20px/1.2 var(--display);letter-spacing:.03em;text-transform:uppercase}.field{display:grid;gap:5px}.field>span{font-size:12px;color:var(--ink-dim)}.panel-actions{display:flex;gap:8px;justify-content:flex-end}.dropzone{display:grid;gap:10px;justify-items:center;padding:16px;border:1.5px dashed var(--line);border-radius:12px;color:var(--ink-dim);text-align:center}.dropzone.dragging{border-color:var(--accent);background:#121a28}.dropzone p{margin:0}.dropzone-preview{width:100%;max-height:190px;object-fit:contain;border-radius:8px}.dropzone-controls{display:flex;gap:10px;align-items:center}.file-button{cursor:pointer;padding:7px 11px;border:1px solid var(--line);border-radius:8px;background:var(--bg-raised);color:var(--ink)}.file-button input{display:none}.metrics{display:grid;gap:7px;margin:0;padding:14px;border:1px solid var(--line);border-radius:12px}.metrics legend{padding:0 6px;font-size:12px;color:var(--ink-dim)}.metric-row{display:grid;grid-template-columns:1fr 86px;gap:10px;align-items:center;padding:3px 4px;border-radius:7px}.metric-row.on{background:#1a2130}.metric-row label{display:flex;gap:8px;align-items:center;cursor:pointer;color:var(--ink-dim)}.metric-row.on label{color:var(--ink)}.metric-row input[type=number]{text-align:right}.metric-add{display:flex;gap:8px;margin-top:4px}.metric-add input{flex:1;min-width:0}.metric-list{display:grid;gap:8px;margin:0;padding:0;list-style:none}.metric-list li{display:grid;grid-template-columns:1fr auto auto auto;gap:6px;align-items:center}.metric-list button{padding:6px 9px;font-size:12px}.export-sheet{display:grid;gap:8px;justify-items:center;width:100%;padding:12px;border:1px solid var(--line);border-radius:12px;background:#13161d}.export-sheet img{width:100%;max-width:240px;border-radius:8px}.export-sheet .hint{text-align:center}.export-sheet-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:center}.export-sheet a.file-button{font-size:12px;text-decoration:none}.cropper{display:grid;gap:8px;width:100%}.cropper-frame{position:relative;width:100%;overflow:hidden;border-radius:9px;background:#0b0e14;border:1px solid var(--line);touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none}.cropper-frame:active{cursor:grabbing}.cropper-frame img{position:absolute;left:50%;top:50%;max-width:none;pointer-events:none}.cropper-controls{display:flex;gap:10px;align-items:center}.cropper-controls input[type=range]{flex:1;padding:0;border:none;background:none;accent-color:var(--accent)}.card-stamp{margin-right:auto;display:flex;flex-direction:column;gap:1px}.card-number,.card-date{font-size:10px;line-height:1.2;color:var(--ink-dim);white-space:nowrap}.card-number{font-variant-numeric:tabular-nums}.date-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.date-row input[type=date]{flex:1;min-width:140px}.date-row .file-button{font-size:12px;white-space:nowrap}.panel.panel-wide{max-width:760px}.export-progress{height:4px;border-radius:999px;background:#272d3a;overflow:hidden}.export-progress i{display:block;height:100%;background:var(--accent);transition:width .12s linear}.export-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:14px;max-height:58vh;overflow-y:auto;padding:2px}.export-grid figure{margin:0;display:grid;gap:5px;justify-items:center}.export-grid img{width:100%;border-radius:8px;display:block}.export-grid a{display:block;width:100%}.export-grid figcaption{font-size:10px;color:var(--ink-dim);text-align:center;overflow-wrap:anywhere}.card.print{width:var(--card-w-design);--print-bleed: 30px;padding:calc(9px + var(--print-bleed));border-radius:0;box-shadow:none}.card.print .card-tier{font-size:11px}.card.print .card-date{font-size:11.5px}.export-modes{display:grid;gap:6px;padding:12px 14px;border:1px solid var(--line);border-radius:10px}.export-modes label{display:flex;gap:8px;align-items:center;cursor:pointer;font-size:13px;color:var(--ink-dim)}.export-modes input:checked+span{color:var(--ink)}.login{display:grid;place-items:center;min-height:80vh;padding:24px 16px}.login .panel{max-width:340px}.login h1{margin:0;font:600 24px/1.1 var(--display);letter-spacing:.06em;text-transform:uppercase}.set-list{display:grid;gap:12px;margin:0;padding:0;list-style:none}.set-row{display:grid;grid-template-columns:1fr auto auto;gap:6px;align-items:center}.set-row button{padding:6px 9px;font-size:12px}.set-meta{display:block;margin-top:3px;font-size:11px;color:var(--ink-dim)}.set-list li.locked input{color:var(--ink-dim)}.searchbar{display:flex;gap:10px;align-items:center;margin:-12px 0 24px}.searchbar input{flex:1;min-width:0}.searchbar-count{font-size:12px;color:var(--ink-dim);white-space:nowrap}.card.back{--frame: var(--brand-frame);--back-ink: var(--brand-ink);--back-panel: var(--brand-panel)}.card-back-inner{height:497px;border-radius:13px;overflow:hidden;padding:20px;display:grid;grid-template-rows:auto 1fr auto;align-items:center;justify-items:center;background-image:var(--brand-stars),none;background-color:var(--back-panel);background-size:var(--brand-star-tile) var(--brand-star-tile),auto;background-position:center center,center center;background-repeat:repeat,no-repeat}.back-word{font:600 13px/1 var(--display);letter-spacing:.36em;text-indent:.36em;text-transform:uppercase;color:var(--back-ink);padding:5px 0 4px;background:var(--back-panel);margin-top:var(--back-word-shift, 7.5px)}.back-word-flipped{transform:rotate(180deg);margin-top:0;margin-bottom:var(--back-word-shift, 7.5px)}.back-emblem{width:184px;height:184px;border-radius:50%;padding:var(--brand-ring-width);background:var(--frame)}.back-emblem-face{width:calc(184px - 2 * var(--brand-ring-width));height:calc(184px - 2 * var(--brand-ring-width));border-radius:50%;display:grid;place-items:center;background:var(--brand-ring-face)}.back-monogram{font:400 132px/1 "Bodoni 72",Didot,Hoefler Text,Baskerville,Garamond,serif;letter-spacing:0;transform:translateY(.016em);background-image:var(--frame);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
