:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--canvas:#f7f1e8;--paper:#fffaf2;--paper-strong:#fff;--ink:#172123;--muted:#6f665d;--quiet:#948a80;--line:#201f1c1f;--line-strong:#201f1c33;--teal:#007d78;--teal-dark:#07585e;--coral:#ff537b;--ochre:#f2b134;--green:#006d2c;--blue:#0b7285;--shadow:0 18px 55px #2520181f;--soft-shadow:0 10px 30px #25201814;--radius:8px;--control-radius:7px;--rail-width:68px;background:var(--canvas);color:var(--ink);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{min-width:320px;min-height:100%;overflow-x:hidden}body{background:linear-gradient(#ffffff6b 1px, transparent 1px), linear-gradient(90deg, #ffffff61 1px, transparent 1px), radial-gradient(circle at 16px 16px, #0e1f210b 1px, transparent 1.4px), var(--canvas);background-size:34px 34px,34px 34px,22px 22px,auto;min-width:320px;min-height:100vh;margin:0;overflow-x:hidden}button,input{font:inherit}button{cursor:pointer;border:0}button:disabled{cursor:not-allowed;opacity:.5}#root,.app-shell{min-height:100vh}.mini-wheel{background:radial-gradient(circle,#ffffffe0 0 22%,#0000 23%),conic-gradient(#f2b134,#ff537b,#783bd8,#147bd1,#00a790,#7fbf52,#f2b134);border-radius:50%;flex:none;width:17px;height:17px;margin-left:auto;display:inline-block}.icon-button:focus-visible,.ghost-button:focus-visible,.primary-button:focus-visible,.wide-button:focus-visible,.colorblind-toggle button:focus-visible,.your-picks button:focus-visible{outline-offset:2px;outline:2px solid #0b7285}.workbench{isolation:isolate;flex-direction:column;min-width:0;min-height:100vh;display:flex;position:relative}.topbar{z-index:1000;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#fffaf2e6;justify-content:space-between;align-items:center;gap:18px;min-height:58px;padding:12px 22px 12px 24px;display:flex;position:relative}.topbar h1{background:var(--title-gradient,linear-gradient(92deg, var(--teal), var(--coral), var(--ochre)));color:#0000;filter:drop-shadow(0 12px 16px #22181033);letter-spacing:0;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;min-width:max-content;margin:0;font-size:25px;font-weight:760;line-height:1}.topbar-actions{justify-content:flex-end;align-items:center;gap:10px;min-width:0;display:flex;position:relative}.menu-wrap{z-index:1100;align-items:center;display:inline-flex;position:relative}.dropdown-menu{z-index:1200;border:1px solid var(--line);border-radius:var(--radius);min-width:168px;box-shadow:var(--shadow);background:#fffaf2;gap:4px;padding:6px;display:grid;position:absolute;top:calc(100% + 8px);right:0}.dropdown-menu button{min-height:36px;color:var(--ink);text-align:left;background:#fffaf2;border-radius:6px;justify-content:flex-start;align-items:center;gap:8px;padding:0 10px;font-size:13px;font-weight:700;display:inline-flex}.dropdown-menu button:hover{background:#007d7817}.help-card{z-index:50;border-radius:var(--radius);box-shadow:var(--soft-shadow);background:#fffaf2;border:1px solid #007d7833;grid-template-columns:minmax(0,1fr) 32px;align-items:center;gap:14px;margin:8px 22px 0;padding:12px 12px 12px 16px;display:grid}.help-card strong,.help-card span{display:block}.help-card strong{color:var(--ink);font-size:14px}.help-card span{color:var(--muted);margin-top:4px;font-size:13px;line-height:1.4}.help-card button{border-radius:var(--control-radius);width:32px;height:32px;color:var(--ink);background:#007d7814;place-items:center;display:grid}.ghost-button,.primary-button,.wide-button,.icon-button,.code-row button{border-radius:var(--control-radius);letter-spacing:0;white-space:nowrap;justify-content:center;align-items:center;gap:8px;min-height:34px;font-size:13px;font-weight:650;line-height:1;display:inline-flex}.ghost-button{color:var(--ink);background:0 0;padding:0 10px}.ghost-button:hover,.icon-button:hover{background:#0b728514}.primary-button{color:#fff;background:linear-gradient(#008680,#006e6a);border:1px solid #00585647;padding:0 16px;box-shadow:0 8px 18px #006d6738}.icon-button{width:34px;height:34px;color:var(--ink);background:0 0;border:1px solid #0000}.icon-button.active{color:var(--teal);background:#007d7814;border-color:#007d782e}.colorblind-toggle{border:1px solid var(--line-strong);background:#ffffff8f;border-radius:999px;grid-template-columns:auto 64px 64px;align-items:center;gap:2px;min-height:36px;margin-left:8px;padding:3px;font-size:12px;display:grid}.colorblind-toggle span{color:var(--ink);padding:0 12px 0 16px}.colorblind-toggle button{height:28px;color:var(--muted);background:0 0;border-radius:999px;font-size:12px;font-weight:680}.colorblind-toggle button.selected{color:#fff;background:linear-gradient(#008f88,#006f6a);box-shadow:0 6px 16px #006c6533}.studio-grid{z-index:1;flex:1;grid-template-columns:minmax(220px,280px) minmax(360px,1fr) minmax(320px,410px) minmax(220px,270px);gap:8px;min-width:0;min-height:0;padding:10px;display:grid;position:relative;overflow:hidden}.source-rail,.canvas-panel,.palette-panel,.audit-panel{border:1px solid var(--line);border-radius:var(--radius);min-width:0;max-width:100%;box-shadow:var(--soft-shadow);background:#fffaf2d1}.source-rail{flex-direction:column;gap:8px;padding:8px;display:flex;overflow:auto}.status-dot{background:var(--quiet);background:var(--teal);border-radius:50%;width:8px;height:8px}.source-card,.collapsed-card{border:1px solid var(--line);border-radius:var(--radius);background:#ffffffad}button.collapsed-card{color:var(--ink);text-align:left}.source-card{gap:10px;padding:10px;display:grid}.card-heading,.dish-heading,.panel-title-row>div:first-child{align-items:center;gap:8px;min-width:0;font-size:14px;font-weight:740;line-height:1;display:inline-flex}.dropzone{border-radius:var(--radius);min-height:156px;color:var(--muted);text-align:center;cursor:pointer;background:linear-gradient(135deg,#ffffffdb,#f7f1e8c2),repeating-linear-gradient(45deg,#007d780b 0 1px,#0000 1px 8px);border:1px dashed #1f1b1742;place-items:center;gap:8px;padding:16px;display:grid}.dropzone input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.dropzone strong{color:var(--ink);font-size:14px}.dropzone span{font-size:12px;line-height:1.1;display:block}.file-chip{border:1px solid var(--line);border-radius:var(--control-radius);background:#ffffffc2;grid-template-columns:58px 1fr 26px;align-items:center;gap:10px;min-width:0;padding:8px;display:grid}.file-chip strong,.file-chip span{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.file-chip strong{font-size:12px}.file-chip span{color:var(--muted);margin-top:4px;font-size:11px}.file-chip button{width:26px;height:26px;color:var(--muted);background:0 0;border-radius:6px;place-items:center;display:grid}.file-thumb{background:linear-gradient(135deg, #006d2cd1, #0b728599), var(--paper);background-position:50%;background-size:cover;border-radius:6px;width:58px;height:44px}.field-row{color:var(--ink);justify-content:space-between;align-items:center;gap:10px;font-size:13px;display:flex}.field-row output{border:1px solid var(--line);border-radius:var(--control-radius);background:#fff;place-items:center;min-width:45px;height:30px;font-size:13px;font-weight:700;display:grid}.range{width:100%;height:20px;accent-color:var(--slider-tint,var(--teal));cursor:pointer}.compact-range{--slider-tint:var(--teal)}.range-ticks{color:var(--quiet);grid-template-columns:repeat(5,1fr);font-size:11px;display:grid}.range-ticks span:nth-child(n+2){text-align:center}.range-ticks span:last-child{text-align:right}.wide-button{min-height:36px;color:var(--teal-dark);background:#007d7814;border:1px solid #007d7838;padding:0 12px}.wide-button:hover{background:#007d7824}.wide-button.subtle{border-color:var(--line);color:var(--muted);background:#ffffffb3;justify-content:space-between}.code-row{border:1px solid var(--line);border-radius:var(--control-radius);background:#fff;grid-template-columns:1fr 30px 32px;align-items:center;min-width:0;display:grid}.code-row input{border-radius:var(--control-radius);min-width:0;height:36px;color:var(--ink);background:0 0;border:0;outline:0;padding:0 10px;font-size:12px}.code-swatch{border:1px solid #0000001f;border-radius:5px;width:24px;height:24px}.code-row button{border-left:1px solid var(--line);border-radius:0 var(--control-radius) var(--control-radius) 0;width:32px;height:34px;color:var(--ink);background:0 0}.or-line{color:var(--quiet);grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;font-size:11px;display:grid}.or-line:before,.or-line:after{content:"";background:var(--line);height:1px}.collapsed-card{justify-content:space-between;align-items:center;min-height:58px;padding:0 12px;display:flex}.inline-error{color:#a5471f;margin:0;font-size:12px;line-height:1.35}.canvas-panel{grid-template-rows:auto minmax(280px,1fr) auto;gap:10px;min-height:0;padding:10px;display:grid}.preview-toolbar{align-items:center;gap:6px;width:max-content;max-width:100%;display:inline-flex}.preview-toolbar button{border:1px solid var(--line);border-radius:var(--control-radius);min-width:36px;height:34px;color:var(--ink);background:#ffffffb3;place-items:center;font-size:13px;font-weight:680;display:grid}.preview-toolbar .zoom-reset{min-width:52px}.image-preview{isolation:isolate;border-radius:var(--radius);background:#d9e9e7;border:1px solid #161c1d21;min-height:clamp(260px,35vw,520px);position:relative;overflow:hidden}.image-remove-button{z-index:8;border-radius:var(--control-radius);width:34px;height:34px;color:var(--ink);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffaf2e6;border:1px solid #161c1d29;place-items:center;display:grid;position:absolute;top:10px;right:10px;box-shadow:0 10px 24px #161c1d2e}.image-remove-button:hover{background:#fff}.image-stage{transform-origin:50%;cursor:grab;transition:transform .14s;position:absolute;inset:0}.image-stage:active{cursor:grabbing}.image-preview img{object-fit:contain;width:100%;height:100%;min-height:100%;display:block}.default-preview,.default-preview>div{position:absolute;inset:0}.default-preview{background:linear-gradient(#acd8e8d6 0 38%,#0000 40%),linear-gradient(160deg,#d49f66 0 17%,#0000 18%),linear-gradient(120deg,#0000 0 42%,#ff537bdb 43% 100%),#74b7bd}.sun-disc{background:#fffaf2e0;border-radius:50%;width:74px;height:74px;inset:9% auto auto 63%;box-shadow:0 0 0 16px #ffffff2e}.cliff-layer.one{clip-path:polygon(0 42%,23% 18%,39% 34%,53% 20%,68% 42%,68% 100%,0 100%);background:linear-gradient(130deg,#5a7b47,#c98255 52%,#ead7b1)}.cliff-layer.two{clip-path:polygon(0 59%,20% 42%,42% 60%,54% 46%,77% 68%,77% 100%,0 100%);background:repeating-linear-gradient(90deg,#fffaf24d 0 16px,#0000 16px 28px),linear-gradient(120deg,#006d2c,#e6a151 52%,#946444)}.water-layer{clip-path:polygon(38% 48%,100% 38%,100% 100%,33% 100%);background:repeating-linear-gradient(174deg,#ffffff57 0 2px,#0000 2px 16px),linear-gradient(160deg,#9fd3e8,#3ba6a6 48%,#0b7285)}.flora-layer{clip-path:polygon(58% 66%,100% 56%,100% 100%,54% 100%);background:radial-gradient(circle at 28% 54%,#ff537b 0 5px,#0000 6px),radial-gradient(circle at 52% 42%,#ff537b 0 4px,#0000 5px),radial-gradient(circle at 74% 62%,#ff537b 0 6px,#0000 7px),repeating-linear-gradient(23deg,#bd264f 0 8px,#ff537b 8px 15px,#7d1932 15px 19px)}.sample-marker{z-index:2;cursor:grab;border:3px solid #fff;border-radius:50%;width:38px;height:38px;margin:-19px 0 0 -19px;padding:0;position:absolute;box-shadow:0 0 0 1px #0000001f,0 8px 20px #0003}.sample-marker.active{box-shadow:0 0 0 2px var(--ink), 0 0 0 5px #ffffffdb, 0 12px 22px #0003}.sample-marker.seed{opacity:.94}.dish-panel{border:1px solid var(--line);border-radius:var(--radius);background:#ffffff9e;grid-template-columns:minmax(190px,220px) minmax(240px,1fr);grid-template-areas:"title title""dish result""dish picks";align-items:center;gap:10px 16px;min-height:230px;padding:12px;display:grid}.dish-heading{grid-area:title}.color-dish{cursor:crosshair;background:radial-gradient(circle,#fffaf2fa 0 48%,#0000 49%),conic-gradient(from 90deg,#ff4f68,#f2b134,#7fbf52,#00a790,#147bd1,#783bd8,#ff4f68);border-radius:50%;grid-area:dish;width:220px;height:220px;margin:0 auto;position:relative;box-shadow:inset 0 0 0 1px #0000001f,0 18px 34px #2d1d1429}.dish-diamond{clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);border:4px solid #fffffff0;border-radius:3px;width:124px;height:124px;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%);box-shadow:inset 0 0 0 1px #00000029,0 12px 28px #2d1d1424}.dish-diamond-fill{background:linear-gradient(0deg, #000000db 0%, transparent 64%), linear-gradient(90deg, #fff 0%, transparent 50%), hsl(var(--dish-hue), 92%, 58%);position:absolute;inset:0}.dish-hue-handle,.dish-sl-handle{border:3px solid #fff;border-radius:50%;width:26px;height:26px;position:absolute;box-shadow:0 6px 18px #00000047}.dish-hue-handle{top:calc(50% - 12px);left:calc(50% - 12px)}.dish-sl-handle{width:22px;height:22px;top:50%;left:50%;transform:translate(-50%,-50%)}.dish-result{border:1px solid var(--line);border-radius:var(--radius);background:#ffffffb8;grid-area:result;grid-template-columns:70px 1fr 38px;align-items:center;gap:12px;min-width:0;padding:10px;display:grid}.large-swatch{border-radius:var(--control-radius);border:1px solid #00000014;height:70px}.dish-result strong,.dish-result span{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.dish-result strong{font-size:16px}.dish-result span{color:var(--muted);margin-top:4px;font-size:11px}.your-picks{flex-wrap:wrap;grid-area:picks;align-items:center;gap:8px;min-width:0;display:flex}.your-picks>span{color:var(--muted);flex-basis:100%;font-size:12px;font-weight:680}.your-picks button{border:2px solid #ffffffeb;border-radius:50%;flex:none;width:32px;height:32px;box-shadow:0 0 0 1px #0000001f,0 6px 14px #0000001f}.your-picks button.selected-pick{box-shadow:0 0 0 2px var(--coral), 0 6px 14px #0000001f}.your-picks .add-pick{border-color:var(--line);color:var(--ink);background:#fff;border-radius:7px;place-items:center;display:grid}.palette-panel{grid-template-rows:auto minmax(0,1fr);gap:8px;min-height:0;padding:8px;display:grid}.panel-title-row{justify-content:space-between;align-items:center;gap:10px;min-height:38px;display:flex}.global-tone-control{border-radius:var(--control-radius);min-width:min(100%,260px);color:var(--ink);background:#ffffffb8;border:1px solid #007d7829;grid-template-columns:auto auto minmax(78px,130px) 44px;align-items:center;gap:7px;padding:6px 8px;font-size:12px;font-weight:720;display:grid}.global-tone-control svg{color:var(--teal)}.global-tone-control input{min-width:0;accent-color:var(--teal)}.global-tone-control output{color:var(--muted);text-align:right;font-weight:760}.palette-list{align-content:start;gap:8px;min-height:0;padding-right:2px;display:grid;overflow:auto}.color-row{border:1px solid var(--line);border-radius:var(--radius);background:#ffffffa8;transition:border-color .16s,box-shadow .16s,background .16s;overflow:hidden}.color-row.active{background:#fff;border-color:#ff537bb8;box-shadow:0 12px 28px #ff537b1f}.row-summary{grid-template-columns:24px minmax(58px,96px) minmax(72px,1fr) auto 28px 20px;align-items:center;gap:10px;min-height:62px;padding:8px 10px;display:grid}.row-index{color:var(--ink);text-align:center;font-size:15px;font-weight:700}.row-swatch{border:1px solid #0000001a;border-radius:6px;height:42px;box-shadow:inset 0 1px #ffffff47}.row-summary input{min-width:0;height:34px;color:var(--ink);background:0 0;border:1px solid #0000;border-radius:6px;outline:0;padding:0 6px;font-size:13px;font-weight:760}.row-summary input:focus{background:#fffc;border-color:#007d7857}.copy-label{color:var(--muted);align-items:center;gap:4px;font-size:12px;font-weight:650;display:inline-flex}.remove-color{width:28px;height:28px;color:var(--muted);background:0 0;border-radius:6px;place-items:center;display:grid}.remove-color:hover{color:#b8284f;background:#ff537b1a}.copy-label button{width:24px;height:24px;color:var(--ink);background:0 0;border-radius:5px;place-items:center;display:grid}.adjustment-stack{gap:7px;padding:0 10px 12px;display:grid}.slider-control{grid-template-columns:70px minmax(0,1fr) 52px 24px;align-items:center;gap:8px;min-height:28px;display:grid}.slider-control>span{color:var(--ink);font-size:12px;font-weight:650}.slider-control output{border:1px solid var(--line);min-width:48px;height:28px;color:var(--muted);background:#ffffffc2;border-radius:6px;place-items:center;font-size:12px;font-weight:700;display:grid}.slider-control button{width:24px;height:24px;color:var(--muted);background:0 0;border-radius:5px;place-items:center;display:grid}.audit-panel{align-content:start;gap:12px;padding:12px;display:grid;overflow:auto}.audit-heading{justify-content:space-between;align-items:center;gap:8px;font-size:14px;display:flex}.audit-status{border-radius:999px;justify-content:center;align-items:center;min-width:54px;height:24px;font-size:11px;font-weight:760;display:inline-flex}.audit-status.good{color:var(--green);background:#006d2c24}.audit-status.warn{color:#8c5a00;background:#f2b13433}.audit-panel p{color:var(--muted);margin:0;font-size:12px;line-height:1.35}.simulation-list{gap:14px;display:grid}.simulation-list.muted{opacity:.5}.simulation-row{gap:7px;display:grid}.simulation-row>span{color:var(--ink);font-size:12px;font-weight:650}.simulation-strip{border:1px solid var(--line);border-radius:6px;grid-auto-columns:1fr;grid-auto-flow:column;height:39px;display:grid;overflow:hidden}.distinction-card{border:1px solid var(--line);border-radius:var(--radius);background:#ffffff9e;gap:10px;padding:10px;display:grid}.distinction-title,.distinction-row{align-items:center;gap:8px;display:grid}.distinction-title{grid-template-columns:1fr auto;font-size:13px}.distinction-title span{min-width:25px;height:22px;color:var(--muted);background:#0000000f;border-radius:999px;place-items:center;font-size:11px;display:grid}.distinction-list{gap:8px;display:grid}.distinction-row{color:var(--ink);grid-template-columns:42px 18px 1fr;font-size:12px}.distinction-row svg{color:var(--teal)}.distinction-row:has(.warn-text) svg{color:#b76b00}.good-text{color:var(--muted)}.warn-text{color:#9a5c00}.audit-button{margin-top:4px}.rollback-button{color:var(--ink);background:#ffffffb8}@media (width<=1500px){.studio-grid{grid-template-columns:minmax(230px,280px) minmax(430px,1fr) minmax(340px,420px)}.audit-panel{grid-column:2/-1;grid-template-columns:minmax(260px,1fr) minmax(260px,360px);align-content:stretch}.audit-heading,.audit-panel p,.simulation-list{grid-column:1}.distinction-card{grid-area:1/2/span 3}}@media (width<=1280px){.studio-grid{grid-template-columns:minmax(220px,280px) minmax(0,1fr)}.palette-panel,.audit-panel{grid-column:1/-1}}@media (width<=1080px){.topbar{flex-direction:column;align-items:flex-start}.topbar-actions{flex-wrap:wrap;justify-content:flex-start;width:100%}.audit-panel{grid-template-columns:1fr}.distinction-card,.audit-heading,.audit-panel p,.simulation-list{grid-area:auto}}@media (width<=780px){.topbar{padding:14px}.topbar h1{font-size:23px}.colorblind-toggle{order:5;grid-template-columns:1fr 64px 64px;width:100%}.studio-grid{grid-template-columns:1fr;padding:8px}.panel-title-row{flex-direction:column;align-items:flex-start}.global-tone-control{grid-template-columns:auto auto minmax(0,1fr) 44px;width:100%}.source-rail,.canvas-panel,.palette-panel,.audit-panel{grid-column:1}.dish-panel{grid-template-columns:1fr;grid-template-areas:"title""dish""result""picks"}.color-dish{width:190px;height:190px}.row-summary{grid-template-columns:22px minmax(56px,72px) minmax(68px,1fr) 28px 18px;gap:6px}.copy-label{font-size:0}.copy-label button{width:26px}.slider-control{grid-template-columns:62px minmax(0,1fr) 46px 22px;gap:6px}.ghost-button{padding:0 8px}}@media (width<=520px){.preview-toolbar{grid-template-columns:repeat(5,minmax(0,1fr));width:100%;display:grid}.preview-toolbar button{min-width:0}.image-preview{min-height:250px}.dish-result{grid-template-columns:56px minmax(0,1fr) 34px}.large-swatch{height:56px}.color-dish{width:190px;height:190px}.dish-hue-handle{transform:none}.row-summary{grid-template-columns:20px minmax(44px,58px) minmax(54px,1fr) 24px 16px}.row-swatch{height:36px}.row-summary input{padding:0 3px;font-size:12px}.slider-control{grid-template-columns:1fr 46px 22px}.slider-control>span{grid-column:1/-1}}