.color-module__N_hIEW__picker{align-self:stretch;align-items:center;gap:clamp(6px, calc(1.2 * var(--vh)), 14px);flex-direction:column;flex:1 1 0;width:100%;min-width:0;min-height:0;display:flex}.color-module__N_hIEW__pickerTitle{text-align:center;font-family:var(--font-heading);font-weight:800;font-size:clamp(22px, calc(4.2 * var(--vw)), 44px);color:var(--navy);letter-spacing:-.02em;text-shadow:0 3px #ffffffe6;flex:none;margin:0;line-height:1}.color-module__N_hIEW__grid{gap:clamp(10px, calc(1.6 * var(--vw)), 22px);flex:1 1 0;grid-template-rows:repeat(2,minmax(0,1fr));grid-template-columns:repeat(3,minmax(0,1fr));width:min(100%,1120px);min-height:0;display:grid}@container play (orientation:portrait){.color-module__N_hIEW__grid{grid-template-rows:repeat(3,minmax(0,1fr));grid-template-columns:repeat(2,minmax(0,1fr))}}.color-module__N_hIEW__card{min-width:0;min-height:0;padding:clamp(6px, calc(1.2 * var(--vw)), 14px);background:var(--cream);color:var(--navy);cursor:pointer;font:inherit;-webkit-tap-highlight-color:transparent;border:5px solid #fff;border-radius:28px;flex-direction:column;align-items:center;gap:4px;transition:transform .15s,box-shadow .15s;display:flex;box-shadow:0 7px #e6d9bd,0 14px 28px #061b4e24}.color-module__N_hIEW__card:active{transform:translateY(5px)scale(.98);box-shadow:0 2px #e6d9bd,0 6px 14px #061b4e24}.color-module__N_hIEW__card:focus-visible{outline:4px solid var(--blue);outline-offset:3px}@media (hover:hover){.color-module__N_hIEW__card:hover{transform:translateY(-4px)}}.color-module__N_hIEW__thumbBox{flex:1 1 0;justify-content:center;align-items:center;width:100%;min-height:0;display:flex}.color-module__N_hIEW__thumb{max-width:100%;max-height:100%;width:auto!important;height:auto!important}.color-module__N_hIEW__name{font-family:var(--font-heading);letter-spacing:-.01em;font-weight:800;line-height:1;font-size:clamp(16px, calc(2.2 * var(--vw)), 28px);flex:none}.color-module__N_hIEW__root{justify-content:center;align-self:stretch;align-items:center;gap:clamp(8px, calc(1.4 * var(--vw)), 14px);flex-direction:column;flex:1 1 0;min-width:0;min-height:0;display:flex}.color-module__N_hIEW__root[data-layout=side]{flex-direction:row}.color-module__N_hIEW__area{flex:1 1 0;align-self:stretch;place-items:center;min-width:0;min-height:0;padding:6px;display:grid}.color-module__N_hIEW__paper{background:var(--paper);touch-action:none;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;border-radius:22px;flex:none;position:relative;overflow:hidden;box-shadow:0 10px #e3dac6,0 24px 48px #061b4e2e}.color-module__N_hIEW__root[data-mode=scribble] .color-module__N_hIEW__paper{cursor:crosshair}.color-module__N_hIEW__canvas{pointer-events:none;width:100%;height:100%;display:block;position:absolute;inset:0}.color-module__N_hIEW__loading{place-items:center;display:grid;position:absolute;inset:0}.color-module__N_hIEW__sparkWrap{left:var(--x);top:var(--y);pointer-events:none;width:0;height:0;position:absolute}.color-module__N_hIEW__spark{background:var(--c);width:14px;height:14px;animation:color-module__N_hIEW__spark var(--ms) cubic-bezier(.2,.8,.3,1) forwards;border-radius:50%;position:absolute;top:-7px;left:-7px;box-shadow:0 0 0 2px #ffffffd9}.color-module__N_hIEW__ring{border:5px solid var(--c);width:22px;height:22px;animation:color-module__N_hIEW__ring calc(var(--ms) * .8) ease-out forwards;border-radius:50%;position:absolute;top:-11px;left:-11px;box-shadow:0 0 0 2px #ffffffb3}@keyframes color-module__N_hIEW__spark{0%{opacity:1;transform:translate(0)scale(1)}to{transform:translate(var(--dx), var(--dy)) scale(.15);opacity:0}}@keyframes color-module__N_hIEW__ring{0%{opacity:.95;transform:scale(.4)}to{opacity:0;transform:scale(3.4)}}.color-module__N_hIEW__tray{background:#ffffffb8;border-radius:26px;flex-wrap:wrap;flex:none;justify-content:center;align-items:flex-end;gap:6px;max-width:100%;padding:10px 12px 8px;display:flex;position:relative;box-shadow:0 6px #0000000f,0 12px 28px #061b4e1a}.color-module__N_hIEW__root[data-layout=bottom] .color-module__N_hIEW__tray{row-gap:12px}.color-module__N_hIEW__root[data-layout=side] .color-module__N_hIEW__tray{flex-direction:column;place-content:center;align-items:center;gap:4px;max-width:none;max-height:100%;padding:10px 8px}.color-module__N_hIEW__modes{--c:#999;flex:none;justify-content:center;gap:10px;display:flex}.color-module__N_hIEW__root[data-layout=bottom] .color-module__N_hIEW__modes{order:1;margin:0 4px}.color-module__N_hIEW__root[data-layout=bottom] .color-module__N_hIEW__trayUndo{order:1}.color-module__N_hIEW__root[data-layout=bottom] .color-module__N_hIEW__tray .color-module__N_hIEW__done,.color-module__N_hIEW__root[data-layout=bottom] .color-module__N_hIEW__bucket{order:2}.color-module__N_hIEW__root[data-layout=side] .color-module__N_hIEW__modes{gap:6px;margin-bottom:2px}@container play (max-height:500px){.color-module__N_hIEW__root[data-layout=side] .color-module__N_hIEW__modes{flex-direction:column}}.color-module__N_hIEW__mode{width:72px;height:72px;color:var(--navy);font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;background:#ffffff8c;border:0;border-radius:22px;flex-direction:column;flex:none;justify-content:center;align-items:center;gap:1px;padding:4px 0 0;transition:transform .15s,box-shadow .15s,background-color .15s;display:flex;box-shadow:0 3px #061b4e1f}.color-module__N_hIEW__mode svg{width:42px;height:42px;stroke:var(--navy);stroke-width:2.6px;stroke-linecap:round;stroke-linejoin:round;opacity:.75;flex:none;transition:opacity .15s}.color-module__N_hIEW__modeName{letter-spacing:.02em;opacity:.8;font-size:12px;font-weight:900;line-height:1}.color-module__N_hIEW__mode[aria-pressed=true]{box-shadow:0 0 0 4px var(--navy), 0 6px 0 #061b4e2e, 0 10px 18px #061b4e24;background:#fff;transform:translateY(-2px)}.color-module__N_hIEW__mode[aria-pressed=true] svg,.color-module__N_hIEW__mode[aria-pressed=true] .color-module__N_hIEW__modeName{opacity:1}.color-module__N_hIEW__mode:active{transform:translateY(2px)}.color-module__N_hIEW__mode:focus-visible{outline:4px solid var(--blue);outline-offset:4px}.color-module__N_hIEW__crayon{--c:#999;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;background:0 0;border:0;flex:none;place-items:center;width:64px;height:108px;padding:0;display:grid;position:relative}.color-module__N_hIEW__root[data-layout=side] .color-module__N_hIEW__crayon{width:112px;height:44px}@container play (min-height:900px){.color-module__N_hIEW__root[data-layout=side] .color-module__N_hIEW__crayon{height:54px}}@container play (max-width:480px){.color-module__N_hIEW__root[data-layout=bottom] .color-module__N_hIEW__crayon{width:52px;height:96px}}@container play (min-width:1100px){.color-module__N_hIEW__root[data-layout=bottom] .color-module__N_hIEW__crayon{width:72px;height:116px}}.color-module__N_hIEW__crayon:focus-visible{outline:4px solid var(--blue);outline-offset:-2px;border-radius:16px}.color-module__N_hIEW__crayon:before{content:"";box-shadow:0 0 0 3px color-mix(in srgb, var(--c) 70%, white), 0 0 18px color-mix(in srgb, var(--c) 55%, transparent);opacity:0;background:#ffffffe6;border-radius:16px;transition:opacity .18s,transform .18s;position:absolute;inset:8px 4px 4px;transform:scale(.85)}.color-module__N_hIEW__crayon[aria-pressed=true]:before{opacity:1;transform:none}.color-module__N_hIEW__root[data-layout=side] .color-module__N_hIEW__crayon:before{border-radius:14px;inset:2px}.color-module__N_hIEW__stick{filter:drop-shadow(0 3px 2px #061b4e47);flex-direction:column;width:38px;height:96px;transition:transform .2s cubic-bezier(.2,1.5,.4,1),filter .2s;display:flex;position:relative}.color-module__N_hIEW__root[data-layout=side] .color-module__N_hIEW__stick{flex-direction:row;width:98px;height:36px}@container play (max-width:480px){.color-module__N_hIEW__root[data-layout=bottom] .color-module__N_hIEW__stick{width:32px;height:84px}}.color-module__N_hIEW__crayon:active .color-module__N_hIEW__stick{transform:translateY(-5px)scale(1.04)}.color-module__N_hIEW__crayon[aria-pressed=true] .color-module__N_hIEW__stick{filter:drop-shadow(0 0 10px var(--c)) drop-shadow(0 6px 4px #061b4e47);transform:translateY(-8px)scale(1.06)}.color-module__N_hIEW__root[data-layout=side] .color-module__N_hIEW__crayon:active .color-module__N_hIEW__stick{transform:scale(1.03)}.color-module__N_hIEW__root[data-layout=side] .color-module__N_hIEW__crayon[aria-pressed=true] .color-module__N_hIEW__stick{transform:scale(1.06)}.color-module__N_hIEW__tip{background:linear-gradient(90deg, color-mix(in srgb, var(--c) 72%, black) 0%, var(--c) 45%, color-mix(in srgb, var(--c) 70%, white) 100%);clip-path:polygon(32% 0,68% 0,100% 100%,0 100%);flex:0 0 24px}.color-module__N_hIEW__root[data-layout=side] .color-module__N_hIEW__tip{background:linear-gradient(180deg, color-mix(in srgb, var(--c) 70%, white) 0%, var(--c) 55%, color-mix(in srgb, var(--c) 72%, black) 100%);clip-path:polygon(0 32%,0 68%,100% 100%,100% 0)}.color-module__N_hIEW__body{background:linear-gradient(90deg, color-mix(in srgb, var(--c) 78%, black) 0%, var(--c) 30%, color-mix(in srgb, var(--c) 72%, white) 62%, var(--c) 100%);border-radius:0 0 9px 9px;flex:auto;position:relative}.color-module__N_hIEW__root[data-layout=side] .color-module__N_hIEW__body{background:linear-gradient(180deg, color-mix(in srgb, var(--c) 72%, white) 0%, var(--c) 38%, var(--c) 70%, color-mix(in srgb, var(--c) 78%, black) 100%);border-radius:0 9px 9px 0}.color-module__N_hIEW__band{background:#fff8e9b8;border-top:2px solid #061b4e38;border-bottom:2px solid #061b4e38;height:26%;position:absolute;top:18%;left:0;right:0}.color-module__N_hIEW__root[data-layout=side] .color-module__N_hIEW__band{border:0;border-left:2px solid #061b4e38;border-right:2px solid #061b4e38;width:26%;height:auto;inset:0 auto 0 18%}.color-module__N_hIEW__eraser .color-module__N_hIEW__tip,.color-module__N_hIEW__eraser .color-module__N_hIEW__body{box-shadow:inset 0 0 0 2px #061b4e38}.color-module__N_hIEW__tray .color-module__N_hIEW__done{flex:none;min-height:72px;margin-left:8px;padding:12px 24px;font-size:22px}.color-module__N_hIEW__root[data-layout=side] .color-module__N_hIEW__tray .color-module__N_hIEW__done{width:112px;min-height:64px;margin:2px 0 0;padding:8px;font-size:20px}.color-module__N_hIEW__bucket{pointer-events:none;flex:none;display:none}@container play (min-height:1000px){.color-module__N_hIEW__root[data-layout=side] .color-module__N_hIEW__bucket{width:48px;margin-top:6px;display:block}}@container play (min-width:1000px){.color-module__N_hIEW__root[data-layout=bottom] .color-module__N_hIEW__bucket{align-self:flex-end;width:54px;margin-left:10px;display:block}}button.color-module__N_hIEW__trayUndo{display:none}@container play (max-width:480px){button.color-module__N_hIEW__headerUndo{display:none}button.color-module__N_hIEW__trayUndo{margin-left:4px;display:grid}}.color-module__N_hIEW__dim{opacity:.45}.color-module__N_hIEW__preview{width:180px;max-width:calc(56 * var(--vw));background:var(--paper);border:4px solid #fff;border-radius:14px;height:auto;margin:6px auto 8px;display:block;box-shadow:0 6px 16px #061b4e2e}@container play (max-height:900px){.color-module__N_hIEW__preview{width:110px;margin:4px auto 6px}}@container play (max-height:700px) or (max-width:480px){.color-module__N_hIEW__preview{display:none}}.color-module__N_hIEW__previewCaption{display:block}@media (prefers-reduced-motion:reduce){.color-module__N_hIEW__stick,.color-module__N_hIEW__crayon:before,.color-module__N_hIEW__card,.color-module__N_hIEW__mode,.color-module__N_hIEW__mode svg{transition:none}.color-module__N_hIEW__mode[aria-pressed=true],.color-module__N_hIEW__mode:active{transform:none}.color-module__N_hIEW__spark,.color-module__N_hIEW__ring{animation:none;display:none}}