:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;--color-bg: #1a1a1a;--color-surface: #222222;--color-surface-2: #2a2a2a;--color-border: #404040;--color-text: #e0e0e0;--color-text-muted: #888888;--color-accent: #4a9eff;--color-accent-contrast: #ffffff;--color-success: #4caf50;--radius-md: 8px;--radius-lg: 12px;--shadow-md: 0 8px 25px rgba(0, 0, 0, .4);--hero-gradient-from: #1e3c72;--hero-gradient-to: #2a5298;color-scheme:dark;color:var(--color-text);background-color:var(--color-bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:var(--color-accent);text-decoration:inherit}a:hover{opacity:.9}body{margin:0;min-width:320px;min-height:100vh;background:var(--color-bg);color:var(--color-text)}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;background-color:var(--color-bg);color:var(--color-text)}.App{min-height:100vh}.App-header{background:linear-gradient(135deg,#2c3e50,#34495e);padding:2rem;color:#fff;text-align:center;box-shadow:0 2px 10px #0000004d}.header-row{display:flex;align-items:center;justify-content:center;gap:.75rem}.App-header h1{margin:0 0 .5rem;font-size:2.5rem;font-weight:700}.subtitle{margin:0;opacity:.8;font-size:1.1rem}.help-button{margin-left:.25rem;background:#ffffff1f;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:999px;width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;text-align:center;font-weight:700;cursor:pointer;transition:all .2s ease}.help-button:hover{background:#ffffff38;border-color:#ffffff80}.controls{display:flex;gap:1rem;padding:1.5rem 5vw;background-color:var(--color-surface-2);border-bottom:1px solid var(--color-border);flex-wrap:wrap;align-items:center}.search-container{flex:1}.search-input{width:100%;padding:.75rem 1rem;font-size:1rem;border:2px solid var(--color-border);border-radius:var(--radius-md);background-color:#333;color:var(--color-text);transition:border-color .2s ease}.search-input:focus{outline:none;border-color:var(--color-accent)}.search-input::placeholder{color:var(--color-text-muted)}.filter-container{min-width:200px}.category-filter{width:100%;padding:.75rem 1rem;font-size:1rem;border:2px solid var(--color-border);border-radius:var(--radius-md);background-color:#333;color:var(--color-text);cursor:pointer;transition:border-color .2s ease}.category-filter:focus{outline:none;border-color:var(--color-accent)}.results-info{padding:1rem 5vw;color:var(--color-text-muted);font-size:.9rem;background-color:var(--color-surface);border-bottom:1px solid var(--color-border)}.item-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem;padding:2rem 5vw}.item-card{background:linear-gradient(145deg,#2a2a2a,#1f1f1f);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1.5rem;cursor:pointer;transition:all .2s ease;position:relative;overflow:hidden}.item-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--color-accent)}.item-card.copied{border-color:var(--color-success);background:linear-gradient(145deg,#2a3a2a,#1f2f1f)}.item-card h3{margin:0 0 .75rem;font-size:1.2rem;font-weight:600;color:#fff;line-height:1.3}.item-id{font-family:Courier New,monospace;font-size:.95rem;color:var(--color-accent);margin:.5rem 0;font-weight:500}.item-category{color:var(--color-text-muted);font-size:.85rem;margin:.5rem 0 0;text-transform:uppercase;letter-spacing:.5px}.copy-feedback{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:var(--color-success);color:#fff;padding:.5rem 1rem;border-radius:6px;font-weight:600;font-size:.9rem;animation:fadeInOut 2s ease-in-out}@keyframes fadeInOut{0%,to{opacity:0}50%{opacity:1}}.no-results{text-align:center;padding:3rem;color:#888;font-size:1.1rem}.site-footer{padding:1rem 5vw 2rem;color:var(--color-text-muted);font-size:.85rem;border-top:1px solid var(--color-border);background-color:var(--color-surface)}@media (max-width: 768px){.App-header{padding:1.5rem}.App-header h1{font-size:2rem}.controls{flex-direction:column;padding:1rem}.search-container,.filter-container{max-width:none;width:100%}.results-info{padding:1rem}.item-grid{grid-template-columns:1fr;padding:1rem;gap:1rem}.item-card{padding:1.25rem}}.hero-section{background:linear-gradient(135deg,var(--hero-gradient-from) 0%,var(--hero-gradient-to) 100%);padding:3rem 0;text-align:center;border-bottom:1px solid var(--color-border)}.hero-header{display:flex;align-items:center;justify-content:space-between;gap:1rem}.hero-content{padding:0 5vw}.hero-section h2{margin:0 0 .5rem;font-size:2rem;font-weight:700;color:#fff}.hero-section p{margin:0 0 2rem;font-size:1.1rem;color:#fffc}.hero-toggle{background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:8px;padding:.4rem .75rem;font-weight:600;cursor:pointer;transition:all .2s ease}.hero-toggle:hover{background:#fff3;border-color:#ffffff80}.hero-section.collapsed{padding:1rem 0}.popular-items-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1rem;margin-bottom:2rem}.popular-item{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-lg);padding:1.25rem;cursor:pointer;transition:all .2s ease;position:relative;overflow:hidden}.popular-item:hover{transform:translateY(-2px);background:#ffffff26;border-color:#ffffff4d;box-shadow:var(--shadow-md)}.popular-item.copied{background:#4caf5033;border-color:#4caf5080}.popular-item-name{font-size:1.1rem;font-weight:600;color:#fff;margin-bottom:.5rem}.popular-item-id{font-family:Courier New,monospace;font-size:.9rem;color:var(--color-accent);margin-bottom:.5rem;font-weight:500}.popular-item-desc{font-size:.85rem;color:#ffffffb3;text-transform:uppercase;letter-spacing:.5px}.console-tip{background:#0000004d;border-radius:8px;padding:1rem;color:#ffffffe6;font-size:.95rem}.console-tip code{background:#ffffff1a;padding:.25rem .5rem;border-radius:4px;font-family:Courier New,monospace;color:#4a9eff}.copy-feedback{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:#4caf50;color:#fff;padding:.5rem 1rem;border-radius:6px;font-weight:600;font-size:.9rem;animation:fadeInOut 2s ease-in-out}@media (max-width: 768px){.hero-section{padding:2rem 1rem}.hero-section h2{font-size:1.5rem}.popular-items-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.75rem}.popular-item{padding:1rem}.console-tip{font-size:.85rem}}.onboarding-banner{background-color:var(--color-surface);border-bottom:1px solid var(--color-border)}.onboarding-content{padding:.75rem 5vw;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.onboarding-text{display:flex;align-items:center;gap:1rem}.onboarding-bullets{display:grid;gap:.25rem;color:#cfcfcf;font-size:.95rem}.onboarding-bullets code{background:#ffffff0f;padding:.1rem .35rem;border-radius:4px;font-family:Courier New,monospace;color:var(--color-accent)}.onboarding-bullets kbd{background:#ffffff1a;padding:.1rem .35rem;border-radius:4px;border:1px solid rgba(255,255,255,.2)}.onboarding-actions{margin-left:auto}.onboarding-dismiss{background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:var(--radius-md);padding:.45rem .9rem;font-weight:600;cursor:pointer;transition:all .2s ease}.onboarding-dismiss:hover{background:#fff3;border-color:#ffffff80}