.palette-picker{position:relative;font:10px 'Space Mono';z-index:70}.palette-picker summary{cursor:pointer;list-style:none;background:#fff8e9;border:1px solid var(--line);border-radius:5px;padding:8px 10px;box-shadow:0 3px var(--key-shadow);white-space:nowrap}.palette-picker summary::-webkit-details-marker{display:none}.palette-options{position:absolute;right:0;top:40px;width:225px;padding:8px;background:#fffbee;border:1px solid var(--line);box-shadow:4px 5px #49325f22;border-radius:7px;display:grid;gap:3px}.palette-options button{display:flex;align-items:center;gap:10px;text-align:left;padding:10px;border-radius:4px;font:11px 'DM Sans';background:none;border:1px solid transparent;color:#352b40}.palette-options i{width:20px;height:20px;border-radius:50%;background:var(--swatch);border:1px solid #564b59;box-shadow:inset 0 2px #ffffff88}.palette-options button[aria-pressed=true]{border-color:#84748b;background:#eee6f1}.palette-options button:hover{background:#f0eadc}.about-second-portrait{margin:35px 0 0;transform:rotate(3deg)}.about-second-portrait img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 30%}.about-second-portrait figcaption{margin-top:10px;text-align:right;font:10px 'DM Sans';color:#746879}.about-second-portrait figcaption a{text-decoration:underline}
body[data-palette=pistachio]{--tone-bg:#e5e8d7;--tone-end:#f2ddc9;--tone-ink:#344d3c;--tone-muted:#61715b;--tone-accent:#45644c;--tone-border:#839773;--tone-shadow:#7c916d;--tone-chrome:#e5e8dbee;--tone-button:#c5d5a7;--tone-window:#fdf8e9;--tone-tab:#d6dfc3;--tone-warm:#edc3a0;--tone-cool:#cbd9c1;--tone-mark:#b5724d}
body[data-palette=poolside]{--tone-bg:#d9e9e9;--tone-end:#e8ddd4;--tone-ink:#284c59;--tone-muted:#54717a;--tone-accent:#28647a;--tone-border:#799da8;--tone-shadow:#68909d;--tone-chrome:#deebebee;--tone-button:#aad0dd;--tone-window:#fff8e9;--tone-tab:#c5dfe5;--tone-warm:#efb9a3;--tone-cool:#bcd6d6;--tone-mark:#b56650}
body[data-palette=butter]{--tone-bg:#f1e7c7;--tone-end:#ecd8cd;--tone-ink:#593d43;--tone-muted:#80645e;--tone-accent:#86454e;--tone-border:#b39982;--tone-shadow:#a28670;--tone-chrome:#f2e8cfee;--tone-button:#e8cc84;--tone-window:#fff9e9;--tone-tab:#e9dcb7;--tone-warm:#e4b0a3;--tone-cool:#dcd5b6;--tone-mark:#a9554f}
body.koko-site[data-palette]:not([data-palette=lavender]){--ink:var(--tone-ink);--purple:var(--tone-accent);--plum:var(--tone-ink);--line:var(--tone-border);--key-shadow:var(--tone-shadow);--paper:var(--tone-window);background-color:var(--tone-bg);background-image:linear-gradient(125deg,var(--tone-bg),var(--tone-end));color:var(--tone-ink)}
[data-palette]:not([data-palette=lavender]) .desktop-chrome{background:var(--tone-chrome);border-color:var(--tone-border)}
[data-palette]:not([data-palette=lavender]) :is(.file-tab,.project-tablist){background:var(--tone-tab);border-color:var(--tone-border)}
[data-palette]:not([data-palette=lavender]) :is(.tab-projects,.tab-press){background:var(--tone-warm)}
[data-palette]:not([data-palette=lavender]) :is(.tab-contact,.tab-writing){background:var(--tone-cool)}
[data-palette]:not([data-palette=lavender]) :is(.file-tab[aria-current=page],.project-switch[aria-selected=true],.project-console,.page-content,.page-window,.project-card){background:var(--tone-window);color:var(--tone-ink)}
[data-palette]:not([data-palette=lavender]) :is(.console-title,.page-title,.window-title,.chunky-button.primary){background:var(--tone-button);color:var(--tone-ink);border-color:var(--tone-border)}
[data-palette]:not([data-palette=lavender]) :is(.chunky-button,.keycap){border-color:var(--tone-border);box-shadow:3px 4px 0 var(--tone-shadow);color:var(--tone-ink)}
[data-palette]:not([data-palette=lavender]) .koko-title{color:var(--tone-accent);text-shadow:0 2px #fff8e9,2px 5px var(--tone-tab)}
[data-palette]:not([data-palette=lavender]) :is(.koko-title b,.scribble,.tiny-spark,.ticker-group a>span){color:var(--tone-mark)}
[data-palette]:not([data-palette=lavender]) :is(.portal,.mentions-panel){background:var(--tone-window);border-color:var(--tone-border);box-shadow:3px 4px 0 color-mix(in srgb,var(--tone-shadow) 35%,transparent)}
[data-palette]:not([data-palette=lavender]) .portal-appearances{background:var(--tone-tab)}
[data-palette]:not([data-palette=lavender]) .portal-press{background:var(--tone-cool)}
[data-palette]:not([data-palette=lavender]) :is(.project-console,.page-window,.project-card){border-color:var(--tone-border);box-shadow:5px 6px 0 color-mix(in srgb,var(--tone-shadow) 45%,transparent)}
[data-palette]:not([data-palette=lavender]) :is(.eyebrow,.intro-small,.personality-line,.personality-line b,.console-bottom,.project-switch,.project-panel-copy p,.portal p,.portal .mono,.desktop-section-label,.seen-in,.mentions-heading .mono,.os-footer,.file-tab small){color:var(--tone-muted)}
[data-palette]:not([data-palette=lavender]) :is(.mentions-heading h2,.brand-flower,.ticker-group a,.orbit-doodle,.page-content h1,.projects-main h1){color:var(--tone-accent)}
[data-palette]:not([data-palette=lavender]) .ticker{background:var(--tone-tab);border-color:var(--tone-border)}
[data-palette]:not([data-palette=lavender]) .project-switch[aria-selected=true]{box-shadow:inset 0 3px var(--tone-accent)}
[data-palette]:not([data-palette=lavender]) .drawn-icon{stroke:var(--tone-ink)}
[data-palette]:not([data-palette=lavender]) .drawn-icon [fill]:not([fill=none]){fill:var(--tone-cool)}
[data-palette]:not([data-palette=lavender]) .drawn-icon [fill="#fff7db"],[data-palette]:not([data-palette=lavender]) .drawn-icon [fill="#fff7e5"],[data-palette]:not([data-palette=lavender]) .drawn-icon [fill="#fff7dc"]{fill:var(--tone-window)}
[data-palette]:not([data-palette=lavender]) .page-about blockquote{background:var(--tone-tab);border-color:var(--tone-border)!important}
@media(max-width:720px){.palette-picker{font-size:8px}.palette-picker summary{padding:7px}.palette-options{width:210px}.about-second-portrait{margin-top:24px}.page-about article>figure{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:100%;transform:none}.page-about article>figure>figcaption{grid-column:1;grid-row:2;margin:0}.page-about .about-second-portrait{grid-column:2;grid-row:1/3;margin:0;transform:none}.page-about article>figure img{aspect-ratio:4/5;object-fit:cover}.about-second-portrait figcaption{font-size:9px}}

.palette-invite{display:block;border:0;background:none;padding:0;margin:2px 0 0;font:inherit!important;color:inherit;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:4px;text-align:left;cursor:pointer}.palette-invite:hover{text-decoration-style:solid}
