*,:before,:after{box-sizing:border-box}html,body,#root{color:#111;-webkit-tap-highlight-color:transparent;background:#fff;height:100%;margin:0;padding:0}body{overscroll-behavior:none}:root{--bg:#fff;--ink:#111;--muted:#44474f;--card:#fff;--line:#1111111f;--red:#e3000b;--yellow:#ffd400;--blue:#0057b8;--green:#00a651;--primary:#e3000b;--primary-d:#b80009;--radius:22px;--radius-sm:16px;--radius-pill:999px;--toy-shadow:0 5px 0 #11111129;--font:"Nunito", "Avenir Next Rounded", "Hiragino Sans", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;--party-band:repeating-linear-gradient(90deg, var(--red) 0 56px, transparent 56px 64px, var(--yellow) 64px 120px, transparent 120px 128px, var(--blue) 128px 184px, transparent 184px 192px, var(--green) 192px 248px, transparent 248px 256px)}:focus-visible{outline-offset:3px;border-radius:8px;outline:4px solid #111}.app{background:var(--bg);max-width:480px;height:100dvh;color:var(--ink);font-family:var(--font);flex-direction:column;margin:0 auto;display:flex}.splash{height:100dvh;color:var(--muted);background:var(--bg);font-size:1.2rem;font-weight:800;font-family:var(--font);justify-content:center;align-items:center;display:flex}.app-header{border-bottom:3px solid var(--ink);background:#fff;flex-shrink:0;align-items:center;padding:10px 16px;display:flex}.brand{flex-direction:column;gap:3px;display:flex}.logo{gap:5px;display:inline-flex}.logo>span{color:#fff;text-transform:uppercase;border-radius:8px;place-items:center;width:32px;height:32px;font-size:19px;font-weight:900;line-height:1;display:grid;position:relative}.logo>span:before{content:"";background:#ffffff80;border-radius:50%;width:18%;height:18%;position:absolute;top:18%;left:20%}.logo>span:first-child{background:var(--red)}.logo>span:nth-child(2){background:var(--yellow);color:#111}.logo>span:nth-child(2):before{background:#00000038}.logo>span:nth-child(3){background:var(--blue)}.logo>span:nth-child(4){background:var(--green)}.logo>span:nth-child(5){background:var(--red)}.brand-tag{letter-spacing:.02em;color:var(--blue);font-size:.7rem;font-weight:800}.app-main{background:var(--bg);flex:1;position:relative;overflow-y:auto}.app-nav{border-top:3px solid var(--ink);background:#fff;flex-shrink:0;display:flex}.nav-btn{color:var(--ink);font-family:var(--font);cursor:pointer;background:0 0;border:none;flex:1;padding:12px 4px;font-size:.74rem;font-weight:700}.nav-btn.active{color:var(--red);font-weight:900}.scanner{flex-direction:column;height:100%;display:flex}.scan-stage{flex:1;min-height:0;position:relative;overflow:hidden}.viewfinder{background:#000;position:absolute;inset:0;overflow:hidden}.camera-feed{object-fit:cover;width:100%;height:100%}.viewfinder-overlay{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.crosshair{border:3px solid #ffffffb3;border-radius:16px;width:180px;height:124px;transition:border-color .2s,box-shadow .2s}.viewfinder-overlay.steady .crosshair{border-color:var(--green);box-shadow:0 0 0 3px #00a65173}.scanning-indicator{color:#111;border-radius:var(--radius-pill);box-shadow:var(--toy-shadow);background:#fff;border:3px solid #111;padding:8px 18px;font-size:.95rem;font-weight:800;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.status-bar{border-top:3px solid var(--ink);color:var(--ink);background:#fff;flex-shrink:0;justify-content:space-between;align-items:center;gap:10px;padding:12px 16px;font-size:.92rem;font-weight:700;display:flex}.manual-btn{background:var(--red);color:#fff;border-radius:var(--radius-pill);font-family:var(--font);cursor:pointer;white-space:nowrap;border:3px solid #111;padding:12px 24px;font-size:.95rem;font-weight:800;box-shadow:0 5px #111}.manual-btn:active{transform:translateY(4px);box-shadow:0 1px #111}.manual-btn:disabled{cursor:default;background:#bbb;border-color:#888;box-shadow:0 5px #888}.notice-bar{background:var(--yellow);color:#111;text-align:center;border-top:3px solid #111;padding:10px 16px;font-size:.85rem;font-weight:700}.cam-error{text-align:center;color:var(--ink);padding:32px 20px;font-weight:700}.result{background:#fff;border-top:3px solid #111;flex-shrink:0;align-items:flex-start;gap:12px;padding:16px;display:flex}.result-icon{background:var(--yellow);color:#111;border:3px solid #111;border-radius:50%;flex-shrink:0;place-items:center;width:42px;height:42px;font-size:1.2rem;font-weight:900;display:grid;box-shadow:inset 0 0 0 4px #ffffff59}.result--error .result-icon{background:var(--red);color:#fff}.part-img{object-fit:contain;background:#fff;border:3px solid #111;border-radius:14px;flex-shrink:0;width:84px;height:84px}.result-body{flex:1;min-width:0}.result-title{letter-spacing:-.02em;color:var(--ink);margin:0 0 2px;font-size:1.3rem;font-weight:900}.result-hint{color:var(--muted);margin:0;font-size:.85rem;font-weight:600}.part-name{color:var(--ink);margin:2px 0;font-size:1.02rem;font-weight:700}.part-id{color:var(--muted);font-size:.8rem;font-weight:700}.result--match{z-index:5;background:var(--bg);border-top:4px solid #111;flex-direction:column;align-items:stretch;gap:12px;padding:20px 14px 14px;position:absolute;inset:0;overflow:hidden}.result--match:before{content:"";background:var(--party-band);z-index:1;background-size:256px 10px;height:10px;position:absolute;top:0;left:0;right:0}.result-header{flex-shrink:0;align-items:center;gap:14px;display:flex}.match-list{-webkit-overflow-scrolling:touch;flex-direction:column;flex:1;gap:12px;min-height:0;margin:0;padding:4px 2px 14px;list-style:none;display:flex;overflow-y:auto}.match-item{color:#111;border-radius:var(--radius-sm);box-shadow:var(--toy-shadow);background:#fff;border:3px solid #111;align-items:center;gap:12px;padding:10px 12px;font-size:.95rem;display:flex}.match-item--color-match{background:var(--yellow)}.match-set-img{object-fit:contain;background:#fff;border:2px solid #111;border-radius:10px;flex-shrink:0;width:64px;height:64px}.match-set-info{flex-direction:column;gap:2px;min-width:0;display:flex}.match-set-name{color:#111;font-size:1.1rem;font-weight:800;line-height:1.2}.match-set-meta{color:var(--muted);flex-wrap:wrap;align-items:center;gap:6px;font-size:.9rem;font-weight:600;display:flex}.match-num{color:#111;font-weight:800}.match-color{align-items:center;gap:5px;display:inline-flex}.color-swatch{border:2px solid #111;border-radius:5px;flex-shrink:0;width:16px;height:16px}.match-qty{color:#fff;background:var(--green);border-radius:var(--radius-pill);border:2px solid #111;flex-shrink:0;padding:2px 9px;font-size:.85rem;font-weight:800}.set-manager{padding:16px}.set-manager h2{letter-spacing:-.02em;margin:0 0 16px;font-size:1.5rem;font-weight:900}.add-form{gap:10px;margin-bottom:16px;display:flex}.add-form input{border-radius:var(--radius-pill);color:#111;font-family:var(--font);background:#fff;border:3px solid #111;flex:1;padding:12px 16px;font-size:.95rem;font-weight:600}.add-form input::placeholder{color:#9a9da6}.add-form input:focus{outline:none}.add-form button{background:var(--red);color:#fff;border-radius:var(--radius-pill);font-family:var(--font);cursor:pointer;white-space:nowrap;border:3px solid #111;padding:12px 18px;font-size:.95rem;font-weight:800;box-shadow:0 5px #111}.add-form button:active{transform:translateY(4px);box-shadow:0 1px #111}.add-form button:disabled{cursor:default;background:#bbb;border-color:#888;box-shadow:0 5px #888}.set-list{flex-direction:column;gap:12px;margin:0;padding:0;list-style:none;display:flex}.set-item{border-radius:var(--radius-sm);box-shadow:var(--toy-shadow);background:#fff;border:3px solid #111;align-items:center;gap:12px;padding:12px;display:flex}.set-item img{object-fit:contain;background:#fff;border:2px solid #111;border-radius:10px;flex-shrink:0;width:60px;height:60px}.set-info{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.set-info strong{color:#111;white-space:nowrap;text-overflow:ellipsis;font-size:1.02rem;font-weight:800;overflow:hidden}.set-info span{color:var(--muted);font-size:.8rem;font-weight:600}.remove-btn{color:#111;cursor:pointer;border-radius:var(--radius-pill);background:#fff;border:2px solid #111;flex-shrink:0;padding:4px 10px;font-size:.9rem;font-weight:800}.remove-btn:hover{background:var(--red);color:#fff}.empty,.notice{color:var(--muted);margin-top:10px;font-size:.9rem;font-weight:600}.error{color:var(--red);margin:10px 0;font-size:.9rem;font-weight:700}.settings{padding:16px}.settings h2{letter-spacing:-.02em;margin:0 0 16px;font-size:1.5rem;font-weight:900}.settings h3{color:#111;margin:0 0 8px;font-size:1.05rem;font-weight:800}.settings section{border-radius:var(--radius-sm);box-shadow:var(--toy-shadow);background:#fff;border:3px solid #111;margin-bottom:18px;padding:16px}.settings p{color:var(--muted);margin:0 0 10px;font-size:.9rem;font-weight:600;line-height:1.55}.settings a{color:var(--red);font-weight:800}.api-key-form{gap:10px;display:flex}.api-key-form input{border-radius:var(--radius-pill);color:#111;font-family:var(--font);background:#fff;border:3px solid #111;flex:1;padding:12px 16px;font-size:.95rem;font-weight:600}.api-key-form input:focus{outline:none}.api-key-form button{background:var(--red);color:#fff;border-radius:var(--radius-pill);font-family:var(--font);cursor:pointer;border:3px solid #111;padding:12px 16px;font-size:.95rem;font-weight:800;box-shadow:0 5px #111}.api-key-form button:active{transform:translateY(4px);box-shadow:0 1px #111}.api-key-form button:disabled{cursor:default;background:#bbb;border-color:#888;box-shadow:0 5px #888}.key-status{color:var(--green)!important;margin-top:8px!important;font-size:.85rem!important;font-weight:800!important}.build-stamp{opacity:.8;color:var(--muted)!important;font-size:.72rem!important}.disclaimer{color:var(--muted)!important;font-size:.72rem!important;line-height:1.5!important}.match-item,.set-item{cursor:pointer}.match-item:active,.set-item:active{transform:translateY(1px)}.modal-backdrop{z-index:100;background:#1111118c;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal{color:#111;border-radius:var(--radius);width:100%;max-width:360px;max-height:85vh;box-shadow:var(--toy-shadow);background:#fff;border:3px solid #111;padding:22px;position:relative;overflow-y:auto}.modal-close{cursor:pointer;background:#fff;border:2px solid #111;border-radius:50%;place-items:center;width:34px;height:34px;font-size:.9rem;font-weight:800;display:grid;position:absolute;top:12px;right:12px}.modal-close:hover{background:var(--red);color:#fff}.detail{text-align:center}.modal-img{aspect-ratio:1;object-fit:contain;background:#fff;border:3px solid #111;border-radius:14px;width:100%;max-width:240px;margin:4px auto 16px}.modal-title{letter-spacing:-.02em;margin:0 0 2px;font-size:1.3rem;font-weight:900}.modal-sub{color:var(--muted);margin:0 0 16px;font-size:.9rem;font-weight:700}.detail-row{border-top:2px solid var(--line);text-align:left;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;font-weight:700;display:flex}.detail-label{color:var(--muted);font-weight:700}@media (prefers-reduced-motion:reduce){.manual-btn,.add-form button,.api-key-form button{transition:none}}