:root{color-scheme:light}*,*:before,*:after{box-sizing:border-box}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;margin:0;min-height:100vh;background-color:#f9fafb;color:#0f172a}.page{min-height:100vh;display:flex;flex-direction:column}.page-header-bar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.25rem;background:#fffffff5;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid #e5e7eb}.page-header-bar-left{display:flex;align-items:center;gap:.85rem}.page-logo{height:40px;max-width:180px;object-fit:contain}.page-header-title{display:flex;flex-direction:column;gap:.1rem}.page-header-kicker{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:#6b7280}.page-header-main-title{font-size:.95rem;font-weight:700;color:#0f172a}.page-header-bar-right{display:flex;flex-direction:column;align-items:flex-end;gap:.35rem;font-size:.8rem}.hero-chip{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:#1d4ed8}.hero-url{display:inline-flex;align-items:center;padding:.2rem .6rem;border-radius:999px;background-color:#0f172a;border:1px solid #9ca3af;font-size:.8rem;color:#f9fafb}.page-fullscreen-toggle{margin-top:.1rem;border-radius:999px;border:1px solid #e5e7eb;background-color:#f9fafb;color:#111827;font-size:.75rem;padding:.25rem .7rem;cursor:pointer}.page-fullscreen-toggle:hover{background-color:#e5e7eb}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.page-shell{flex:1;width:100%;max-width:1920px;margin:0 auto;padding:1.5rem 1.25rem 1.75rem}.page-hero{position:relative;margin-bottom:1.75rem}.page-hero:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:1.75rem;background:radial-gradient(circle at top right,rgba(98,214,63,.18),transparent 55%),radial-gradient(circle at bottom left,rgba(59,130,246,.15),transparent 55%);opacity:.9}.page-hero-content{position:relative;display:grid;grid-template-columns:minmax(0,2fr) auto;gap:1.5rem;padding:1.75rem;border-radius:1.75rem;background-color:#fffffff5;border:1px solid rgba(229,231,235,.9);overflow:hidden}.page-hero-text{max-width:720px}.page-hero-kicker{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:#62d63f;font-weight:700;margin-bottom:.35rem}.page-hero-title{margin:0 0 .4rem;font-size:1.6rem;font-weight:800;color:#020617}.page-hero-subtitle{margin:0;font-size:.9rem;color:#4b5563}.page-hero-stats{align-self:flex-start;display:flex;flex-direction:column;align-items:flex-end;gap:.3rem}.page-hero-stat-label{font-size:.75rem;color:#6b7280}.page-hero-stat-pill{padding:.3rem .75rem;border-radius:999px;font-size:.8rem;font-weight:600;background-color:#dcfce7;color:#166534;border:1px solid #bbf7d0}.page-hero-watermark{position:absolute;right:1.75rem;bottom:.9rem;font-size:2.5rem;font-weight:900;letter-spacing:.25em;color:#0f172a0d;pointer-events:none;text-transform:uppercase}.page-main{background:linear-gradient(180deg,#fff,#f3f4f6);border-radius:1.5rem;border:1px solid #e5e7eb;padding:1.25rem 1.5rem 1.5rem;display:flex;flex-direction:column;min-height:0}.page-search-row{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem;margin-bottom:.9rem}.search-bar{display:flex;gap:.5rem;flex:1;max-width:720px}.search-bar input[type=text]{flex:1;padding:.6rem .95rem;border-radius:999px;border:1px solid #cbd5e1;font-size:.95rem;background:#fff}.search-bar input[type=text]:focus{outline:none;border-color:#2563eb}.search-bar button{padding:.55rem 1rem;border-radius:999px;border:none;background:#0f172a;color:#fff;font-size:.9rem;cursor:pointer;white-space:nowrap}.search-bar button:hover{background:#020617}.stats{font-size:.8rem;color:#6b7280;white-space:nowrap}.app-main-scroll{flex:1;overflow:auto}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.1rem;padding:.75rem .25rem .25rem}.card{background:#fff;border-radius:1.5rem;display:flex;flex-direction:column;border:1px solid rgba(229,231,235,.95);cursor:pointer;overflow:hidden;transform-origin:center;transition:transform .18s ease-out,box-shadow .18s ease-out,border-color .18s ease-out}.card:hover{transform:translateY(-4px) rotate(-.4deg);border-color:#9ca3afcc}.card-image-wrap{position:relative;height:260px;background-color:#f3f4f6;overflow:hidden}.card img{width:100%;height:100%;border-radius:0;object-fit:cover;transform:scale(1.02);transition:transform .35s ease-out}.card:hover img{transform:scale(1.08)}.card-image-placeholder{width:100%;height:100%;background:#e5e7eb}.card-body{padding:.9rem .95rem .95rem;display:flex;flex-direction:column;min-height:0}.card-category{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:#62d63f;font-weight:700;margin-bottom:.3rem}.card-title{font-size:1rem;font-weight:700;margin:0 0 .45rem;color:#020617}.card:hover .card-title{color:#62d63f}.card-pill-row{display:flex;flex-wrap:wrap;gap:.25rem;margin-top:.1rem}.pill{font-size:.7rem;padding:.15rem .5rem;background-color:#eff6ff;color:#1d4ed8;border-radius:999px;border:1px solid rgba(191,219,254,.95)}.price{font-weight:800;font-size:1.1rem;margin-top:.55rem;color:#047857}.error{color:#b91c1c;margin-bottom:.75rem;font-size:.9rem;padding:.4rem .6rem;border-radius:.5rem;background:#fee2e2;border:1px solid #fecaca}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a59;display:flex;align-items:center;justify-content:center;z-index:40;padding:1rem}.modal-panel{background:#fff;color:#0f172a;border-radius:1.5rem;max-width:1100px;width:100%;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;border:1px solid #e5e7eb}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:.9rem 1.25rem;border-bottom:1px solid rgba(226,232,240,.9)}.modal-header-actions{display:flex;align-items:center;gap:.5rem}.modal-title{font-size:1rem;font-weight:700;margin-right:1rem}.modal-close{background:transparent;border:none;color:#6b7280;font-size:1.2rem;cursor:pointer;padding:.25rem .5rem}.modal-toggle-full{border-radius:999px;border:1px solid #e5e7eb;background-color:#f9fafb;color:#111827;font-size:.8rem;padding:.3rem .7rem;cursor:pointer}.modal-toggle-full:hover{background-color:#e5e7eb}.modal-body{display:flex;flex:1;padding:1rem 1.25rem 1.25rem;gap:1rem;overflow:auto}.modal-main{flex:2;display:flex;align-items:center;justify-content:center;position:relative}.modal-main img{max-width:100%;max-height:70vh;border-radius:1.25rem;object-fit:contain;background:#0b1120}.modal-nav{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:999px;border:1px solid rgba(148,163,184,.6);background:#0f172aeb;color:#f9fafb;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.1rem}.modal-nav-left{left:.5rem}.modal-nav-right{right:.5rem}.modal-side{flex:1;min-width:0}.thumb-row{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.5rem}.thumb-row img{width:64px;height:64px;object-fit:cover;border-radius:.4rem;cursor:pointer;border:2px solid transparent}.thumb-row img.modal-thumb-active{border-color:#facc15}.modal-meta{font-size:.8rem;color:#cbd5f5;margin-top:.25rem}.modal-product-meta{margin-top:.75rem;display:flex;flex-direction:column;gap:.35rem;font-size:.8rem;color:#111827}.modal-field{display:flex;gap:.4rem}.modal-field-label{font-weight:600;color:#4b5563;min-width:80px}.modal-field-value{color:#111827}.modal-link{color:#2563eb;text-decoration:none}.modal-link:hover{text-decoration:underline}@media (max-width: 768px){.page-shell{padding:1rem .9rem 1.25rem}.page-hero-content{display:flex;flex-direction:column;align-items:flex-start;padding:1.25rem 1.2rem 1.4rem;gap:.9rem}.page-hero-text{max-width:100%}.page-hero-title{font-size:1.3rem}.page-hero-subtitle{font-size:.85rem}.page-hero-stats{align-items:flex-start}.page-hero-watermark{font-size:1.6rem;right:1.2rem}}@media (min-width: 1024px){.shell{padding:1.25rem 2.5rem 2rem}.grid{gap:1.1rem;grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width: 640px){.page-header-bar{flex-direction:column;align-items:flex-start;gap:.5rem}.page-header-bar-right{align-items:flex-start}.page-main{padding:1rem 1.1rem 1.25rem;border-radius:1.2rem}.page-search-row{flex-direction:column;align-items:stretch}.search-bar button{width:100%}.modal-body{flex-direction:column}}
