.guidelines-layout{display:grid;grid-template-columns:260px 1fr;gap:48px;align-items:start;margin-top:-20px}.guidelines-sidebar{position:sticky;top:100px;display:flex;flex-direction:column;gap:6px;background:#06060699;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:16px}.guideline-nav-link{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:10px;font-size:14px;font-weight:600;color:var(--text-secondary);text-decoration:none;transition:all .2s ease;border:1px solid transparent}.guideline-nav-link:hover{background:#ffffff0a;color:var(--text-primary)}.guideline-nav-link.active{background:#ffffff0f;color:var(--accent);border-color:#ffffff26}.guideline-nav-icon{display:flex;align-items:center;justify-content:center;color:inherit}.guidelines-content{display:flex;flex-direction:column;gap:32px}.guideline-card-header{display:flex;align-items:center;gap:16px;margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.06)}.guideline-card-icon{width:48px;height:48px;border-radius:12px;background:#ffffff05;border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:var(--accent)}.guideline-card-title{font-size:24px;font-weight:700;color:var(--text-primary)}.guideline-card-body{font-size:15px;color:var(--text-secondary);line-height:1.7}.guideline-card-body p{margin-bottom:16px}.guideline-card-body p:last-child{margin-bottom:0}.guideline-card-body ul{margin-left:20px;margin-bottom:16px}.guideline-card-body li{margin-bottom:8px}.color-palette-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px;margin-top:24px}.color-block{border-radius:12px;border:1px solid rgba(255,255,255,.1);overflow:hidden}.color-swatch{height:80px;width:100%}.color-info{padding:12px;background:#0006}.color-name{font-size:13px;font-weight:700;color:var(--text-primary);margin-bottom:4px}.color-hex{font-family:var(--font-mono);font-size:11px;color:var(--text-tertiary)}@media(max-width:1024px){.guidelines-layout{grid-template-columns:220px 1fr;gap:32px}}@media(max-width:768px){.guidelines-layout{grid-template-columns:1fr;gap:32px}.guidelines-sidebar{position:static;flex-direction:row;flex-wrap:wrap;justify-content:center;padding:12px}.guideline-nav-link{font-size:13px;padding:8px 12px}}@media(max-width:480px){.guideline-card-header{flex-direction:column;align-items:flex-start;gap:12px}}