/*!
 * Hey Color 2.0.0
 * Uma ferramenta da HeyForge para o Adobe After Effects.
 * Desenvolvido por Neto Salazar.
 * HeyForge - ferramentas feitas por quem vive de movimento, para quem vive de movimento.
 * (c) 2026 HeyForge. Todos os direitos reservados.
 */
body.layout-ready{min-height:0;max-width:100%;overflow:hidden}
.panel,.simulator,.palette-list,.palette-card,.palette-strip{min-width:0;max-width:100%}
.palette-card{position:relative}
.palette-name{position:absolute;left:1px;right:1px;top:-16px;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:0;padding:0;pointer-events:none}
.palette-name__text{display:block;min-width:0;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-dim);font-size:9.5px;font-weight:600;opacity:0;transition:opacity .12s ease}
.palette-name__text:empty{display:none}
.palette-card:hover .palette-name__text,.palette-card:focus-within .palette-name__text{opacity:1}
.palette-actions{position:static;display:flex;align-items:center;gap:1px;margin-left:auto;pointer-events:auto}
.palette-action{width:16px;height:16px;display:flex;align-items:center;justify-content:center;color:#aaa;transition:color .15s ease,opacity .15s ease}
.palette-action svg{width:13px;height:13px}
.palette-action svg{width:14px;height:14px;display:block;fill:currentColor}
.palette-action:hover,.palette-action.is-active{color:var(--accent)}
.palette-card:not(:hover):not(:focus-within) .palette-action:not(.is-active){opacity:0;pointer-events:none}
.rail-actions{display:none}
body:not(.is-narrow) .shade{height:auto}
@media(hover:none){.palette-action:not(.is-active){opacity:1!important;pointer-events:auto!important}}
@media(min-width:81px) and (max-width:210px){.wordmark,.header-actions .header-social--instagram,.header-actions .header-social--youtube{display:none}}
@media(min-width:160px) and (max-width:210px){.wordmark{display:block}}
@media(min-width:81px) and (max-width:120px){.library-toolbar{display:grid;grid-template-columns:1fr 1fr;gap:4px}.search-wrap{grid-column:1 / -1;width:100%}.tool-square{width:100%;min-width:0}}
body.is-narrow{display:flex;flex-direction:column;--rail-cell:48px;--rail-hover:70px}
body.is-narrow>.panel{height:34px;min-height:34px;padding:3px;flex:none}
body.is-narrow .topbar{height:28px;min-height:28px;justify-content:center}
body.is-narrow .brand{flex:none;cursor:pointer}
body.is-narrow .logo{width:26px;height:26px;min-width:26px;min-height:26px}
body.is-narrow .wordmark,body.is-narrow .header-actions,body.is-narrow .library-toolbar,body.is-narrow .search-wrap,body.is-narrow .filter-pill{display:none!important}
body.is-narrow .simulator{height:auto;min-height:0;flex:1;padding:0}
body.is-narrow .palette-list{padding:2px 3px 6px;gap:7px;scroll-snap-type:none;overscroll-behavior:contain;overflow-x:hidden}
body.is-narrow .palette-card{scroll-snap-align:start;gap:2px;width:100%;flex:none}
body.is-narrow .palette-name{height:18px;min-height:18px;padding:0;font-size:9px}
body.is-narrow .palette-actions{display:none!important}
body.is-narrow .palette-strip{display:flex;flex-direction:column;width:48px;max-width:100%;height:auto;min-height:0;margin:0 auto;border-radius:6px}
body.is-narrow .shade{display:block;width:100%;height:var(--rail-cell);min-height:var(--rail-cell);flex:0 0 auto;transition:height .18s ease,min-height .18s ease}
body.is-narrow .shade:hover{height:var(--rail-hover);min-height:var(--rail-hover);flex-grow:0}
body.is-narrow .rail-actions{display:none}
body.is-narrow.rail-open .rail-actions{position:relative;display:flex;flex-direction:column;align-items:center;gap:1px;width:100%;height:124px;min-height:124px;flex:none;padding:2px 0;background:var(--bg);border-top:1px solid var(--border);z-index:20}
body.is-narrow .rail-actions button{position:relative;width:100%;min-width:0;height:29px;min-height:29px;display:flex;align-items:center;justify-content:center;flex:none;border:0;border-radius:0;background:transparent;margin:0;color:var(--text-dim)}
body.is-narrow .rail-actions button svg{width:15px;height:15px}
body.is-narrow .rail-actions button:hover{color:var(--accent)}
body.is-narrow .empty-results{width:100%;margin:10px 0;padding:0 2px;font-size:10px;overflow-wrap:anywhere}
body.is-narrow .empty-results button{max-width:100%;font-size:10px;overflow-wrap:anywhere}
body.is-rail-small{--rail-cell:32px;--rail-hover:48px}
body.is-rail-small .palette-name{display:none}
body.is-rail-small .palette-strip{width:100%;margin:0}

@media(max-width:470px){body>.panel{padding-left:14px;padding-right:14px}}