@font-face{font-family:DrawingKorean;src:url('/assets/fonts/hion-korean.woff2') format('woff2');font-display:swap;font-weight:100 900}
:root{--ed-ink:#35516c;--ed-muted:#73899f;--ed-accent:#579bcf;--ed-border:#d7e6f1;--ed-paper:#fafdff;--ed-shadow:0 8px 30px #476c9020}
.drawing-editor-active{margin:0!important;overflow:hidden!important;background:#e7eff5!important}
.drawing-editor-active #app{min-height:0;height:100dvh;padding:0;margin:0;max-width:none}
.drawing-editor{font-family:DrawingKorean,sans-serif;color:var(--ed-ink);height:100dvh;width:100%;display:grid;grid-template-columns:76px minmax(0,1fr) 126px;grid-template-rows:68px minmax(0,1fr) auto 28px;isolation:isolate;background:radial-gradient(ellipse at 45% 10%,#fcfdff 0,#e7eff5 65%);position:relative;box-sizing:border-box}
.drawing-editor *{box-sizing:border-box}
.drawing-editor button,.drawing-editor input{font:inherit}
.drawing-editor button,.drawing-editor a{-webkit-tap-highlight-color:transparent}
.drawing-editor button{cursor:pointer}
.drawing-editor button:disabled{cursor:not-allowed;opacity:.4}
.drawing-editor :focus-visible{outline:3px solid #579bcf;outline-offset:3px}
.drawing-editor [hidden]{display:none!important}
.ed-header{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;padding:8px 20px;background:#ffffffc9;border-bottom:1px solid var(--ed-border);gap:12px;z-index:5}
.ed-exit{display:flex;align-items:center;gap:9px;width:max-content;min-height:44px;text-decoration:none;color:var(--ed-ink);font-size:14px;font-weight:750}
.ed-exit svg,.ed-header svg,.ed-fit svg{width:22px;height:22px;flex:none}
.ed-time{display:flex;flex-direction:column;align-items:center;min-width:104px}
.ed-time>span{font-size:9px;font-weight:800;letter-spacing:.12em;color:var(--ed-muted)}
.ed-time strong{font-size:25px;line-height:1.25;font-variant-numeric:tabular-nums;letter-spacing:.04em}
.ed-time .is-urgent{color:#bb5167}
.ed-header-actions{display:flex;justify-content:flex-end;gap:7px;align-items:center;min-width:0;flex-wrap:wrap}.ed-header-actions>button{flex-shrink:0;white-space:nowrap}
.ed-header-actions .ed-button span{display:none}
.ed-button{background:transparent;border:1px solid transparent;color:var(--ed-muted);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border-radius:13px;min-width:46px;min-height:46px;padding:7px;transition:background .15s,color .15s}
.ed-button svg{width:25px;height:25px;flex:none}
.ed-button span{font-size:9px;font-weight:700;white-space:nowrap}
.ed-button:hover{background:#e7f2fa;color:var(--ed-ink)}
.ed-button[aria-pressed=true]{background:#d7ebfa;border-color:#b7d7ed;color:#327bae;box-shadow:inset 0 1px 0 white}
.ed-finish,.ed-primary-link{background:#5a9dd0;color:white;border:1px solid #4d91c4;border-radius:12px;padding:10px 16px;min-height:44px;font-weight:750;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:13px}
.ed-insert{grid-column:1;grid-row:2;display:flex;flex-direction:column;gap:9px;align-items:center;padding:20px 7px;z-index:3}
.ed-insert .ed-button{width:60px;min-height:56px;background:#ffffff91;border:1px solid #dce9f2}
.ed-stage{position:relative;grid-column:2;grid-row:2;overflow:hidden;touch-action:none;min-height:0;min-width:0}
.ed-artboard{position:absolute;left:50%;top:50%;transform-origin:center;background:white;box-shadow:0 2px 3px #415e7612,0 12px 55px #415e7622;touch-action:none}
.ed-artboard canvas{width:100%;height:100%;display:block;touch-action:none}
.drawing-editor[data-editable=true] .ed-artboard canvas{cursor:crosshair}
.ed-selection{position:absolute;border:1.5px solid #399be0;pointer-events:none;transform-origin:center}
.ed-selection button{pointer-events:auto;position:absolute;touch-action:none;background:white;border:2px solid #399be0;box-shadow:0 2px 6px #29597d30;transform:scale(var(--handle-scale,1));border-radius:50%;width:26px;height:26px;color:#2b89c9;font-size:18px;display:grid;place-items:center;padding:0}
.ed-rotate{left:calc(50% - 13px);top:-36px}.ed-resize{right:-13px;bottom:-13px}
.ed-fit{position:absolute;right:14px;bottom:14px;display:flex;align-items:center;gap:7px;border:1px solid var(--ed-border);border-radius:12px;background:#ffffffea;color:var(--ed-muted);padding:9px;font-size:11px;z-index:2;min-height:40px}
.ed-empty{position:absolute;z-index:4;top:50%;left:50%;transform:translate(-50%,-50%);width:min(420px,90%);background:#ffffffed;border:1px solid var(--ed-border);border-radius:22px;box-shadow:var(--ed-shadow);text-align:center;padding:25px}
.ed-empty h1{font-size:19px}.ed-empty p{font-size:13px;line-height:1.7}
.ed-settings{grid-column:3;grid-row:2;align-self:center;margin:12px 12px 12px 0;background:#ffffffc9;border:1px solid var(--ed-border);border-radius:20px;padding:20px 12px;display:flex;flex-direction:column;gap:25px;z-index:4;box-shadow:var(--ed-shadow)}
.ed-settings label{font-size:11px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:9px;font-weight:700}
.ed-settings output{font-variant-numeric:tabular-nums;color:var(--ed-accent)}
.ed-settings input{width:100%;accent-color:var(--ed-accent);margin:0;min-height:30px}
.ed-settings p{font-size:9px;line-height:1.7;color:var(--ed-muted);margin:0}
.ed-footer{grid-column:1/-1;grid-row:3;justify-self:center;display:flex;align-items:center;gap:16px;padding:9px 15px;background:#ffffffdc;border:1px solid var(--ed-border);border-radius:21px;box-shadow:var(--ed-shadow);max-width:calc(100% - 30px);margin:10px 15px;z-index:5}
.ed-tools{display:flex;gap:4px;align-items:center}
.ed-tools .ed-button{min-width:56px;min-height:57px}
.ed-tools [data-ed-action=settings]{display:none}
.ed-colors{display:grid;grid-template-columns:repeat(5,24px);gap:6px;align-items:center;border-left:1px solid var(--ed-border);padding-left:17px}
.ed-swatch{width:24px;height:24px;border-radius:50%;border:1px solid #50708930;background:var(--swatch);box-shadow:inset 0 0 0 2px #ffffffa0;padding:0}
.ed-custom-color{grid-column:5;grid-row:1/3;display:block;width:31px;height:48px}
.ed-custom-color input{width:100%;height:100%;background:transparent;border:1px solid var(--ed-border);border-radius:10px;padding:3px;cursor:pointer}
.ed-statusbar{grid-column:1/-1;grid-row:4;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 18px;font-size:10px;color:var(--ed-muted);min-width:0}
.ed-statusbar span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ed-statusbar span:last-child{white-space:nowrap}
.ed-panel{position:absolute;z-index:8;left:90px;top:88px;width:290px;max-width:calc(100vw - 32px);background:#fffffff5;border:1px solid var(--ed-border);border-radius:19px;box-shadow:var(--ed-shadow);padding:18px}
.ed-panel-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;font-size:14px}
.ed-panel-heading button{background:#edf5fc;border:0;border-radius:9px;width:34px;height:34px;font-size:23px;color:var(--ed-muted)}
.ed-text-label{font-size:12px;display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.ed-text-label input[type=text]{min-height:44px;border:1px solid var(--ed-border);border-radius:10px;padding:10px;min-width:0;background:white;color:var(--ed-ink)}
.ed-text-label input[type=color]{width:100%;height:44px;padding:3px;border:1px solid var(--ed-border);border-radius:10px;background:white}
.ed-panel p{font-size:12px;line-height:1.6}
.ed-object-options{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.ed-object-options>button{border:1px solid var(--ed-border);background:#f1f7fc;border-radius:12px;min-height:88px;color:var(--ed-ink);font-size:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:8px}
.ed-object-options>button canvas{display:block;width:56px;height:56px;pointer-events:none}
.ed-object-options>button span{line-height:1.3;pointer-events:none}
.ed-object-options>button:hover{background:#e3f0fa;border-color:#a6cce6}
.ed-shape-fill{grid-column:1/-1;display:flex;gap:10px;align-items:center;font-size:12px;min-height:38px}
@media(max-width:900px){
  .drawing-editor{grid-template-columns:56px minmax(0,1fr);grid-template-rows:minmax(62px,auto) minmax(0,1fr) auto 25px}
  .ed-header{padding:5px 10px;gap:5px}.ed-header-actions{gap:1px}.ed-header-actions .ed-button{min-width:36px;min-height:42px;padding:6px}.ed-header-actions .ed-button svg{width:20px;height:20px}.ed-finish{padding:8px 10px}.ed-finish svg{display:none}.ed-time{min-width:76px}.ed-time strong{font-size:22px}.ed-time>span{font-size:8px}.ed-exit span{display:none}
  .ed-insert{padding:12px 4px;gap:8px}.ed-insert .ed-button{width:46px;min-height:48px;padding:5px}.ed-insert .ed-button svg{width:21px;height:21px}.ed-insert .ed-button span{font-size:8px}
  .ed-settings{display:none;position:absolute;right:8px;top:75px;width:220px;margin:0;z-index:9;padding:18px}.ed-settings.is-open{display:flex}.ed-settings input{min-height:40px}.ed-settings p{font-size:11px}
  .ed-footer{max-width:calc(100% - 12px);margin:6px;gap:8px;padding:7px;border-radius:17px}.ed-tools{gap:1px}.ed-tools .ed-button{min-width:43px;min-height:48px;padding:5px}.ed-tools .ed-button span{font-size:8px}.ed-tools .ed-button svg{width:22px;height:22px}.ed-tools [data-ed-action=settings]{display:flex}
  .ed-colors{grid-template-columns:repeat(5,22px);gap:4px;padding-left:10px}.ed-swatch{width:22px;height:22px}.ed-custom-color{width:24px;height:46px}
  .ed-statusbar{padding:0 10px;font-size:9px}.ed-statusbar span:last-child{display:none}.ed-panel{left:65px;top:75px}
}
@media(max-width:600px){
  .drawing-editor{grid-template-columns:1fr;grid-template-rows:minmax(58px,auto) 53px minmax(0,1fr) auto 24px;padding-bottom:env(safe-area-inset-bottom,0px)}
  .ed-header{grid-row:1;padding-top:env(safe-area-inset-top,0px)}.ed-header-actions [data-ed-action=download]{display:none}
  .ed-insert{grid-column:1;grid-row:2;flex-direction:row;justify-content:center;gap:9px;padding:3px 7px}.ed-insert .ed-button{width:45px;min-height:44px;border:0;background:transparent}.ed-insert .ed-button span{font-size:8px}
  .ed-stage{grid-column:1;grid-row:3}.ed-footer{grid-row:4;width:calc(100% - 16px);max-width:none;flex-direction:column;gap:5px;padding:6px 8px;margin:5px 8px}.ed-tools{width:100%;justify-content:space-between}.ed-tools .ed-button{min-width:0;flex:1;min-height:48px;padding:3px}.ed-tools .ed-button span{font-size:7px}.ed-tools .ed-button svg{width:21px;height:21px}
  .ed-colors{display:flex;border-left:0;border-top:1px solid var(--ed-border);padding:5px 0 0;width:100%;justify-content:space-between;gap:3px}.ed-swatch{width:28px;height:28px;min-height:28px}.ed-custom-color{width:36px;height:33px}.ed-statusbar{grid-row:5}
  .ed-panel{top:auto;left:10px;bottom:150px;width:calc(100% - 20px);max-height:50dvh;overflow:auto}.ed-settings{top:auto;bottom:150px;left:10px;right:10px;width:auto}.ed-settings p{display:none}
  .ed-fit{right:7px;bottom:6px;padding:6px;min-height:34px;font-size:10px}.ed-fit svg{width:18px;height:18px}.ed-empty{padding:18px}.ed-empty h1{font-size:16px}
}
@media(max-height:550px) and (min-width:601px){.drawing-editor{grid-template-rows:52px minmax(0,1fr) auto 18px}.ed-insert{display:grid;grid-template-columns:1fr;gap:1px;padding:3px}.ed-insert .ed-button{min-height:30px}.ed-insert .ed-button span{display:none}.ed-footer{margin:3px;padding:4px}.ed-tools .ed-button{min-height:36px}.ed-tools .ed-button span{display:none}.ed-settings{top:58px}.ed-panel{top:58px;max-height:calc(100dvh - 140px);overflow:auto}}
@media(prefers-reduced-motion:reduce){.ed-button{transition:none}}
.ed-finish-ai{background:#e2f1fc;color:#347eae;border-color:#b9d9ee;white-space:nowrap}
.ed-finish-ai:hover{background:#cfe8fa}
.ed-ai-wait{position:absolute;inset:0;z-index:30;display:grid;place-items:center;padding:20px;background:#e7eff5c9;backdrop-filter:blur(5px)}
.ed-ai-wait-card{display:flex;flex-direction:column;align-items:center;gap:18px;max-width:380px;padding:32px 26px;border:1px solid var(--ed-border);border-radius:24px;background:var(--ed-paper);box-shadow:var(--ed-shadow);text-align:center}
.ed-ai-wait-card strong{font-size:18px}.ed-ai-wait-card p{margin:0;font-size:13px;line-height:1.8;color:var(--ed-muted)}
.ed-ai-spinner{width:40px;height:40px;border:3px solid var(--ed-border);border-top-color:var(--ed-accent);border-radius:50%;animation:ed-ai-spin 1s linear infinite}
@media(prefers-reduced-motion:no-preference){
  .ed-ai-wait:not([hidden]){animation:ed-ai-arrive 350ms ease-out}
  .ed-ai-wait:not([hidden]) .ed-ai-wait-card{animation:ed-ai-card-arrive 450ms ease-out}
  .ed-ai-wait:not([hidden]) .ed-ai-spinner{animation:ed-ai-spin 1.2s linear infinite,ed-ai-breathe 2.4s ease-in-out infinite}
}
@keyframes ed-ai-arrive{from{opacity:0}to{opacity:1}}
@keyframes ed-ai-card-arrive{from{opacity:0;translate:0 10px;scale:.97}to{opacity:1;translate:0 0;scale:1}}
@keyframes ed-ai-breathe{0%,100%{box-shadow:0 0 0 0 #74baff00}50%{box-shadow:0 0 0 9px #74baff25}}
@keyframes ed-ai-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.ed-ai-spinner{animation:none;border-top-width:6px}}
.ed-ai-context{position:absolute;inset:0;z-index:31;display:grid;place-items:center;overflow:auto;padding:18px;background:#e7eff5d6;backdrop-filter:blur(5px)}
.ed-ai-context-card{width:min(460px,100%);max-height:100%;overflow:auto;display:flex;flex-direction:column;gap:12px;padding:26px;border:1px solid var(--ed-border);border-radius:24px;background:var(--ed-paper);box-shadow:var(--ed-shadow)}
.ed-ai-context-card h2{margin:0;font-size:20px}.ed-ai-context-card p{margin:0 0 5px;font-size:13px;line-height:1.8;color:var(--ed-muted)}
.ed-ai-context-card label{font-size:13px;font-weight:750}.ed-ai-context-card label span{color:var(--ed-muted);font-weight:400}
.ed-ai-context-card textarea{width:100%;min-height:110px;resize:vertical;border:1px solid var(--ed-border);border-radius:12px;padding:12px;background:white;color:var(--ed-ink);font:inherit;font-size:16px;line-height:1.6}
.ed-ai-context-count{align-self:flex-end;font-size:11px;color:var(--ed-muted)}
.ed-ai-context-actions{display:flex;justify-content:flex-end;gap:9px}.ed-ai-context-actions button{min-height:44px;min-width:78px}
.ed-ai-context-cancel{padding:10px 16px;border:1px solid var(--ed-border);border-radius:12px;background:#edf5fc;color:var(--ed-ink);font-weight:700}
@media(max-width:600px){
  .ed-header{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:3px}
  .ed-header-actions{gap:2px}.ed-header-actions .ed-button{min-width:30px;padding:4px}
  .ed-finish{font-size:11px;padding:8px 7px;gap:3px}.ed-time{min-width:55px}
}
