.online-editor[hidden],.online-empty[hidden],.online-template[hidden]{display:none!important}.online-page{max-width:1160px;margin:auto}.online-page h1{font-size:clamp(25px,4vw,38px);margin:12px 0}.online-status{line-height:1.65;color:#526653}.online-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:20px 0}.online-toolbar a{margin-right:auto}.online-button{font:inherit;font-weight:700;line-height:1.4;padding:11px 16px;border:1px solid #3d6b5c;border-radius:12px;color:white;background:#3d6b5c;cursor:pointer;min-height:44px;text-decoration:none;text-align:center}.online-button:disabled{background:#e5e7e5;color:#69706a;border-color:#cbd0cb;cursor:not-allowed}.online-button--outline{background:#fff;color:#315841}.online-workspace{display:grid;grid-template-columns:190px minmax(0,1fr);gap:20px;align-items:start}.online-tools{background:#f5f3ed;border:1px solid #dbe1d5;border-radius:16px;padding:16px;min-width:0}.online-tools h2{font-size:17px;margin:0 0 12px}.online-palette{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:16px}.online-swatch{width:100%;aspect-ratio:1;border:1px solid #87948b;border-radius:50%;background:var(--swatch);padding:0;cursor:pointer;min-width:28px;min-height:28px}.online-swatch[aria-pressed=true]{outline:3px solid #294f3d;outline-offset:2px;box-shadow:inset 0 0 0 3px #fff}.online-tool-buttons{display:grid;gap:8px;margin:16px 0}.online-tool[aria-pressed=true]{background:#3d6b5c;color:#fff}.online-tools label{display:block;font-size:14px;font-weight:700;margin:12px 0 7px}.online-tools input[type=color]{width:100%;height:44px;cursor:pointer}.online-tools input[type=range]{width:100%;accent-color:#3d6b5c}.online-tools .online-button{width:100%;font-size:14px}.online-hint{font-size:13px;line-height:1.6;margin-top:16px;color:#526653}.online-paper-wrap{min-width:0;padding:12px;background:#e8e8df;border:1px solid #d5dccc;border-radius:16px}.online-paper{position:relative;width:100%;max-width:800px;margin:auto;background:white;box-shadow:0 2px 9px #24362820;touch-action:none;cursor:crosshair}.online-paper canvas{display:block;width:100%;height:100%;position:absolute;inset:0;border-radius:0}.online-paper .online-lines{pointer-events:none;mix-blend-mode:multiply}.online-paper:focus-visible,.online-button:focus-visible,.online-swatch:focus-visible{outline:3px solid #91a66c;outline-offset:4px}.online-print-image{display:none}.online-template{padding:14px;border-left:4px solid #3d6b5c;background:#eef2e8;border-radius:8px;line-height:1.6}
.online-options-toggle{display:none}.online-color-row{min-width:0}
@media(max-width:700px){
.online-page{padding:12px 8px}.online-page>.content-card{padding:12px}.online-page .eyebrow{display:none}.online-page h1{font-size:20px;margin:4px 0 6px;line-height:1.3}.online-status{font-size:12px;line-height:1.4;margin:6px 0}.online-toolbar{gap:6px;margin:10px 0;scroll-margin-top:calc(var(--online-header-height,80px) + 8px)}.online-toolbar .online-button{padding:8px;font-size:12px;min-height:44px}.online-toolbar a{min-width:0;flex:1}.online-workspace{grid-template-columns:minmax(0,1fr);gap:10px}.online-tools{position:sticky;top:calc(var(--online-header-height,80px) + 4px);z-index:5;display:block;padding:8px;border-radius:12px;box-shadow:0 3px 10px #24362815}.online-tools h2,.online-custom-wrap label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.online-color-row{display:flex;gap:8px;align-items:center}.online-palette{display:flex;flex:1;min-width:0;overflow-x:auto;gap:7px;margin:0;padding:5px 4px;scrollbar-width:thin;overscroll-behavior-x:contain}.online-swatch{flex:0 0 36px;width:36px;height:36px;min-width:36px;min-height:36px;max-width:none}.online-custom-wrap{flex:0 0 44px;border-left:1px solid #d5dccc;padding-left:6px}.online-tools input[type=color]{width:38px;height:44px;padding:2px;border:1px solid #87948b;border-radius:8px;background:white}.online-main-tools{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;margin:6px 0 0}.online-main-tools .online-button{font-size:11px;padding:6px 1px;min-height:44px;border-radius:8px;white-space:nowrap}.online-options-toggle{display:block}.online-options{display:none;max-height:35svh;overflow-y:auto;padding:4px}.online-options-open .online-options{display:block}.online-options-toggle[aria-expanded=true]{background:#3d6b5c;color:white}.online-tools .online-options label{margin:8px 0 3px}.online-options input[type=range]{min-height:32px}.online-hint{font-size:12px;line-height:1.4;margin:8px 0 0}.online-paper-wrap{padding:6px}.online-paper{width:min(100%,calc(max(200px,100svh - 300px)*var(--online-ratio,.773)));height:auto}.online-template{font-size:12px;padding:8px;margin:6px 0}
}
@media (min-width:701px) and (max-width:1000px) and (max-height:500px){.online-workspace{grid-template-columns:190px minmax(0,1fr);scroll-margin-top:calc(var(--online-header-height,80px) + 8px)}.online-tools{max-height:calc(100svh - var(--online-header-height,80px) - 24px);overflow-y:auto}.online-paper{width:min(100%,calc((100svh - var(--online-header-height,80px) - 38px)*var(--online-ratio,.773)));height:auto}.online-tools .online-options{display:block}}
@media print{@page{size:A4;margin:.5in}body.online-printing>*{display:none!important}body.online-printing>.online-print-image{display:block!important;width:100%;height:calc(297mm - 1in);object-fit:contain;print-color-adjust:exact;-webkit-print-color-adjust:exact}html,body.online-printing{margin:0!important;padding:0!important;background:#fff!important}}
