:root{color:#fff;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#000;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}html,body,#root{background:#000;width:100%;height:100%;margin:0;overflow:hidden}*{box-sizing:border-box}body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent}button,input,textarea,select{font:inherit}a{color:inherit}.start-page{color:#fff;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;background:#000;justify-content:center;align-items:center;width:100dvw;min-width:100dvw;height:100dvh;min-height:100dvh;transition:opacity .26s,transform .26s;display:flex;overflow:hidden}.start-page.is-leaving{opacity:0;transform:scale(.985)}.start-page:focus{outline:none}.start-page:focus-visible{outline-offset:-8px;outline:3px solid #00d1d1}.start-page__frame{aspect-ratio:4/3;background:radial-gradient(circle,#ffffff0a,#0000 42%),#000;justify-content:center;align-items:center;width:min(100dvw,133.333dvh);height:min(100dvh,75dvw);display:flex;position:relative}.start-page__content{flex-direction:column;justify-content:center;align-items:center;gap:clamp(12px,2dvh,16px);width:100%;height:100%;display:flex;position:relative;transform:translateY(-4.4%)}.start-page__logo{object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:clamp(320px,44.3%,454px);height:auto;display:block}.start-page__text{color:#fff;letter-spacing:-.02em;margin:0;font-size:clamp(16px,1.95dvw,22px);font-weight:700;line-height:1.2}.start-page__station{color:#ffffff59;margin:0;font-size:clamp(10px,1.4dvw,18px);font-weight:600;position:absolute;bottom:clamp(12px,2dvh,28px);right:clamp(14px,2.2dvw,32px)}@supports not (width:100dvw){.start-page{width:100vw;height:100vh}.start-page__frame{width:min(100vw,133.333vh);height:min(100vh,75vw)}}.draw-page{color:#fff;background:#000;justify-content:center;align-items:center;width:100dvw;min-width:100dvw;height:100dvh;min-height:100dvh;display:flex;overflow:hidden}.draw-page,.draw-page *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.draw-page__frame{aspect-ratio:4/3;background:#050505;grid-template-rows:12% 88%;width:min(100dvw,133.333dvh);height:min(100dvh,75dvw);display:grid;position:relative;overflow:hidden}.draw-page__header{justify-content:center;align-items:center;min-width:0;min-height:0;display:flex;position:relative;overflow:hidden}.draw-page__header-left{z-index:2;align-items:center;gap:clamp(8px,1dvw,12px);display:flex;position:absolute;top:50%;left:2.2%;transform:translateY(-50%)}.draw-page__station{color:#ffffff5c;white-space:nowrap;font-size:clamp(10px,1.2dvw,16px);font-weight:700}.draw-page__sketch-button{color:#ffffffeb;white-space:nowrap;cursor:pointer;background:#ffffff14;border:1px solid #ffffff42;border-radius:999px;justify-content:center;align-items:center;gap:.35em;min-width:0;max-width:clamp(96px,13dvw,138px);padding:.52em .85em;font-size:clamp(10px,1.15dvw,14px);font-weight:800;line-height:1;display:inline-flex}.draw-page__sketch-button:active{transform:scale(.97)}.draw-page__sketch-button:focus-visible{outline-offset:3px;outline:2px solid #00d1d1}.draw-page__logo{object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;flex:none;width:clamp(72px,13.5%,140px);height:auto;max-height:86%;display:block}.draw-page__upload-button{color:#00d1d1;cursor:pointer;background:#00d1d11f;border:1px solid #00d1d180;border-radius:999px;align-items:center;gap:.4em;padding:.55em 1em;font-size:clamp(11px,1.4dvw,18px);font-weight:800;display:inline-flex;position:absolute;top:50%;right:2.2%;transform:translateY(-50%)}.draw-page__upload-button:active{transform:translateY(-50%)scale(.97)}.draw-page__body{grid-template-columns:18% 1fr 18%;gap:1.2%;min-height:0;padding:0 2% 2%;display:grid}.draw-side-panel{background:linear-gradient(#ffffff12,#ffffff06),#171717;border:1px solid #ffffff29;border-radius:14px;min-height:0;overflow:hidden;box-shadow:0 18px 40px #00000052}.color-panel{flex-direction:column;gap:clamp(8px,1.4dvh,14px);padding:clamp(10px,1.5dvw,18px);display:flex}.color-panel__section{min-height:0}.draw-panel-title{color:#ffffffeb;margin:0 0 clamp(6px,1dvh,10px);font-size:clamp(11px,1.45dvw,17px);font-weight:800}.color-grid,.recent-color-grid{grid-template-columns:repeat(3,1fr);gap:clamp(5px,.8dvw,9px);display:grid}.color-swatch{aspect-ratio:1;cursor:pointer;border:2px solid #ffffff29;border-radius:6px;width:100%;box-shadow:inset 0 0 0 1px #00000042}.color-swatch.is-selected{border-color:#fff;box-shadow:0 0 0 3px #ff2a2a,inset 0 0 0 1px #00000042}.color-swatch--small{border-radius:7px}.color-swatch--empty{box-shadow:none;cursor:default;background:linear-gradient(135deg,#ffffff0a,#ffffff03),#ffffff09;border:2px dashed #ffffff2e}.color-swatch--empty:disabled{opacity:1}.selected-color-preview{margin-top:clamp(8px,1.2dvh,12px)}.selected-color-preview__label{color:#ffffffb3;margin-bottom:5px;font-size:clamp(9px,1.05dvw,13px);font-weight:700;display:block}.selected-color-preview__box{border:2px solid #ffffff40;border-radius:8px;width:100%;height:clamp(28px,4.5dvh,48px);display:block}.selected-color-preview__button{cursor:pointer;background:0 0;border:0;width:100%;padding:0;display:block}.selected-color-preview__button:focus-visible{outline-offset:3px;border-radius:10px;outline:2px solid #00d1d1}.color-panel__sliders{border-top:1px solid #ffffff1a;flex:1;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(6px,.7dvw,10px);min-height:0;padding-top:clamp(8px,1.2dvh,12px);display:grid}.vertical-slider{grid-template-rows:auto 1fr;gap:6px;min-width:0;min-height:0;display:grid}.vertical-slider__header{flex-direction:column;align-items:center;gap:4px;display:flex}.vertical-slider__label{font-size:clamp(10px,1.15dvw,14px);font-weight:800}.vertical-slider__value{color:#ffffffe0;text-align:center;background:#ffffff14;border-radius:6px;min-width:34px;padding:4px 5px;font-size:clamp(8px,1dvw,11px);font-weight:700}.vertical-slider__control{justify-content:center;align-items:center;min-width:0;min-height:0;display:flex;overflow:hidden}.vertical-slider__input{writing-mode:vertical-lr;accent-color:#00d1d1;cursor:pointer;direction:rtl;width:28px;height:clamp(133px,17dvh,160px)}.draw-page__canvas-shell{background:#525252;border:1px solid #ffffff29;border-radius:14px;justify-content:center;align-items:center;min-width:0;min-height:0;display:flex;overflow:hidden}.drawing-canvas{isolation:isolate;touch-action:none;-webkit-user-select:none;user-select:none;background:linear-gradient(135deg,#ffffff0f,#0000 38%),#5a5a5a;width:100%;height:100%;position:relative;overflow:hidden}.drawing-canvas__sketch-guide{z-index:1;object-fit:contain;object-position:center;filter:invert();pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:100%;height:100%;position:absolute;inset:0}.drawing-canvas.is-eyedropper .drawing-canvas__stage-layer{cursor:crosshair}.drawing-canvas__stage-layer{z-index:2;touch-action:none;width:100%;height:100%;position:absolute;inset:0}.drawing-canvas__stage-layer .konvajs-content{touch-action:none;width:100%!important;height:100%!important}.drawing-canvas__stage-layer canvas{touch-action:none}.drawing-canvas__empty-message{z-index:3;color:#ffffff8c;text-align:center;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;gap:8px;display:flex;position:absolute;inset:0}.drawing-canvas__empty-message strong{letter-spacing:-.04em;font-size:clamp(20px,3dvw,42px)}.drawing-canvas__empty-message span{font-size:clamp(11px,1.5dvw,18px);font-weight:700}.drawing-canvas__sketch-status{z-index:4;color:#ffffffc7;pointer-events:none;background:#0000005c;border-radius:999px;padding:5px 9px;font-size:clamp(8px,.9dvw,12px);font-weight:700;position:absolute;top:12px;right:12px}.drawing-canvas__debug-info{z-index:4;color:#ffffff94;pointer-events:none;flex-wrap:wrap;gap:6px;font-size:clamp(8px,.9dvw,12px);font-weight:700;display:flex;position:absolute;bottom:12px;left:14px}.drawing-canvas__debug-info span{background:#00000038;border-radius:999px;padding:4px 7px}.tool-panel{padding:clamp(10px,1.5dvw,18px)}.tool-panel__grid{grid-template-columns:1fr 1fr;gap:clamp(8px,1.2dvw,14px);height:100%;min-height:0;display:grid}.tool-button{color:#fff;cursor:pointer;background:linear-gradient(#ffffff14,#ffffff06),#242424;border:1px solid #ffffff21;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:clamp(5px,.9dvh,9px);min-width:0;min-height:0;padding:6px;display:flex}.tool-button.is-active{border-color:#00d1d1;box-shadow:0 0 0 2px #00d1d16b,0 0 24px #00d1d129}.tool-button:disabled{cursor:not-allowed;opacity:.35}.tool-button__icon{font-size:clamp(24px,3.4dvw,44px);line-height:1}.tool-button__label{text-align:center;font-size:clamp(9px,1.25dvw,15px);font-weight:800;line-height:1.15}.color-picker-panel{z-index:20;background:linear-gradient(#ffffff14,#ffffff08),#151515;border:1px solid #00d1d166;border-radius:14px;width:min(260px,27%);padding:12px;position:absolute;top:17%;left:calc(21.2% + 10px);box-shadow:0 22px 48px #0000007a}.color-picker-panel__header{color:#fff;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:clamp(12px,1.2dvw,15px);display:flex}.color-picker-panel__close{color:#fff;cursor:pointer;background:#ffffff14;border:0;border-radius:999px;width:26px;height:26px;font-size:18px;line-height:1}.color-picker-panel__sv-area{aspect-ratio:1.45;cursor:crosshair;touch-action:none;border:1px solid #fff3;border-radius:10px;width:100%;position:relative;overflow:hidden}.color-picker-panel__sv-cursor{pointer-events:none;border:2px solid #fff;border-radius:999px;width:14px;height:14px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #000}.color-picker-panel__preview-row{grid-template-columns:34px 1fr;align-items:center;gap:10px;margin-top:10px;display:grid}.color-picker-panel__preview{border:2px solid #ffffffe6;border-radius:999px;width:34px;height:34px}.color-picker-panel__hue{accent-color:#f05;width:100%}.color-picker-panel__rgb-row{grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px;display:grid}.color-picker-panel__rgb-row label{color:#ffffffd1;flex-direction:column-reverse;align-items:center;gap:4px;font-size:11px;font-weight:700;display:flex}.color-picker-panel__rgb-row input{color:#000;text-align:center;background:#ffffffeb;border:1px solid #ffffff2e;border-radius:6px;width:100%;min-width:0;padding:5px 2px;font-size:12px}.color-picker-panel__apply{color:#00d1d1;cursor:pointer;background:#00d1d124;border:1px solid #00d1d18c;border-radius:999px;width:100%;margin-top:12px;padding:8px 10px;font-size:13px;font-weight:800}.sketch-picker-backdrop{z-index:40;background:#00000057;position:absolute;inset:0}.sketch-picker-panel{background:linear-gradient(#ffffff14,#ffffff06),#151515;border:1px solid #00d1d16b;border-radius:16px;width:min(360px,42%);max-height:80%;padding:clamp(12px,1.5dvw,18px);position:absolute;top:12.5%;left:2.2%;overflow-y:auto;box-shadow:0 24px 52px #0000008f}.sketch-picker-panel__header{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px;display:flex}.sketch-picker-panel__header h2{color:#fff;margin:0;font-size:clamp(16px,2dvw,22px);font-weight:900}.sketch-picker-panel__header p{color:#ffffff9e;margin:5px 0 0;font-size:clamp(10px,1.1dvw,13px);font-weight:600}.sketch-picker-panel__close{color:#fff;cursor:pointer;background:#ffffff14;border:0;border-radius:999px;flex:none;width:30px;height:30px;font-size:20px;line-height:1}.sketch-picker-panel__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(8px,1.1dvw,12px);display:grid}.sketch-option-card{color:#fff;cursor:pointer;background:#ffffff0b;border:2px solid #ffffff24;border-radius:12px;flex-direction:column;align-items:stretch;gap:7px;min-width:0;padding:8px;display:flex}.sketch-option-card.is-selected{border-color:#00d1d1;box-shadow:0 0 0 2px #00d1d147,0 0 22px #00d1d11f}.sketch-option-card__preview{aspect-ratio:12/13;background:#eee;border-radius:8px;justify-content:center;align-items:center;width:100%;display:flex;overflow:hidden}.sketch-option-card__preview img{object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:100%;height:100%;padding:7px;display:block}.sketch-option-card__empty-icon{color:#505050;font-size:clamp(28px,4dvw,44px)}.sketch-option-card__label{color:#fffffff5;text-align:left;font-size:clamp(11px,1.3dvw,15px);font-weight:900}.sketch-option-card__description{color:#ffffff8f;text-align:left;font-size:clamp(8px,.9dvw,11px);font-weight:600;line-height:1.35}.sketch-picker-panel__notice{color:#ffffff94;margin:14px 0 0;font-size:clamp(9px,1dvw,12px);font-weight:600;line-height:1.4}@supports not (width:100dvw){.draw-page{width:100vw;height:100vh}.draw-page__frame{width:min(100vw,133.333vh);height:min(100vh,75vw)}}.tool-button__icon,.tool-button__label{pointer-events:none}.tool-button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}.color-picker-panel__rgb-row input{-webkit-user-select:text;user-select:text}.input-probe-page{color:#e8eef8;background:radial-gradient(circle at 0 0,#14b8a629,#0000 34%),#070b12;height:100%;min-height:100%;padding:24px;overflow:auto}.input-probe-header{background:#0e1623f0;border:1px solid #263348;border-radius:18px;grid-template-columns:minmax(260px,1fr) minmax(420px,1.3fr);gap:24px;max-width:1500px;margin:0 auto 18px;padding:20px;display:grid}.input-probe-header h1,.input-probe-header p,.input-probe-side-panel h2{margin:0}.input-probe-header h1{margin-bottom:8px;font-size:clamp(28px,4vw,46px);line-height:1}.input-probe-header p:not(.input-probe-eyebrow){color:#a9b7cb}.input-probe-eyebrow{color:#5eead4;letter-spacing:.14em;text-transform:uppercase;font-size:12px;font-weight:800;margin-bottom:10px!important}.input-probe-controls{grid-template-columns:minmax(170px,1fr) minmax(150px,.7fr);align-content:start;gap:12px;display:grid}.input-probe-controls label{color:#a9b7cb;letter-spacing:.04em;text-transform:uppercase;gap:7px;font-size:12px;font-weight:700;display:grid}.input-probe-controls select,.input-probe-controls input,.input-probe-actions button{color:#f8fafc;background:#111b2b;border:1px solid #34445d;border-radius:10px;min-height:44px}.input-probe-controls select,.input-probe-controls input{width:100%;padding:0 12px}.input-probe-actions{grid-column:1/-1;grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.input-probe-actions button{cursor:pointer;padding:0 14px}.input-probe-actions button:nth-child(2),.input-probe-actions button:nth-child(3){color:#031311;background:#5eead4;border-color:#5eead4}.input-probe-controls output{color:#99f6e4;grid-column:1/-1;font-size:13px}.input-probe-workspace{grid-template-columns:minmax(0,1fr) minmax(300px,380px);gap:18px;max-width:1500px;margin:0 auto;display:grid}.input-probe-test-column{min-width:0}.input-probe-mode-strip{flex-wrap:wrap;gap:8px;margin-bottom:10px;display:flex}.input-probe-mode-strip span{color:#c8d5e7;background:#111b2b;border:1px solid #34445d;border-radius:999px;padding:7px 10px;font-size:12px}.input-probe-mode-strip span:first-child{color:#05201c;background:#5eead4;border-color:#5eead4;font-weight:800}.input-probe-target-shell{background-color:#f5f7fb;background-image:linear-gradient(#08111f09 1px,#0000 1px),linear-gradient(90deg,#08111f09 1px,#0000 1px),none;background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:32px 32px;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;border:3px solid #5eead4;border-radius:20px;width:100%;height:min(68vh,820px);min-height:560px;position:relative;overflow:hidden;box-shadow:0 18px 50px #00000052}.input-probe-canvas,.input-probe-target-shell .konvajs-content{width:100%;height:100%;display:block}.input-probe-target-label{z-index:10;color:#526176;pointer-events:none;background:#ffffffdb;border-radius:999px;padding:8px 13px;font-size:12px;font-weight:700;position:absolute;top:16px;left:50%;transform:translate(-50%)}.input-probe-side-panel{align-content:start;gap:14px;max-height:calc(100vh - 190px);display:grid;overflow:auto}.input-probe-side-panel section{background:#0e1623;border:1px solid #263348;border-radius:14px;padding:16px}.input-probe-side-panel h2{color:#f8fafc;margin-bottom:12px;font-size:15px}.input-probe-side-panel dl{gap:7px;margin:0;display:grid}.input-probe-side-panel dl div{border-bottom:1px solid #1f2a3b;grid-template-columns:minmax(130px,1fr) minmax(90px,auto);gap:12px;padding-bottom:7px;display:grid}.input-probe-side-panel dt{color:#8190a6}.input-probe-side-panel dd{color:#dbe7f7;text-align:right;overflow-wrap:anywhere;margin:0}.input-probe-live-hud pre,.input-probe-results pre{color:#b9f7ec;white-space:pre-wrap;overflow-wrap:anywhere;max-height:420px;margin:0;font:11px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace;overflow:auto}@media (width<=980px){.input-probe-page{padding:14px}.input-probe-header,.input-probe-workspace{grid-template-columns:1fr}.input-probe-side-panel{max-height:none;overflow:visible}.input-probe-target-shell{height:62vh;min-height:500px}}@media (width<=600px){.input-probe-controls,.input-probe-actions{grid-template-columns:1fr}.input-probe-target-shell{height:58vh;min-height:420px}}