@import url("styles.css?v=20261018");

.site-header{width:min(1320px,calc(100% - 48px));}
.main-nav{gap:clamp(14px,2.3vw,32px);margin-left:20px}
.main-nav a{white-space:nowrap}
.page-main{width:min(1060px,calc(100% - 48px));margin:0 auto;padding:70px 0 92px;min-height:calc(100vh - 170px)}
.page-intro{max-width:720px;margin:0 0 38px}
.page-intro .eyebrow{margin-bottom:18px}
.page-intro h1{font-family:Unbounded,Manrope,sans-serif;font-size:clamp(36px,6vw,62px);line-height:1.15;letter-spacing:-.065em;margin:0 0 16px}
.page-intro p{max-width:620px;margin:0;color:var(--muted);font-size:15px;line-height:1.8}
.page-panel{border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));padding:clamp(20px,4vw,34px)}
.page-panel h2,.page-section h2{font-family:Unbounded,Manrope,sans-serif;font-size:clamp(20px,3vw,29px);line-height:1.35;letter-spacing:-.05em;margin:0 0 12px}
.page-panel p,.page-section p{color:var(--muted);line-height:1.85;margin:0 0 14px}
.page-section{margin-top:48px}
.page-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.info-card,.step-card{padding:21px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.025)}
.info-card h2,.info-card h3{font-size:15px;margin:12px 0 6px}
.info-card p,.step-card p{font-size:12px;margin:0;color:var(--muted);line-height:1.75}
.info-card__icon{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--line);border-radius:11px;color:var(--acid);background:rgba(255,255,255,.04)}
.page-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:23px}
.page-actions .button{min-height:46px}
.steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;counter-reset:step}
.step-card{position:relative;min-height:150px;padding:22px 22px 22px 68px;counter-increment:step}
.step-card:before{content:counter(step,decimal-leading-zero);position:absolute;left:20px;top:22px;color:var(--acid);font:600 12px Unbounded, sans-serif}
.step-card h3{font-size:15px;margin:0 0 8px}
.step-card ol,.step-card ul{padding-left:18px;margin:8px 0 0;color:var(--muted);font-size:12px;line-height:1.9}
.page-note{padding:14px 16px;border-left:2px solid var(--violet);border-radius:0 10px 10px 0;background:rgba(168,146,255,.07);color:#c4c2d0;font-size:12px;line-height:1.8}
.catalog-toolbar{display:flex;gap:10px;align-items:center;margin:0 0 16px}
.catalog-toolbar input{width:min(100%,400px);height:46px;padding:0 15px;border:1px solid var(--line);border-radius:11px;outline:none;background:rgba(255,255,255,.035);color:var(--text);font:inherit}
.catalog-toolbar input:focus{border-color:rgba(183,255,55,.45)}
.catalog-status{margin:0 0 16px;color:var(--muted);font-size:12px}
.catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.catalog-card{min-width:0;padding:19px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.03)}
.catalog-card h2{font-size:15px;line-height:1.5;margin:0 0 13px;overflow-wrap:anywhere}
.catalog-meta{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.catalog-tag{padding:4px 8px;border:1px solid var(--line);border-radius:999px;color:#b5b7c0;font-size:10px}
.catalog-card .button{min-height:38px;font-size:11px;padding:0 12px}
.catalog-empty{grid-column:1/-1;padding:26px;border:1px dashed var(--line);border-radius:14px;color:var(--muted);text-align:center;font-size:13px}
.looks-tabs{display:flex;gap:8px;margin:0 0 18px}
.looks-tab{min-height:40px;padding:0 15px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);font:700 12px Manrope,sans-serif;cursor:pointer}
.looks-tab[aria-pressed="true"]{border-color:rgba(183,255,55,.4);background:rgba(183,255,55,.08);color:var(--acid)}
.look-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
.look-card{overflow:hidden;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.03)}
.look-card__preview{height:190px;padding:14px;display:grid;place-items:center;background:radial-gradient(ellipse,rgba(168,146,255,.13),transparent 70%)}
.look-card__preview img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}
.look-card__body{padding:12px}
.look-card__name{display:block;margin:0 0 10px;font-size:12px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.look-card .button{width:100%;min-height:36px;padding:0 8px;font-size:10px}
.profile-card{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:18px}
.profile-avatar{width:64px;height:64px;display:grid;place-items:center;border:1px solid rgba(183,255,55,.25);border-radius:19px;background:rgba(183,255,55,.08);color:var(--acid);font:600 22px Unbounded,sans-serif}
.profile-details h2{margin:0 0 4px;font-size:20px}
.profile-details p{margin:0;font-size:12px;overflow-wrap:anywhere}
.profile-status{grid-column:1/-1;color:var(--muted);font-size:12px;min-height:20px}
.simple-footer{min-height:86px;margin-top:0}
.simple-footer .footer-links{display:flex;gap:16px;flex-wrap:wrap}
.simple-footer .footer-links a{font-size:10px}
.guide-index{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px;margin:0 0 20px}
.guide-index a{min-height:47px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--line);color:#858892;font:700 10px Unbounded,Manrope,sans-serif}
.guide-index a span{flex:1;color:#e0e1de;font:700 12px Manrope,sans-serif}
.guide-index a b{color:var(--acid);font-size:13px}
.guide-index a:hover span{color:var(--acid)}
.guide-sections{display:grid;gap:10px}
.guide-detail{scroll-margin-top:22px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.025);overflow:hidden}
.guide-detail[open]{background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018))}
.guide-detail summary{min-height:62px;padding:13px 18px;display:flex;align-items:center;gap:14px;cursor:pointer;list-style:none}
.guide-detail summary::-webkit-details-marker{display:none}
.guide-detail summary>span{color:var(--acid);font:600 11px Unbounded,sans-serif}
.guide-detail summary>b{flex:1;font-size:14px}
.guide-detail summary>i{width:25px;height:25px;display:grid;place-items:center;border:1px solid var(--line);border-radius:8px;color:var(--muted);font-size:15px;font-style:normal;transition:transform .2s,color .2s}
.guide-detail[open] summary>i{transform:rotate(45deg);color:var(--acid)}
.guide-detail__body{padding:0 22px 22px 58px;color:#c5c7ce;font-size:12px;line-height:1.9}
.guide-detail__body p{margin:0 0 11px}
.guide-detail__body ul,.guide-detail__body ol{margin:7px 0 12px;padding-left:19px;color:#b1b3bb}
.guide-detail__body li{padding-left:3px;margin:3px 0}
.guide-detail__body a{color:var(--acid);font-weight:700}
.guide-detail__body code{padding:2px 5px;border:1px solid var(--line);border-radius:5px;background:rgba(0,0,0,.2);color:#e7e8e2;font-size:11px}
.guide-detail__body .page-actions{margin-top:10px}
.guide-detail__body .text-link{font-size:11px}
.about-copy{max-width:760px}
.about-copy p{font-size:14px}
.about-list{display:grid;gap:10px;margin:22px 0 0;padding:0;list-style:none}
.about-list li{padding:13px 15px;border:1px solid var(--line);border-radius:10px;color:#c5c7ce;font-size:12px;line-height:1.8;background:rgba(255,255,255,.02)}
.about-list b{color:var(--text)}
@media(max-width:900px){.look-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){
  .site-header{height:auto;min-height:68px;padding:12px 0;flex-wrap:wrap;gap:10px}
  .site-header .main-nav{position:static;order:3;width:100%;display:flex;visibility:visible;opacity:1;transform:none;margin:0;padding:8px 0 0;justify-content:space-between;border:0;background:none;box-shadow:none}
  .site-header .main-nav a{padding:0;font-size:10px}
  .page-main{width:calc(100% - 34px);padding:46px 0 64px;min-height:calc(100vh - 200px)}
  .page-intro{margin-bottom:26px}
  .page-intro p{font-size:13px}
  .page-grid,.steps,.catalog-grid{grid-template-columns:1fr}
  .guide-index{grid-template-columns:1fr}
  .guide-detail summary{gap:10px;padding-inline:13px}
  .guide-detail summary>b{font-size:12px}
  .guide-detail__body{padding:0 15px 18px 40px}
  .look-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .look-card__preview{height:150px}
  .catalog-toolbar input{width:100%}
  .profile-card{grid-template-columns:auto 1fr;gap:13px}
  .simple-footer{display:grid;grid-template-columns:1fr;gap:13px;padding:18px 0}
}