.ch-focus-layout{grid-template-columns:minmax(0,1fr);gap:24px;min-width:0;display:grid}.ch-focus-stage,.ch-focus-palettes{min-width:0;min-height:0}.ch-focus-stage{flex-direction:column;gap:16px;display:flex}.ch-focus-stage-heading{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:5px 18px;padding-inline:2px;display:flex}.ch-focus-stage-heading h2,.ch-focus-palette-heading h2{color:var(--ch-text);font-family:var(--font-display), sans-serif;letter-spacing:-.025em;margin:0;font-size:17px;font-weight:400;line-height:1.3}.ch-focus-stage-heading p,.ch-focus-palette-heading p{color:var(--ch-text-soft);margin:0;font-size:11px;line-height:1.6}.ch-focus-artwork{aspect-ratio:4/5;place-items:center;width:min(100%,520px);min-width:0;min-height:0;margin-inline:auto;display:grid}.ch-focus-artwork .ch-composition-canvas{object-fit:contain;width:100%;height:100%;min-height:0}.ch-focus-controls{min-width:0}.ch-focus-controls .ch-composition-actions{justify-content:center;gap:4px 24px;margin-top:0}.ch-focus-controls .ch-study-btn{min-height:44px;font-size:11px}.ch-focus-controls .ch-color-roles{justify-content:center}.ch-focus-palettes{border-top:1px solid var(--ch-line);flex-direction:column;padding-top:22px;display:flex}.ch-focus-palette-heading{flex-direction:column;gap:7px;padding:0 4px 16px;display:flex}.ch-focus-palette-list,.ch-focus-color-copy ul{margin:0;padding:0;list-style:none}.ch-focus-palette-list{grid-template-columns:minmax(0,1fr);align-content:start;gap:8px;min-height:0;padding:4px;display:grid}.ch-focus-palette{border:1px solid var(--ch-line);background:var(--ch-glass);width:100%;color:var(--ch-text);text-align:left;border-radius:12px;flex-direction:column;gap:11px;padding:12px;transition:background .18s,border-color .18s;display:flex}.ch-focus-palette[aria-pressed=true]{border-color:var(--color-blue);background:color-mix(in srgb, var(--color-blue) 6%, var(--color-bg));box-shadow:inset 0 0 0 1px var(--color-blue)}.ch-focus-palette-name{font-family:var(--font-display), sans-serif;justify-content:space-between;align-items:center;gap:10px;font-size:13px;font-weight:400;line-height:1.3;display:flex}.ch-focus-palette-name svg{flex:none}.ch-focus-palette-strip{width:100%;height:30px;box-shadow:0 0 0 1px var(--ch-line);border-radius:4px;display:flex;overflow:hidden}.ch-focus-palette-strip>span{flex:1 1 0;min-width:0}.ch-focus-color-copy{border-top:1px solid var(--ch-line);flex:none;margin-top:16px;padding:16px 4px 0}.ch-focus-color-copy h3{color:var(--ch-text-soft);font-family:var(--font-body), sans-serif;margin:0 0 6px;font-size:11px;font-weight:400;line-height:1.5}.ch-focus-color-copy ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px;display:grid}.ch-focus-hex{max-width:100%;min-height:44px;color:var(--ch-text);font-family:var(--font-body), sans-serif;background:0 0;border:0;border-radius:4px;align-items:center;gap:7px;padding:5px 2px;font-size:10px;line-height:1.4;display:inline-flex}.ch-focus-color-dot{width:13px;height:13px;box-shadow:inset 0 0 0 1px var(--ch-line);border-radius:50%;flex:none}.ch-focus-palette:focus-visible,.ch-focus-hex:focus-visible{outline:2px solid var(--color-blue);outline-offset:2px}@media (hover:hover){.ch-focus-palette:hover{border-color:color-mix(in srgb, var(--color-blue) 60%, transparent);background:color-mix(in srgb, var(--color-blue) 4%, var(--color-bg))}.ch-focus-palette[aria-pressed=true]:hover{border-color:var(--color-blue)}.ch-focus-hex:hover{color:var(--color-indigo);text-underline-offset:3px;text-decoration:underline}}@media (min-width:761px){.ch-wrap-focus{height:100%}.ch-wrap-focus .ch-content{flex-direction:column;height:100%;display:flex}.ch-wrap-focus .ch-toolbar,.ch-wrap-focus .ch-favorites,.ch-wrap-focus .ch-storage-notice{flex:none}.ch-focus-layout{flex:1 0 440px;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:28px;min-height:440px}.ch-focus-stage{padding:4px 0}.ch-focus-stage-heading{flex:none}.ch-focus-artwork{aspect-ratio:auto;flex:1 1 0;width:100%}.ch-focus-controls{flex:none}.ch-focus-palettes{border-top:0;border-left:1px solid var(--ch-line);padding:4px 0 0 24px}.ch-focus-palette-list{overscroll-behavior-y:contain;scrollbar-width:thin;scrollbar-color:var(--ch-line) transparent;scrollbar-gutter:stable;flex:auto;overflow-y:auto}.ch-focus-color-copy ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 6px}.ch-focus-hex{font-size:10px}}
