html,body{box-sizing:border-box;display:flex;flex-direction:column;margin:0;padding:0;width:100vw;height:100vh;overflow:hidden;-webkit-user-select:none;user-select:none;opacity:1;transition:opacity .3s ease}body.loading{opacity:1}#ggbTitleBar{display:flex;justify-content:space-between;height:4.5vh;font-size:max(1.3vw,1.3vh);font-weight:700;color:#2253bd;background-color:#ddd;border-bottom:1px solid #ccc;box-shadow:0 3px 8px #aaa;text-shadow:1px 1px white;z-index:1001}#ggbTitleBar #ggbTitle{flex:1;line-height:4.5vh;padding-left:1vw}#ggbTitleBar .titleBarHelp{flex:0 0 auto;display:flex;justify-content:center;align-items:center;height:100%;padding:0 1vw}.titleBarHelp .icon{display:block;width:1.5vw;height:1.5vw;cursor:pointer}.helpDocContent{font-size:clamp(14px,2.5vw,20px);line-height:clamp(1.4,1.6,1.8);word-wrap:break-word;overflow-wrap:break-word}.helpDocContent span{font-size:clamp(12px,2vw,16px);color:orange;background-color:#3b4106;border-radius:clamp(3px,.8vw,8px);padding:clamp(2px,.5vw,6px) clamp(4px,1vw,8px);display:inline-block;margin:clamp(1px,.2vw,3px)}@media (max-width: 768px){.helpDocContent{font-size:clamp(16px,4vw,22px);padding:clamp(.5rem,2vw,1rem)}.helpDocContent span{font-size:clamp(14px,3.5vw,18px);padding:clamp(4px,1vw,8px) clamp(6px,1.5vw,10px)}}@media (max-width: 480px){.helpDocContent{font-size:clamp(14px,5vw,20px);padding:clamp(.8rem,3vw,1.2rem)}.helpDocContent span{font-size:clamp(12px,4vw,16px);padding:clamp(3px,1.2vw,6px) clamp(5px,2vw,8px);border-radius:clamp(3px,1vw,6px)}}.toolbar-tooltip{position:fixed;bottom:20px;left:20px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:clamp(8px,1.5vw,12px) clamp(12px,2.5vw,18px);border-radius:clamp(6px,1.2vw,10px);font-size:clamp(12px,2vw,16px);font-weight:500;box-shadow:0 clamp(4px,1vw,8px) clamp(15px,3vw,25px) #0003;z-index:10001;opacity:0;transform:translateY(10px);transition:all .3s cubic-bezier(.4,0,.2,1);pointer-events:none;max-width:clamp(200px,40vw,300px);word-wrap:break-word;border:1px solid rgba(255,255,255,.2)}.toolbar-tooltip.show{opacity:1;transform:translateY(0)}.toolbar-tooltip:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#ffffff4d,#ffffff1a,#ffffff4d);border-radius:10px 10px 0 0}@media (max-width: 768px){.toolbar-tooltip{bottom:15px;left:15px;font-size:clamp(11px,3vw,14px);padding:clamp(6px,2vw,10px) clamp(10px,3vw,15px)}}@media (max-width: 480px){.toolbar-tooltip{bottom:10px;left:10px;font-size:clamp(10px,3.5vw,13px);padding:clamp(5px,2.5vw,8px) clamp(8px,3.5vw,12px);max-width:clamp(150px,50vw,250px)}}#ggbTitleBar #systemTime{text-align:right;flex:.2;color:#000;line-height:4.5vh;padding-right:1vw;font-size:.8vw}#app123{flex:1;box-sizing:border-box;width:100%;position:relative}#ggbContainer{margin:0 auto;width:100%}.page-render-host{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.page-render-host--html,.page-render-host--url{z-index:1}.html-page-frame{width:100%;height:100%;border:0;background:#fff}.url-page-error{box-sizing:border-box;width:min(560px,calc(100% - 32px));margin:12vh auto 0;padding:24px;color:#1f2937;background:#fff;border:1px solid #d7dde8;border-radius:8px;box-shadow:0 8px 24px #0f172a1f;text-align:center}.url-page-error h2{margin:0 0 12px;font-size:22px;font-weight:700}.url-page-error p{margin:0 0 16px;line-height:1.6}.url-page-error__url{margin-bottom:18px;padding:8px 10px;overflow-wrap:anywhere;color:#4b5563;background:#f3f6fb;border-radius:6px;font-size:13px}.url-page-error__button{min-width:128px;height:36px;padding:0 16px;color:#fff;background:#1677ff;border:0;border-radius:6px;cursor:pointer}.url-page-error__button:hover{background:#4096ff}#toolbar{position:absolute;display:flex;gap:.5vw;align-items:center;background-color:#fff;border-radius:.5vw;border:1px solid #ccc;box-shadow:0 0 1vw #0000004d;padding:.5vw;z-index:1000}.horizontal{flex-direction:row;padding:.3vw .6vw}.vertical{flex-direction:column;padding:.4vw}#toolbar{gap:.3vw}#toolbar.horizontal{flex-direction:row}#toolbar.vertical{flex-direction:column}#dragArea{width:clamp(24px,2.5vw,40px);height:clamp(24px,2.5vw,40px);cursor:move;display:flex;justify-content:center;align-items:center;order:-1}#pages{width:clamp(24px,2.5vw,40px);height:clamp(24px,2.5vw,40px);display:flex;justify-content:center;align-items:center;cursor:pointer;border-radius:20%;background-color:#aaa}#pages>span{display:inline-block;padding:.5vw;color:#fff;font-size:clamp(12px,1vw,16px);font-weight:700}#toolbar button{width:clamp(28px,3vw,48px);height:clamp(28px,3vw,48px);margin:0;outline:none;display:flex;justify-content:center;align-items:center;cursor:pointer;border:none;background:transparent}#toolbar button svg{width:clamp(16px,2vw,32px);height:clamp(16px,2vw,32px)}#toolbar button:not([disabled]):active{border-radius:5px;background-color:#2e2f74}#toolbar button:not([disabled]):active svg path{stroke:#fff}#toolbar button.active{border-radius:5px;background-color:#485}#toolbar button.active svg path,#toolbar button.active svg circle,#toolbar button.active svg line,#toolbar button.active svg polyline{stroke:#fff}#toolbar button[disabled]{cursor:not-allowed}#toolbar button[disabled] svg path{stroke:#ccc}#toolbar button svg{width:80%;height:80%}.checkbox-container{width:max(1vw,16px);height:max(1vw,16px);border-radius:50%;border:max(.1vw,2px) solid #bdb6b6;display:inline-flex;align-items:center;justify-content:center;transition:background-color .3s;background-color:#fff;cursor:pointer}.checkbox-container input[type=checkbox]{display:none}.checkbox-container input[type=checkbox]:checked+.checkmark{background-color:#3dd838}.checkmark{display:block;width:100%;height:100%;border-radius:50%}.popup-menu{position:fixed;background:#fff;border:1px solid #ddd;border-radius:4px;box-shadow:0 2px 8px #00000026;display:none;min-width:12vw;max-width:20vw;max-height:80vh;overflow-y:auto;font-size:.9vw;z-index:2000}.popup-menu ul{list-style:none;margin:0;padding:.8vh 0}.popup-menu li{padding:.2vh .3vw .5vh .3vw;cursor:pointer;transition:background .2s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.popup-menu li span{display:inline-block;width:5%}.popup-menu li:hover{color:#fff;background:#2253bd}.popup-menu li:active{color:#fff;background:#321e8b}#overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:transparent;display:none;z-index:999}.dlg_overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:linear-gradient(135deg,#0006,#0009);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;justify-content:center;align-items:center;z-index:10000;animation:fadeIn .3s ease-out;pointer-events:auto}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{transform:translateY(-50px) scale(.9);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes slideOut{0%{transform:translateY(0) scale(1);opacity:1}to{transform:translateY(-30px) scale(.95);opacity:0}}.dlg_popup{padding:clamp(1rem,3vw,2.5rem);background:linear-gradient(145deg,#fff,#f8f9fa);border-radius:clamp(12px,2vw,20px);box-shadow:0 clamp(15px,3vw,25px) clamp(25px,5vw,45px) #00000026,0 clamp(6px,1.5vw,12px) clamp(12px,2.5vw,20px) #0000001a;max-width:clamp(300px,60vw,600px);min-width:clamp(280px,40vw,350px);width:clamp(320px,85vw,550px);max-height:clamp(400px,85vh,90vh);overflow-y:auto;display:flex;flex-direction:column;justify-content:center;align-items:center;border:1px solid rgba(255,255,255,.2);animation:slideIn .4s cubic-bezier(.34,1.56,.64,1);position:relative}.dlg_popup:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:16px 16px 0 0}.dlg_popup-text{color:#2c3e50;width:100%;min-height:auto;line-height:clamp(1.4,1.6,1.8);text-align:left;font-weight:500;border-bottom:clamp(1px,.3vw,3px) solid #e9ecef;padding:0 0 clamp(1rem,2vw,2rem) 0;margin-bottom:clamp(1rem,2vw,2rem);font-size:clamp(14px,2.5vw,20px);word-wrap:break-word;overflow-wrap:break-word}.dlg_popup-text h1,.dlg_popup-text h2,.dlg_popup-text h3{color:#495057;margin:clamp(.3em,.5em,.7em) 0;font-size:clamp(16px,3vw,24px);line-height:clamp(1.2,1.3,1.4)}.dlg_popup-text h1{font-size:clamp(20px,4vw,28px)}.dlg_popup-text h2{font-size:clamp(18px,3.5vw,26px)}.dlg_popup-text h3{font-size:clamp(16px,3vw,22px)}.dlg_popup-text p{margin:clamp(.6em,.8em,1em) 0;font-size:clamp(14px,2.2vw,18px)}.dlg_popup-text li{font-size:clamp(14px,2.2vw,18px);margin:clamp(.2em,.4em,.6em) 0}.dlg_popup-text a{color:#667eea;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .3s ease}.dlg_popup-text a:hover{border-bottom-color:#667eea}.dlg_popup-text code{background:#f8f9fa;padding:clamp(2px,.5vw,8px) clamp(4px,1vw,10px);border-radius:clamp(3px,.5vw,6px);font-family:Courier New,monospace;font-size:clamp(12px,2vw,16px);color:#e83e8c}.dlg_popup-text pre{background:#f8f9fa;padding:clamp(.8rem,2vw,1.5rem);border-radius:clamp(6px,1vw,12px);overflow-x:auto;border-left:clamp(3px,.8vw,6px) solid #667eea;font-size:clamp(12px,2vw,16px)}.dlg_popup-button{padding:clamp(10px,2vw,16px) clamp(24px,5vw,40px);border:none;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:clamp(20px,4vw,30px);cursor:pointer;margin-top:clamp(.5rem,1.5vw,1rem);font-size:clamp(14px,2.5vw,18px);font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 clamp(3px,1vw,6px) clamp(12px,3vw,20px) #667eea4d;position:relative;overflow:hidden}.dlg_popup-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.dlg_popup-button:hover{transform:translateY(clamp(-1px,-.3vw,-3px));box-shadow:0 clamp(6px,2vw,12px) clamp(20px,5vw,35px) #667eea66}.dlg_popup-button:hover:before{left:100%}.dlg_popup-button:active{transform:translateY(0);box-shadow:0 clamp(3px,1vw,6px) clamp(12px,3vw,20px) #667eea4d}@media (max-width: 768px){.dlg_popup{padding:clamp(1rem,4vw,2rem);margin:clamp(.5rem,2vw,1.5rem);min-width:clamp(260px,90vw,320px);width:clamp(280px,95vw,400px)}.dlg_popup-text{font-size:clamp(16px,4vw,20px);padding:0 0 clamp(1rem,3vw,1.5rem) 0;margin-bottom:clamp(1rem,3vw,1.5rem)}.dlg_popup-text h1{font-size:clamp(22px,6vw,26px)}.dlg_popup-text h2{font-size:clamp(20px,5vw,24px)}.dlg_popup-text h3{font-size:clamp(18px,4.5vw,22px)}.dlg_popup-text p,.dlg_popup-text li{font-size:clamp(16px,4vw,18px)}.dlg_popup-button{padding:clamp(12px,3vw,16px) clamp(20px,6vw,32px);font-size:clamp(16px,4vw,18px);margin-top:clamp(1rem,3vw,1.5rem)}}@media (max-width: 480px){.dlg_popup{padding:clamp(.8rem,5vw,1.5rem);margin:clamp(.5rem,3vw,1rem);min-width:clamp(240px,95vw,300px);width:clamp(260px,98vw,350px)}.dlg_popup-text{font-size:clamp(14px,5vw,18px)}.dlg_popup-text h1{font-size:clamp(20px,7vw,24px)}.dlg_popup-text h2{font-size:clamp(18px,6vw,22px)}.dlg_popup-text h3{font-size:clamp(16px,5.5vw,20px)}.dlg_popup-button{padding:clamp(10px,4vw,14px) clamp(16px,8vw,28px);font-size:clamp(14px,5vw,16px)}}#drawBtn.active{background-color:#485!important;border-radius:5px!important}#drawBtn.active svg path{stroke:#fff!important}#saveBtn.auto-save-enabled{border-color:#4caf50;box-shadow:0 2px 8px #4caf504d}#saveBtn.auto-save-enabled:hover{background:linear-gradient(135deg,#45a049,#3d8b40);transform:translateY(-1px);box-shadow:0 4px 12px #4caf5066}.auto-save-indicator{background:linear-gradient(135deg,#4caf50,#45a049);color:#fff;padding:clamp(8px,1.5vw,12px) clamp(16px,3vw,20px);border-radius:clamp(6px,1.2vw,10px);font-size:clamp(12px,2vw,14px);font-weight:500;box-shadow:0 clamp(4px,1vw,8px) clamp(15px,3vw,25px) #4caf504d;opacity:0;transform:translate(100%);transition:all .3s cubic-bezier(.4,0,.2,1);pointer-events:none;border:1px solid rgba(255,255,255,.2);white-space:nowrap}.auto-save-indicator.show{opacity:1;transform:translate(0)}.auto-save-indicator:before{content:"✓";margin-right:8px;font-weight:700}@media (max-width: 768px){.auto-save-indicator{top:15px;right:15px;font-size:clamp(11px,3vw,13px);padding:clamp(6px,2vw,10px) clamp(12px,3vw,16px)}}@media (max-width: 480px){.auto-save-indicator{top:10px;right:10px;font-size:clamp(10px,3.5vw,12px);padding:clamp(5px,2.5vw,8px) clamp(10px,3.5vw,14px)}}.draw-panel{position:absolute;background:#fff;border:1px solid #ccc;border-radius:clamp(8px,1vw,12px);padding:clamp(6px,.7vw,8px);box-shadow:0 .2vw 1vw #0000001a;z-index:1001;max-height:80vh;overflow-y:auto;overflow-x:hidden;width:min(16rem,60vw);box-sizing:border-box;transition:opacity .2s ease}body.draw-mode-active #toolbar{display:none}.timer-panel{position:fixed;left:12px;top:12px;z-index:1004;width:max-content;padding:10px;border:1px solid #cfd7e5;border-radius:10px;background:#fffffff5;box-shadow:0 10px 26px #0000002e;-webkit-user-select:none;user-select:none;cursor:move}.timer-panel-row{display:flex;align-items:center;justify-content:center}.timer-panel-row--controls{gap:8px;margin-bottom:8px}.timer-panel-row--time{gap:8px}.timer-panel-btn,.timer-mode-btn{height:30px;padding:0 12px;border:1px solid #cfd7e5;border-radius:8px;background:#f7f9fc;color:#223b63;font-size:13px;font-weight:600;cursor:pointer}.timer-mode-btn.active{border-color:#2253bd;background:#2253bd;color:#fff}.timer-time-field{width:54px;height:54px;border-radius:999px;background:#eef3ff;border:1px solid #d5deef;display:inline-flex;align-items:center;justify-content:center}.timer-time-field input{width:38px;border:0;outline:none;background:transparent;color:#17233d;font-size:22px;font-weight:700;text-align:center;cursor:text}.timer-time-field input[readonly]{cursor:default}.timer-separator{color:#223b63;font-size:28px;font-weight:700;line-height:1}.draw-toolbar{position:fixed;left:50%;bottom:max(12px,2vh);transform:translate(-50%);display:flex;align-items:center;gap:6px;width:max-content;max-width:calc(100vw - 24px);padding:8px 10px;border-radius:14px;box-shadow:0 10px 28px #0000002e;z-index:1002;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin}.draw-toolbar-btn{width:38px;min-width:38px;height:38px;padding:0;border:1px solid #d2d9e6;border-radius:9px;background:#f7f9fc;color:#223b63;display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;transition:all .2s ease;flex:0 0 auto}.draw-toolbar-btn:hover{border-color:#2253bd;background:#eef3ff;color:#2253bd}.draw-toolbar-btn.active{border-color:#2253bd;background:#2253bd;color:#fff}.draw-toolbar-btn svg{width:22px;height:22px;display:block}.draw-toolbar-btn__icon{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}.draw-toolbar-btn__icon svg{width:22px;height:22px;display:block}.draw-toolbar-btn__label{display:none;font-size:13px;font-weight:600;white-space:nowrap}.draw-toolbar-group{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;min-width:0}.draw-toolbar-group--colors{flex:0 0 auto;padding:0 2px}.draw-toolbar-group--slider{gap:4px;padding:0 6px;border:1px solid #e3e8f0;border-radius:9px;background:#fbfcfe}.draw-toolbar-group--slider .slider-container,.draw-toolbar-group--slider .slider-label,.draw-toolbar-group--slider #sizeValue{margin:0}.draw-toolbar-group--slider #penSize{width:68px}.draw-toolbar .color-options{flex-wrap:nowrap;overflow:visible;padding:0;gap:5px}.draw-toolbar .color-btn{flex:0 0 auto}.draw-toolbar-group--toggles{gap:4px}.draw-toolbar-group--toggles .inline-toggle{min-height:38px;padding:0 7px;border:1px solid #e3e8f0;border-radius:9px;background:#fbfcfe}.draw-toolbar-group--board{gap:4px}.draw-toolbar-group--board .board-chip{width:38px;min-height:38px;border:1px solid #e3e8f0;background:#fbfcfe}.draw-toolbar-more-btn{display:none}.draw-toolbar-secondary{display:contents}.draw-tool-panel,#eraserPanel{position:fixed;width:min(16.5rem,calc(100vw - 20px));max-width:calc(100vw - 20px);z-index:1003}#eraserPanel{width:min(12rem,calc(100vw - 20px));padding:8px}.draw-tool-panel .tool-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.draw-panel-section{display:flex;flex-direction:column;gap:clamp(4px,.5vw,6px)}.color-history-row{display:flex;align-items:center;justify-content:space-between;gap:clamp(6px,.7vw,8px)}.draw-panel-section+.draw-panel-section{margin-top:clamp(6px,.7vw,8px);padding-top:clamp(6px,.7vw,8px);border-top:1px solid #eee}.panel-section-title{font-size:clamp(12px,.9vw,15px);font-weight:700;color:#223b63}.color-options{display:flex;flex:1 1 auto;flex-wrap:wrap;gap:5px;margin-bottom:0;justify-content:flex-start;min-width:0}.history-actions{display:flex;flex:0 0 auto;gap:4px;margin-left:auto}.history-btn{width:24px;height:24px;display:flex;align-items:center;justify-content:center;padding:0;border:1px solid #d2d9e6;border-radius:6px;background:#f7f9fc;color:#223b63;cursor:pointer;transition:all .2s ease}.history-btn:hover{border-color:#2253bd;background:#eef3ff}.history-btn:disabled{opacity:.42;cursor:not-allowed;background:#f2f4f8;border-color:#d8dde7;color:#7e8796}.history-btn svg{width:14px;height:14px;display:block}.color-btn{width:18px;height:18px;border-radius:50%;cursor:pointer;border:1px solid #ddd;position:relative;display:flex;align-items:center;justify-content:center}.color-btn--white{background-color:#fff;border-color:#7a8798}.color-btn--white.active:after{border-color:#2253bd}.color-btn.active:after{content:"";position:absolute;left:50%;top:50%;width:8px;height:4px;border-left:2px solid white;border-bottom:2px solid white;transform:translate(-50%,-58%) rotate(-45deg)}.color-btn:nth-child(1).active:after{border-color:#2253bd}.color-btn:nth-child(2).active:after{border-color:#fff}.color-btn:nth-child(4).active:after{border-color:#000}.color-btn:nth-child(6).active:after{border-color:#000}.color-btn:nth-child(1){background-color:#000}.color-btn:nth-child(2){background-color:red}.color-btn:nth-child(3){background-color:#0f0}.color-btn:nth-child(4){background-color:#00f}.color-btn:nth-child(5){background-color:orange}.color-btn:nth-child(6){background-color:#cc36cc}.color-options .color-btn[data-color="#FFFFFF"]{background-color:#fff;border-color:#7a8798}.color-options .color-btn[data-color="#000000"]{background-color:#000}.color-options .color-btn[data-color="#FF0000"]{background-color:red}.color-options .color-btn[data-color="#00FF00"]{background-color:#0f0}.color-options .color-btn[data-color="#0000FF"]{background-color:#00f}.color-options .color-btn[data-color="#FFA500"]{background-color:orange}.color-options .color-btn[data-color="#800080"]{background-color:#cc36cc}.color-options .color-btn[data-color="#FFFFFF"].active:after{border-color:#2253bd}.color-options .color-btn[data-color="#000000"].active:after{border-color:#fff}.color-options .color-btn[data-color="#00FF00"].active:after,.color-options .color-btn[data-color="#FFA500"].active:after{border-color:#000}.slider-container{display:flex;align-items:center;justify-content:flex-start;gap:6px;font-size:.8vw;width:100%;padding:2px 0;box-sizing:border-box}#drawPanel .slider-container .slider{width:92px;flex:0 0 92px}#drawPanel .slider-container #sizeValue{min-width:16px;text-align:right}.slider-label{font-size:clamp(11px,.82vw,14px);color:#4a4a4a;min-width:28px}.tool-config-row{margin-top:.2vw}.slider{width:100%;height:.3vw;background:#ddd;border-radius:.15vw;outline:none}.slider::-webkit-slider-thumb{-webkit-appearance:none;width:1vw;height:1vw;background:#2253bd;border-radius:50%;cursor:pointer}.slider::-moz-range-thumb{width:1vw;height:1vw;background:#2253bd;border-radius:50%;cursor:pointer;border:none}#eraserBtn svg path{transition:stroke .3s ease}#eraserBtn.active{background-color:#f0e0d6!important;border-radius:5px!important}#eraserBtn.active svg path{stroke:#fff!important}#clearAllBtn.active svg path{fill:#fff!important}#drawCanvas.pen-mode{cursor:url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='%23FFFFFF' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M30.9995 8.99902L38.9995 16.999'/%3E%3Cpath d='M7.99953 31.999L35.9994 4L43.9995 11.999L15.9995 39.999L5.99951 41.999L7.99953 31.999Z'/%3E%3Cpath d='M8.99951 31.999L15.9995 38.999'/%3E%3Cpath d='M12.9995 34.999L34.9995 12.999'/%3E%3C/g%3E%3Cg stroke='%23000000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M30.9995 8.99902L38.9995 16.999'/%3E%3Cpath d='M7.99953 31.999L35.9994 4L43.9995 11.999L15.9995 39.999L5.99951 41.999L7.99953 31.999Z'/%3E%3Cpath d='M8.99951 31.999L15.9995 38.999'/%3E%3Cpath d='M12.9995 34.999L34.9995 12.999'/%3E%3C/g%3E%3C/svg%3E") 4 28,crosshair}#drawCanvas.eraser-mode{cursor:default}#toolbar button:not([disabled]):hover{border-radius:5px;background-color:#2253bd}#toolbar button:not([disabled]):hover svg path,#toolbar button:not([disabled]):hover svg circle,#toolbar button:not([disabled]):hover svg line,#toolbar button:not([disabled]):hover svg polyline{stroke:#fff}#alwaysOnTopBtn:hover svg path{fill:#fff!important}input[type=range]{-webkit-appearance:none;width:100%;height:6px;border-radius:3px;background:#d3d3d3;outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:#fff;border:1px solid #888;cursor:pointer;box-shadow:0 0 2px #0000004d}input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:1px solid #888;cursor:pointer;box-shadow:0 0 2px #0000004d}#drawPanel input[type=range],#eraserPanel input[type=range]{margin:.5vw 0;width:75%}#sizeValue,#eraserSizeValue{font-size:clamp(12px,.9vw,16px);min-width:clamp(24px,1.8vw,32px);text-align:center}.eraser-panel-title{font-size:.9vw;font-weight:700;color:#333;margin-bottom:6px;text-align:center;padding-bottom:6px;border-bottom:1px solid #eee}.eraser-mode-switch{display:flex;align-items:center;margin-top:6px;justify-content:center;background-color:#f5f5f5;border-radius:7px;padding:6px 8px;box-sizing:border-box;width:100%}.checkbox-label{display:flex;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;width:100%;justify-content:center;gap:5px}.checkbox-label input[type=checkbox]{opacity:0;position:absolute;width:16px;height:16px}.inline-toggle{display:inline-flex;align-items:center;gap:5px;padding:3px 6px;border-radius:7px;background-color:#f5f5f5;cursor:pointer;-webkit-user-select:none;user-select:none;flex:0 0 auto}.inline-toggle input[type=checkbox]{opacity:0;position:absolute;width:16px;height:16px}.inline-toggle:hover .checkbox-custom{border-color:#999}.inline-toggle input[type=checkbox]:checked+.checkbox-custom{background-color:#2196f3;border-color:#2196f3}.inline-toggle input[type=checkbox]:checked+.checkbox-custom:after{display:block}.inline-toggle input[type=checkbox]:focus+.checkbox-custom{box-shadow:0 0 0 2px #2196f32e}.checkbox-custom{position:relative;display:inline-block;width:14px;height:14px;background-color:#fff;border:1px solid #ccc;border-radius:3px;margin-right:0;transition:all .2s ease}.checkbox-label input[type=checkbox]:checked+.checkbox-custom{background-color:#2196f3;border-color:#2196f3}.checkbox-custom:after{content:"";position:absolute;display:none;left:4px;top:1px;width:4px;height:8px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.checkbox-label input[type=checkbox]:checked+.checkbox-custom:after{display:block}.checkbox-label:hover .checkbox-custom{border-color:#999}.checkbox-label input[type=checkbox]:focus+.checkbox-custom{box-shadow:0 0 0 2px #2196f32e}.switch-label{font-size:clamp(11px,.78vw,13px);color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500}@media (max-width: 768px){.draw-toolbar{width:calc(100vw - 16px);max-width:calc(100vw - 16px);padding:6px 7px;gap:4px;flex-wrap:wrap;overflow-x:hidden;overflow-y:visible;justify-content:center}.draw-toolbar:before{content:"";order:9;flex:0 0 100%;height:0}.draw-toolbar-more-btn{display:inline-flex}.draw-toolbar-secondary{order:10;flex:0 0 100%;display:none;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px;min-width:0}.draw-toolbar.draw-toolbar--secondary-open .draw-toolbar-secondary{display:flex}.draw-toolbar-btn{width:34px;min-width:34px;height:34px;order:1}.draw-toolbar-btn svg,.draw-toolbar-btn__icon,.draw-toolbar-btn__icon svg{width:20px;height:20px}.draw-toolbar-group--slider{height:34px;gap:3px;padding:0 5px}.draw-toolbar-group--slider #penSize{width:42px}.draw-toolbar-group--slider .slider-label{font-size:12px}.draw-toolbar-group--slider #sizeValue{min-width:16px;font-size:12px}.draw-toolbar-group--toggles{gap:3px}.draw-toolbar-group--toggles .inline-toggle{width:34px;min-height:34px;padding:0;justify-content:center}.draw-toolbar-group--toggles .switch-label{display:none}.draw-toolbar-group--board{gap:3px}.draw-toolbar-group--board .board-chip{width:34px;min-height:34px}.eraser-mode-switch{padding:1vw 1.2vw}.checkbox-custom{width:14px;height:14px;margin-right:0;border-width:1px}.checkbox-custom:after{border-width:0 2px 2px 0}.slider-container{gap:.8vw;padding:.5vw 0}#drawPanel input[type=range],#eraserPanel input[type=range]{margin:1.5vw 0}.draw-toolbar-group--colors{order:2;width:auto;overflow:visible}.draw-toolbar .color-options{width:max-content}.draw-toolbar .color-btn{width:clamp(16px,4.2vw,20px);height:clamp(16px,4.2vw,20px);display:flex}.draw-toolbar .color-btn.active:after{width:clamp(7px,1.8vw,9px);height:clamp(4px,1.2vw,6px);border-left-width:2px;border-bottom-width:2px}.draw-toolbar .color-options{gap:3px;margin-bottom:0}.draw-panel{padding:10px;border-radius:10px}}#drawCanvas,#shapeCanvas,#lassoTempCanvas{transition:width .1s ease,height .1s ease,left .1s ease,top .1s ease}.draw-panel{transition:opacity .2s ease}@media screen and (max-width: 480px){#toolbar.horizontal{flex-direction:column;right:5px;top:50%!important;transform:translateY(-50%);padding:8px 5px;left:auto!important}#toolbar button,#dragArea,#pages{width:clamp(32px,8vw,40px);height:clamp(32px,8vw,40px)}#toolbar button svg,#dragArea svg{width:clamp(20px,5vw,24px);height:clamp(20px,5vw,24px)}#pages>span{font-size:clamp(12px,3vw,14px)}.draw-panel{width:min(18rem,82vw)}.draw-panel.draw-toolbar{width:calc(100vw - 16px);max-width:calc(100vw - 16px);max-height:none;flex-wrap:wrap;align-items:center;overflow-x:hidden;overflow-y:visible;justify-content:center}.draw-tool-panel,#eraserPanel{width:min(16rem,calc(100vw - 16px))}#eraserPanel{width:min(12rem,calc(100vw - 16px))}.tool-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.smart-option-row{grid-template-columns:repeat(2,minmax(0,1fr))}.smart-option-row .board-switch-row{grid-column:span 2;justify-self:start}}@media screen and (min-width: 481px) and (max-width: 768px){#toolbar button,#dragArea,#pages{width:clamp(32px,5vw,36px);height:clamp(32px,5vw,36px)}}.menu-panel{position:absolute;background-color:#fff;border:1px solid #ccc;border-radius:.5vw;box-shadow:0 0 1vw #0003;padding:.8vw;z-index:1001;min-width:clamp(120px,15vw,300px)}.menu-item{display:flex;align-items:center;padding:.6vw 1vw;cursor:pointer;border-radius:.3vw;font-size:clamp(12px,1vw,16px);transition:background-color .2s}.menu-item:hover{background-color:#f0f0f0}.menu-item svg{width:clamp(16px,1.5vw,24px);height:clamp(16px,1.5vw,24px);margin-right:.8vw}.menu-item span{flex:1;white-space:nowrap}.menu-separator{height:1px;background-color:#ddd;margin:.4vw 0}.tool-panel{position:absolute;background-color:#fff;border:1px solid #ccc;border-radius:.5vw;box-shadow:0 0 1vw #0003;padding:1vw;z-index:1001;min-width:clamp(200px,20vw,400px)}.tool-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(3px,.35vw,4px)}.board-switch-row{display:grid;grid-template-columns:repeat(2,auto);gap:clamp(.08rem,.18vw,.14rem);min-width:0;width:fit-content;justify-self:start}.board-chip{width:clamp(1.28rem,1.7vw,1.45rem);min-width:0;min-height:clamp(1.18rem,1.55vw,1.34rem);padding:clamp(.04rem,.1vw,.08rem);border:none;border-radius:clamp(.22rem,.3vw,.28rem);background:#f7f9fc85;color:#223b63;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:all .2s ease}.board-chip:hover{background:#eef3ff;color:#2253bd}.board-chip:focus-visible{outline:2px solid rgba(34,83,189,.35);outline-offset:2px}.board-chip.active{background:#2253bd24;color:#fff;box-shadow:inset 0 0 0 1px #2253bd1f}.board-chip-icon{position:relative;width:clamp(.62rem,.82vw,.72rem);aspect-ratio:1 / 1;border-radius:clamp(.1rem,.16vw,.16rem);display:inline-block;box-sizing:border-box}.board-chip-icon:before,.board-chip-icon:after{content:"";position:absolute;box-sizing:border-box}.board-chip-icon:before{left:12%;right:12%;top:14%;bottom:24%;border-radius:clamp(.14rem,.22vw,.22rem)}.board-chip-icon:after{left:26%;right:26%;bottom:11%;height:10%;border-radius:999px}.board-chip-icon--white:before{background:linear-gradient(180deg,#fffffffa,#f5f7fafa),#fff;border:1px solid rgba(34,59,99,.2)}.board-chip-icon--white:after{background:#223b6338}.board-chip-icon--black:before{background:radial-gradient(circle at top,rgba(255,255,255,.14),transparent 48%),linear-gradient(180deg,#1d2a1f,#101814);border:1px solid rgba(255,255,255,.18)}.board-chip-icon--black:after{background:#ffffff52}.tool-chip{width:100%;min-height:46px;min-width:0;padding:0;border:1px solid #d2d9e6;border-radius:10px;background:#f7f9fc;color:#223b63;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1;transition:all .2s ease}.tool-chip svg{width:24px;height:24px;display:block;flex:0 0 auto}.tool-chip:hover{border-color:#2253bd;background:#eef3ff;color:#2253bd}.tool-chip:focus-visible{outline:2px solid rgba(34,83,189,.35);outline-offset:2px}.tool-chip.active{border-color:#2253bd;background:#2253bd;color:#fff;box-shadow:0 .2vw .8vw #2253bd33}.tool-chip:disabled{border-color:#d8dde7;background:#f2f4f8;color:#7e8796;cursor:not-allowed;opacity:.55}.smart-option-row{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1fr);gap:6px}.smart-option-row .checkbox-label{display:flex;align-items:center;justify-content:center;background-color:#f5f5f5;border-radius:7px;padding:6px 8px;box-sizing:border-box;width:100%}.smart-option-row .board-switch-row{grid-column:auto}.board-overlay-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:900;pointer-events:none}.board-overlay-canvas--white{background:linear-gradient(180deg,#fffffffa,#f5f7fafa),#fff}.board-overlay-canvas--black{background:radial-gradient(circle at top,rgba(255,255,255,.06),transparent 34%),linear-gradient(180deg,#1d2a1f,#101814)}.board-overlay-close{position:absolute;right:clamp(.8rem,1.2vw,1.1rem);bottom:clamp(.8rem,1.2vw,1.1rem);width:clamp(2rem,3vw,2.4rem);height:clamp(2rem,3vw,2.4rem);border:1px solid rgba(34,59,99,.18);border-radius:999px;background:#ffffffe0;color:#223b63;display:inline-flex;align-items:center;justify-content:center;font-size:clamp(1rem,1.6vw,1.25rem);line-height:1;box-shadow:0 .2vw .8vw #00000024;z-index:905;cursor:pointer;transition:all .2s ease}.board-overlay-close:hover{background:#fff;border-color:#2253bd;color:#2253bd}.board-overlay-close:focus-visible{outline:2px solid rgba(34,83,189,.35);outline-offset:2px}.tool-note{margin:0;font-size:clamp(11px,.78vw,13px);line-height:1.5;color:#5c6572}.panel-header{font-size:clamp(14px,1.2vw,18px);font-weight:700;margin-bottom:1vw;padding-bottom:.5vw;border-bottom:1px solid #eee}.panel-content{font-size:clamp(12px,1vw,16px)}.panel-footer{display:flex;justify-content:flex-end;gap:.8vw;margin-top:1vw;padding-top:.8vw;border-top:1px solid #eee}.panel-button{padding:.4vw 1vw;border-radius:.3vw;font-size:clamp(12px,.9vw,14px);cursor:pointer;border:1px solid #ccc;background-color:#fff;transition:all .2s}.panel-button:hover{background-color:#f0f0f0}.panel-button.primary{background-color:#2253bd;color:#fff;border-color:#2253bd}.panel-button.primary:hover{background-color:#1a408f;border-color:#1a408f}#toggleToolbarBtn{background:none;border:none;color:#333;cursor:pointer;font-size:clamp(16px,2vw,24px);padding:5px 10px;margin-right:10px;transition:color .3s ease}#toggleToolbarBtn:hover{color:#fff}#toolbar.collapsed{height:auto}#toolbar.horizontal.collapsed{padding-top:.3vw;padding-bottom:.3vw}#toolbar.vertical.collapsed{padding-left:.4vw;padding-right:.4vw}#toolbar.collapsed>*:not(#toggleToolbarBtn):not(#dragArea){display:none!important}#toolbar.vertical.collapsed{width:auto}#toolbar.collapsed #toggleToolbarBtn{display:flex!important}#alwaysOnTopBtn.active{fill:#fff;background-color:#485;border-radius:5px}