/* A paper album: warm surfaces, colorful collection tabs, room for the cards. */
:root{color-scheme:light;--bg:#f7f3ed;--panel:#fffdf9;--panel2:#f0e9f8;--line:#ded6e3;--text:#32263f;--muted:#75687d;--accent:#ac412b;--green:#3b765e;--radius:23px}
body{background:radial-gradient(ellipse at 90% 0,#f0e8fa 0,transparent 42%),var(--bg)}
.topbar{height:74px;background:#fffdf9e8;border-bottom-color:#e7dfe9}
.brand-icon{background:#fbe0cc;color:#973c29;border:0;box-shadow:2px 2px 0 #e6bfac;transform:rotate(-6deg)}
.nav-item.active{color:#754ca2;border-bottom:3px solid #9d7bc0}
.account{background:#ece3f6;border-color:#d9cae8;color:#67408b}
main{padding-top:30px}
.page-heading{margin-bottom:24px}
h1{font-size:40px;letter-spacing:-.045em}
.heading-spark{display:inline-block;color:#c77333;font-size:33px;margin-left:13px;vertical-align:middle;transform:rotate(12deg)}
.heading-subtitle{font-size:13px;color:var(--muted);margin:10px 0 0}
.eyebrow,.small-mark{letter-spacing:.13em;color:#816a8b}
.secondary{box-shadow:0 2px 0 #e5dce8;background:#fffdf9}
.primary{background:#a84731;color:#fffaf4}
.primary:hover{background:#903923}
.collection-tabs{gap:14px;margin-bottom:18px}
.collection-tabs button{border:1px solid #e4dbe8;border-radius:16px;background:#fffcf8;box-shadow:0 3px 0 #e9e0ea;transition:transform .18s,background .18s}
.collection-tabs button:hover{transform:translateY(-2px)}
.collection-tabs button[aria-selected=true]{border-color:#d19778;background:#ffe8d7;color:#653b2b;box-shadow:0 3px 0 #e6b89b}
.collection-tabs button[data-collection="30th"][aria-selected=true]{background:#fff0bf;border-color:#c5a24f;box-shadow:0 3px 0 #e2cc88;color:#625020}
.collection-tabs button[data-collection="tmnt"][aria-selected=true]{background:#e4f0d3;border-color:#9dbd76;box-shadow:0 3px 0 #bdd6a1;color:#3c5830}
.red{background:#f7bb99;color:#71341f}.gold{background:#f1d879;color:#675018}.green{background:#bcd89b;color:#34502c}
.hero{background:radial-gradient(circle at 97% 0,#fff9ef 0,transparent 48%),linear-gradient(115deg,#f2e6f7,#f8e9dc);border-color:#dbcbe4;padding:27px 30px;gap:25px;min-height:218px;box-shadow:0 5px 0 #e6dce8}
.hero:before{content:'✧';position:absolute;right:230px;top:15px;font-size:45px;color:#b297c0;transform:rotate(15deg)}
#app[data-collection="30th"] .hero{background:linear-gradient(115deg,#fff0c8,#f8e3e8)}
#app[data-collection="tmnt"] .hero{background:linear-gradient(115deg,#e2efcf,#e5e7f6)}
.hero-main{min-width:30%;max-width:38%}
.hero h2{font-size:37px}
.hero-main .eyebrow{color:#805486}
.hero-main>p:not(.eyebrow){color:#716175;margin-bottom:21px}
.hero-bottom{color:#66536e;flex-wrap:wrap;gap:7px;font-size:11px}
.hero-bottom #quantity-total{font-weight:650}
.hero-progress{width:34%;min-width:220px;max-width:365px}
.progress-label{font-size:12px}
.progress-track,.progress-track progress{height:9px;border-radius:8px;background:#d5c5dc}
.progress-track progress::-webkit-progress-bar{background:#d5c5dc}
.progress-track progress::-webkit-progress-value{background:#be6746}
.progress-track progress::-moz-progress-bar{background:#be6746}
.progress-line:nth-child(2) progress::-webkit-progress-value{background:#9b72bb}
.progress-line:nth-child(2) progress::-moz-progress-bar{background:#9b72bb}
.progress-line:nth-child(3) progress::-webkit-progress-value{background:#659d81}
.progress-line:nth-child(3) progress::-moz-progress-bar{background:#659d81}
.hero-art{transform:none;min-width:135px;width:165px;height:178px;aspect-ratio:auto;background:none;border:0;border-radius:0;box-shadow:none;display:block;position:relative;margin-left:auto;flex-shrink:0}
.hero-cards{height:153px;position:relative}
.hero-cards img{position:absolute;left:32px;top:6px;width:102px;aspect-ratio:.716;object-fit:cover;border-radius:7px;box-shadow:0 5px 13px #47334a35;border:3px solid #fff9ed}
.hero-cards img:nth-child(1){transform:translateX(-33px) rotate(-17deg)}
.hero-cards img:nth-child(2){transform:translateY(-8px) rotate(-2deg);z-index:1}
.hero-cards img:nth-child(3){transform:translateX(33px) rotate(15deg);z-index:2}
.hero-art #hero-number{position:absolute;bottom:0;right:0;font-family:inherit;font-size:12px;font-style:normal;font-weight:750;letter-spacing:0;color:#6b5081;background:#fffaf2;padding:6px 11px;border-radius:20px;border:1px solid #ddd0e4;z-index:3}
.hero-art small{display:none}
.summary-row{gap:14px;border:0;padding:24px 0 12px;grid-template-columns:1fr 1fr 1.1fr}
.summary-cell{border:1px solid #e4dbe6!important;background:#fffcf8;border-radius:16px;padding:17px 20px!important;gap:8px}
.summary-cell strong{color:#654379;font-size:24px}
.summary-cell:nth-child(2){background:#f0ebf8}
.summary-cell small{font-size:11px;line-height:1.5}
.price-note{padding:15px;font-size:11px}
.price-note button{color:#91422d;font-size:12px;text-decoration:underline;text-underline-offset:3px}
.binder{padding-top:14px}
.segmented{background:#e8e0ed;padding:5px}
.segmented button{color:#6c5d78}
.segmented button.selected{background:#785294;color:#fff;box-shadow:0 2px 5px #5c416524}
input,select{background:#fffdfa;border-color:#d9cfdf}
input::placeholder{color:#83758b}
.search-row input{box-shadow:0 2px 0 #e9e1eb}
.rarity-filters button{font-size:11px;background:#fcf9f5;color:#716079;border-color:#ded3e3}
.rarity-filters button:nth-child(3n+2){background:#e9f1e4;border-color:#c5d7bd;color:#41623d}
.rarity-filters button:nth-child(3n+3){background:#ece3f7;border-color:#d4c3e7;color:#76538c}
.rarity-filters button:nth-child(3n+4){background:#f9e5cd;border-color:#e8c9a3;color:#8a572d}
.rarity-filters button.active{background:#76528e;color:white;border-color:#76528e}
.card-grid{gap:22px 15px}
.card-tile{background:#fffdf9;border:1px solid #e3d9e8;border-radius:14px;padding:8px;box-shadow:0 3px 0 #e9e1ec}
.card-image{background:#d8cde2;border-color:#d6c5de;border-radius:8px}
.card-tile.missing{background:#f0eaf3;border-style:dashed;border-color:#c6b4d0;box-shadow:none}
.card-tile.missing img{opacity:.5;filter:grayscale(.4)}
.card-tile.missing:hover img{opacity:.8;filter:none}
.card-open:hover .card-image{box-shadow:0 8px 16px #70577838}
.quantity-badge{background:#e4f2d7;border-color:#9ebd89;color:#36552a;box-shadow:0 2px 4px #0002}
.missing-label{background:#fffaf4e8;border-color:#bfa9cc;color:#715a80;font-weight:650}
.card-meta{font-size:10px;color:#7c6c83}
.card-name{font-size:13px}
.card-bottom{padding-bottom:2px}
.card-price{color:#93452d}.card-price.unknown{color:#7f7388}
.quick-add{background:#f3e4d7;border-color:#dcc2ac;color:#8c4329;min-width:32px;min-height:32px}
.quick-add:hover{color:white}
.placeholder-card{color:#735d82}.placeholder-card b{opacity:.5}
.notice{background:#eee6f5;border-color:#d9cce5;color:#725a82;font-size:11px;padding:10px 14px}
.image-note{background:#fff9f0e8;color:#6c4f7c}
footer{color:#7e6d89;border-color:#ddd1e4}
dialog{background:#fcf8f2;border-color:#dfd1e5;box-shadow:0 20px 80px #3b24484d}
dialog::backdrop{background:#30223e73}
.close-dialog{background:#eadff2;color:#694981}
.dialog-content h2,.detail-heading h2{color:#62417b}
.language-group h3{color:#765184}
.danger,#login-error{color:#a42b27}
.quote-note,.manual-price summary{font-size:11px}
.login-art{background:radial-gradient(ellipse at bottom left,#f6c69d,transparent 65%),#e7dcf0}
.login-art .eyebrow{color:#865c8d}
.login-art>p:not(.eyebrow){color:#75627d}
.decor-cards span{background:#f4cfad;border-color:#bd8566;color:#80533a;box-shadow:12px 0 30px #5c3c5826}
.decor-cards span:nth-child(2){background:#d8c3e9;color:#6b4787}
.decor-cards span:nth-child(3){background:#d0e1bd;color:#4f6b3d}
.api-guide{padding:16px 18px;margin:20px 0;background:#eee5f6;border:1px solid #d7c7e3;border-radius:14px}
.api-guide h4{margin:0 0 10px;color:#65447d}
.api-guide ol{padding-left:20px;margin:0;line-height:1.7}
.api-guide li+li{margin-top:8px}
.api-guide a{color:#714694;text-decoration:underline;text-underline-offset:3px}
.api-guide p{font-size:11px;margin:12px 0 0;color:#796187}
.page-heading{align-items:center}
.page-heading .secondary{margin-top:0!important}
.login-art>h1{margin-top:90px}
.card-tile.owned{border:2px solid #88a993;background:#fffefa;box-shadow:0 3px 0 #d4e3d8}
.card-tile.missing{border:2px dashed #8c9099;background:#ececef;box-shadow:none}
.card-tile.missing .card-image{background:#d7d8de;border-color:#bcbec6}
.card-tile.missing .card-image img,.card-tile.missing:hover .card-image img{opacity:.24;filter:grayscale(1)}
.card-tile.missing .placeholder-card{color:#5a5c66}
.card-tile.missing .card-meta,.card-tile.missing .card-price.unknown{color:#666472}
.card-tile.missing .quick-add{background:#fff;border-color:#adaab5;color:#5e516c}
.ownership-status{margin:8px 0 0;padding:7px 5px;border-radius:6px;font-size:11px;font-weight:700;line-height:1.2;text-align:center}
.owned .ownership-status{background:#e0efdf;color:#28583a}
.missing .ownership-status{background:#5d596b;color:#fff}
.quantity-badge{background:#287346;border-color:#fff;color:white;width:auto;min-width:29px;padding:0 6px;font-weight:700}
#scroll-sentinel{height:1px}
#load-status{text-align:center;color:var(--muted);font-size:12px;margin:28px 0 0}
@media(min-width:1450px){.card-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:1050px){.summary-row{grid-template-columns:1fr 1fr}.price-note{padding:0 4px;grid-column:1/-1}.hero{gap:18px;padding:24px}.hero-main{min-width:31%}.hero-progress{width:38%;min-width:185px}.hero-art{width:130px;min-width:130px}.hero-cards img{width:88px;left:21px;top:18px}.hero-art #hero-number{bottom:12px}.card-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){
 .topbar{height:66px;gap:18px}.topbar nav{gap:12px}main{padding-top:24px}
 .page-heading{align-items:flex-start;gap:12px}h1{font-size:29px}.heading-spark{font-size:22px;margin-left:6px}.heading-subtitle{font-size:12px;max-width:240px;line-height:1.5}.page-heading .eyebrow{font-size:9px;line-height:1.5}.page-heading .secondary{margin-top:21px;white-space:nowrap;padding:9px;font-size:10px}
 .collection-tabs{gap:10px}.collection-tabs button{min-width:158px;margin-bottom:4px}
 .hero{padding:22px 20px;gap:22px;overflow:hidden}.hero-main{width:100%;max-width:none;min-width:0}.hero h2{font-size:30px}.hero-main>p:not(.eyebrow){font-size:11px;line-height:1.6;margin-bottom:15px;max-width:62%}.hero-main .eyebrow{max-width:65%;font-size:9px}.hero-main h2{max-width:64%}.hero-bottom{font-size:11px;max-width:100%}.hero:before{display:none}
 .hero-art{opacity:1;position:absolute;right:15px;top:29px;width:98px;min-width:98px;height:135px}.hero-cards{height:115px}.hero-cards img{width:65px;left:17px;top:8px;border-width:2px;border-radius:5px}.hero-cards img:nth-child(1){transform:translateX(-17px) rotate(-17deg)}.hero-cards img:nth-child(3){transform:translateX(17px) rotate(15deg)}.hero-art #hero-number{font-size:10px;padding:4px 9px;bottom:11px}
 .hero-progress{width:100%;min-width:0;max-width:none}.progress-label{font-size:11px}
 .summary-row{gap:10px;padding-top:19px}.summary-cell{padding:14px!important}.summary-cell strong{font-size:23px}.summary-cell small{font-size:10px}.price-note{padding:2px;line-height:1.6}.price-note button{font-size:11px}
 .card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px}.card-tile{padding:7px;border-radius:12px}.card-name{font-size:13px}.card-meta{font-size:9px}.card-price{font-size:11px}.quick-add{min-width:36px;min-height:36px}.quantity-badge{width:26px;height:26px;min-width:26px;font-size:11px}.card-bottom{min-height:36px}.missing-label{font-size:9px}
 .rarity-filters button{font-size:10px;padding:8px 10px}.notice{font-size:10px}.login-art{min-height:260px}.login-art h1{font-size:40px}
 .login-art>h1{margin-top:35px}.ownership-status{font-size:11px}.quantity-badge{width:auto;padding:0 6px}
}
