: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:#000;grid-template-rows:14.7% 85.3%;width:min(100dvw,133.333dvh);height:min(100dvh,75dvw);display:grid;position:relative;overflow:hidden}.draw-page__left-column,.draw-page__right-column{min-width:0;min-height:0;display:grid}.draw-page__left-column{grid-template-rows:67.2% 31.8%;row-gap:1%}.draw-page__right-column{grid-template-rows:31.8% 67.2%;row-gap:1%}.draw-page__header{min-width:0;min-height:0;position:relative;overflow:hidden}.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;width:auto;height:74%;position:absolute;bottom:7%;left:50%;transform:translate(-50%)}.draw-page__upload-button{color:#2eeff0;cursor:pointer;background:#027c7d38;border:1px solid #027c7d;border-radius:999px;justify-content:center;align-items:center;gap:4px;width:11.14%;height:31.9%;padding:0;font-size:clamp(12px,1.45dvw,16px);font-weight:800;display:inline-flex;position:absolute;bottom:6.2%;right:3%}.draw-page__upload-button:active{transform:scale(.97)}.draw-page__body{grid-template-columns:11.85% minmax(0,1fr) 11.85%;column-gap:1.1%;min-width:0;min-height:0;padding:0 3% 3.8%;display:grid}.draw-side-panel{min-width:0;min-height:0;box-shadow:none;background:linear-gradient(#1c1c1c 0%,#000 100%);border:1px solid #ffffff38;border-radius:14px;overflow:hidden}.color-panel{padding:7px;display:block}.color-panel__section{min-height:0}.color-panel__section+.color-panel__section{margin-top:18px}.draw-panel-title{color:#fffffff2;text-align:center;width:100%;margin:0 0 6px;font-size:12px;font-weight:700;line-height:1.2}.color-grid,.recent-color-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;display:grid}.color-swatch{aspect-ratio:1;cursor:pointer;border:1px solid #ffffff47;border-radius:5px;width:100%;box-shadow:inset 0 0 0 1px #00000059}.color-swatch.is-selected{border-color:#fff;box-shadow:0 0 0 1px #fffc,inset 0 0 0 1px #00000059}.color-swatch--small{border-radius:7px}.color-swatch--empty{box-shadow:none;background:#ffffff29;border:1px dashed #ffffff52}.color-swatch--empty:disabled{opacity:1}.brush-settings-panel{padding:10px 7px 8px}.brush-settings-panel__sliders{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:8px;height:calc(100% - 22px);display:grid}.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{aspect-ratio:100/38;border:2px solid #ffffffe6;border-radius:5px;width:100%;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}.vertical-slider{grid-template-rows:minmax(0,1fr) auto;justify-items:center;gap:4px;min-width:0;min-height:0;display:grid}.vertical-slider__caption{color:#fff;font-size:9px;font-weight:700;line-height:1}.vertical-slider__control{justify-content:center;align-items:center;min-width:0;min-height:0;display:flex}.vertical-slider__input{writing-mode:vertical-lr;accent-color:#027c7d;cursor:pointer;direction:rtl;width:20px;height:124px}.draw-page__canvas-shell{background:#818181;border:1px solid #ffffff29;border-radius:14px;min-width:0;min-height:0;overflow:hidden}.drawing-canvas{isolation:isolate;touch-action:none;-webkit-user-select:none;user-select:none;background:#818181;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:12px 7px 7px}.tool-panel .draw-panel-title{margin-bottom:10px}.tool-panel__grid{grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:7px;display:grid}.tool-button{aspect-ratio:46/63;color:#fff;cursor:pointer;background:linear-gradient(#ffffff14,#ffffff05),#202020;border:1px solid #ffffff29;border-radius:9px;justify-content:center;align-items:center;width:100%;min-width:0;padding:4px;display:flex}.tool-button.is-active{border-color:#027c7d;box-shadow:0 0 0 2px #027c7d6b}.tool-button:disabled{cursor:not-allowed;opacity:.35}.tool-button__icon{pointer-events:none;-webkit-user-select:none;user-select:none;font-size:clamp(18px,2.3dvw,26px);line-height:1}.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(15.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-control-panel{padding:10px 7px}.sketch-select-button{color:#ffffffeb;cursor:pointer;background:#ffffff14;border:1px solid #ffffff40;border-radius:999px;justify-content:center;align-items:center;gap:4px;width:100%;min-width:0;padding:8px 7px;font-size:10px;font-weight:800;line-height:1;display:inline-flex}.sketch-select-button__label{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.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:14.7%;left:3%;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)}}