:root{--color-black: #000000;--color-dark: #0A0A0A;--color-card: #1A1A1A;--color-slate: #2D2D2D;--color-gray-medium: #4A4A4A;--color-gray: #7A7A7A;--color-light: #E5E5E5;--color-white: #FFFFFF;--gradient-primary: linear-gradient(90deg, #FFFFFF 0%, #E5E5E5 100%);--border-light: 1px solid rgba(255, 255, 255, .1);--border-subtle: 1px solid rgba(255, 255, 255, .07);--shadow-elevated: 0 4px 24px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 255, 255, .05);--radius: 16px;--radius-sm: 12px}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Inter,Helvetica Neue,sans-serif;background:var(--color-black);color:var(--color-white);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;font-size:14px;line-height:1.4}h1{font-weight:700;font-size:28px;letter-spacing:-.5px;margin:0 0 16px}h2{font-weight:600;font-size:22px;margin:0 0 12px}h3{font-weight:600;font-size:16px;margin:0 0 8px}p{font-weight:400;font-size:14px;color:var(--color-gray);line-height:1.4;margin:0}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}@keyframes glow{0%,to{box-shadow:var(--shadow-elevated)}50%{box-shadow:0 12px 40px #ffffff1a,inset 0 1px #ffffff14}}.card{animation:fadeIn .4s ease-out}.card:hover{animation:glow 1.5s ease-in-out}header.app-header{background:#0a0a0ad9;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);padding:12px 20px;border-bottom:var(--border-subtle);display:flex;align-items:center;gap:16px;box-shadow:0 4px 16px #0006;position:sticky;top:0;z-index:100}.brand{font-weight:700;font-size:18px;color:var(--color-white);letter-spacing:-.5px;animation:fadeIn .6s ease-out}.nav-btn{background:transparent;border:1px solid rgba(255,255,255,.15);padding:10px 16px;border-radius:var(--radius-sm);cursor:pointer;color:var(--color-white);font-weight:600;font-size:16px;transition:all .2s ease}.nav-btn:hover{background:#ffffff0d;border-color:#ffffff40;transform:translateY(-2px)}.nav-btn:active{transform:translateY(0)}main.app-main{padding:24px 20px;max-width:1100px;margin:0 auto;animation:slideUp .4s ease-out}.catalog{display:grid;grid-template-columns:1fr 180px;gap:24px}.catalog .list{background:transparent}.search{margin:16px 0 24px}.search input{padding:12px 16px;border:var(--border-light);border-radius:var(--radius-sm);width:100%;max-width:300px;background:#ffffff08;color:var(--color-white);font-size:14px;transition:all .2s ease}.search input:focus{outline:none;background:#ffffff0f;border-color:#fff3;box-shadow:0 0 0 3px #ffffff0d}.search input::placeholder{color:var(--color-gray)}.products{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card{background:var(--color-card);border:var(--border-light);border-radius:var(--radius);padding:0;overflow:hidden;box-shadow:var(--shadow-elevated);display:flex;flex-direction:column;transition:transform .3s ease,box-shadow .3s ease}.card:hover{transform:translateY(-4px);box-shadow:0 12px 40px #ffffff1a,inset 0 1px #ffffff0d}.card img{width:100%;height:200px;object-fit:contain;object-position:center;background:var(--color-white);display:block;transition:transform .3s ease,filter .3s ease}.card:hover img{transform:scale(1.03);filter:brightness(1.05)}.card>*{padding:0 14px}.card h3{font-weight:600;font-size:16px;color:var(--color-white);margin:14px 0 6px;line-height:1.3}.card>div:not(:first-child){padding:0 14px;font-size:13px;color:var(--color-gray)}.card .price{font-weight:700;font-size:18px;color:var(--color-white);margin:10px 0 12px!important}.card>div:last-child{display:flex;gap:8px;padding:0 14px 14px;margin-top:auto}.card button{flex:1;padding:10px 12px;background:transparent;color:var(--color-white);border:1px solid rgba(255,255,255,.15);border-radius:var(--radius-sm);cursor:pointer;font-weight:500;font-size:13px;transition:all .2s ease}.card button:hover{background:#ffffff14;border-color:#ffffff40;transform:translateY(-1px)}.card button:active{background:#ffffff1f;transform:translateY(0)}.right-panel{background:var(--color-card);border:var(--border-light);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow-elevated);max-width:180px;height:fit-content;position:sticky;top:80px;animation:fadeIn .5s ease-out .1s backwards}.right-panel h3{font-size:13px;font-weight:600;color:var(--color-white);margin-top:0;text-transform:uppercase;letter-spacing:.5px}.right-panel select,.right-panel input{width:100%;padding:8px 10px;border:var(--border-light);border-radius:var(--radius-sm);background:#ffffff08;color:var(--color-white);font-size:12px;transition:all .2s ease}.right-panel select:hover,.right-panel input:hover{background:#ffffff0d;border-color:#ffffff26}.right-panel select:focus,.right-panel input:focus{outline:none;background:#ffffff14;border-color:#fff3;box-shadow:0 0 0 3px #ffffff0d}.right-panel option{background:var(--color-dark);color:var(--color-white)}.consent-modal .modal-card{border-radius:var(--radius);background:var(--color-card);animation:slideUp .3s ease-out}button{font-family:inherit}@media (max-width: 900px){.products{grid-template-columns:repeat(2,1fr)}.catalog{grid-template-columns:1fr}.right-panel{position:static;max-width:100%}}@media (max-width: 640px){main.app-main{padding:16px}.products{grid-template-columns:1fr;gap:16px}.card{border-radius:12px}.search input{max-width:100%}header.app-header{flex-wrap:wrap;padding:10px 16px}.brand{font-size:16px}.nav-btn{font-size:14px;padding:8px 12px}h1{font-size:24px}h2{font-size:18px}}
