.drawing-studio-backdrop{z-index:100000;background:#1a0d2ee0;place-items:center;padding:10px;display:grid;position:fixed;inset:0}.drawing-studio{color:#29143f;background:#f8f5fb;border:2px solid #915bc2;border-radius:18px;flex-direction:column;width:min(1650px,100%);min-width:0;height:calc(100dvh - 20px);display:flex;overflow:hidden;box-shadow:0 26px 80px #10091ccc}.drawing-studio button,.drawing-studio input{font:inherit}.drawing-studio-header{background:linear-gradient(120deg,#fff,#ede3f7);border-bottom:1px solid #d6c5e4;flex:none;justify-content:space-between;align-items:center;gap:15px;padding:10px 16px;display:flex}.drawing-studio-header>div:first-child{min-width:0}.drawing-studio-header span{color:#62477b;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:800;display:block;overflow:hidden}.drawing-studio-header h2{color:#441477;margin:2px 0 0;font-size:clamp(16px,1.5vw,22px)}.drawing-header-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:6px;display:flex}.drawing-header-actions :is(button,a),.drawing-canvas-head button,.drawing-mobile-help-toggle{color:#461578;cursor:pointer;background:linear-gradient(#fff,#ede6f4);border:1px solid #baa0d0;border-radius:8px;justify-content:center;align-items:center;gap:5px;min-height:33px;padding:6px 10px;font-size:12px;font-weight:800;text-decoration:none;display:inline-flex;box-shadow:0 2px 5px #30114b20}.drawing-header-actions .drawing-close{width:35px;padding:5px}.drawing-mode-switch{background:#f3ebf9;border:1px solid #b494cf;border-radius:9px;padding:2px;display:flex}.drawing-header-actions .drawing-mode-switch button{min-height:28px;box-shadow:none;border:0;color:#5a218a!important}.drawing-header-actions .drawing-mode-switch .is-active{background:#7526ae;color:#fff!important}.drawing-studio-main{flex:1;grid-template-columns:102px minmax(0,1fr) 300px;gap:9px;min-width:0;min-height:0;padding:9px;display:grid}.drawing-tools,.drawing-canvas-column,.drawing-guide{background:#fff;border:1px solid #d6c2e5;border-radius:11px;min-width:0;min-height:0;box-shadow:0 3px 9px #33135a16}.drawing-tools{flex-direction:column;gap:5px;padding:6px;display:flex;overflow-y:auto}.drawing-tools button{color:#442366;cursor:pointer;background:#f9f6fc;border:1px solid #e5d9ed;border-radius:8px;flex-direction:column;flex:none;justify-content:center;align-items:center;gap:2px;min-height:54px;padding:4px 2px;font-size:10px;font-weight:800;display:flex}.drawing-tools button:hover:not(:disabled),.drawing-tools .drawing-tool-active{color:#42116f;background:#e9d8f9;border-color:#8336c0}.drawing-tools button:disabled{opacity:.4;cursor:default}.drawing-tools-separator{background:#d9cde5;flex:none;height:1px;margin:4px 0}.drawing-canvas-column{flex-direction:column;display:flex;overflow:hidden}.drawing-canvas-head,.drawing-canvas-foot{color:#3f235a;background:#f7f2fb;flex:none;justify-content:space-between;align-items:center;gap:10px;padding:7px 12px;font-size:12px;display:flex}.drawing-canvas-head{border-bottom:1px solid #d9c9e5;font-weight:800}.drawing-canvas-head>span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.drawing-canvas-head>div{flex:none;align-items:center;gap:7px;display:flex}.drawing-canvas-head button{width:30px;min-height:28px;padding:2px}.drawing-canvas-options{color:#61467b;border-bottom:1px solid #e6dbee;flex-wrap:wrap;align-items:center;gap:10px;min-height:32px;padding:4px 9px;font-size:11px;display:flex}.drawing-canvas-options label{align-items:center;gap:4px;font-weight:700;display:inline-flex}.drawing-canvas-options input{border:1px solid #bca0d2;border-radius:5px;width:65px;padding:3px 5px}.drawing-canvas-options select,.drawing-canvas-options button{color:#4c197a;cursor:pointer;background:#fff;border:1px solid #bca0d2;border-radius:5px;padding:4px 6px;font-weight:700}.drawing-canvas-foot{color:#6b597d;border-top:1px solid #d9c9e5;font-size:10px}.drawing-canvas-foot span:last-child{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.drawing-canvas{touch-action:none;cursor:crosshair;background:#fff;flex:1;width:100%;min-height:0;display:block}.drawing-canvas-pan,.drawing-canvas-pan .drawing-shape-interactive,.drawing-shape-interactive{cursor:grab}.drawing-mode-overlay{z-index:7;background:#190b32b8;place-items:center;padding:18px;display:grid;position:absolute;inset:0}.drawing-studio{position:relative}.drawing-mode-prompt{text-align:center;background:#fff;border:2px solid #b97be2;border-radius:18px;width:min(500px,100%);padding:26px;box-shadow:0 20px 50px #17082077}.drawing-mode-prompt h3{color:#441477;margin:0 0 10px;font-size:24px}.drawing-mode-prompt p{color:#5d4e6b;margin:0 0 20px;font-size:14px;line-height:1.5}.drawing-mode-prompt>div{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.drawing-mode-prompt button{color:#451579;cursor:pointer;background:#f1e4fa;border:1px solid #8946c1;border-radius:10px;padding:11px 16px;font-weight:800}.drawing-mode-prompt button:first-child{background:#7424b1;color:#fff!important}.drawing-mode-prompt button:disabled{opacity:.45;cursor:not-allowed}.drawing-mode-prompt small{color:#715e81;margin-top:14px;display:block}.drawing-guide{flex-direction:column;display:flex;overflow:hidden}.drawing-guide h3{color:#4b167b;border-bottom:1px solid #e5d9ec;margin:0;padding:12px;font-size:17px}.drawing-guide-context{color:#391b58;margin:9px 12px 0;font-size:12px;font-weight:800}.drawing-lesson{background:#faf6fd;border:1px solid #d8bde9;border-radius:10px;flex:none;gap:7px;max-height:35%;margin:9px 10px;padding:10px;display:grid;overflow-y:auto}.drawing-lesson p{color:#432464;margin:0;font-size:12px;line-height:1.4}.drawing-lesson small{color:#73538b;font-size:11px;font-weight:700}.drawing-lesson-step{color:#32114f;background:#fff;border-radius:8px;gap:5px;padding:9px;font-size:12px;line-height:1.4;display:grid;box-shadow:0 2px 5px #44236517}.drawing-lesson-step strong{color:#7026ac}.drawing-guide-limits{color:#665275;background:#f4edf9;border-radius:8px;flex:none;margin:7px 10px;padding:7px;font-size:10px;line-height:1.35}.drawing-guide-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:0 10px 9px;display:grid}.drawing-guide-actions button{color:#47177b;cursor:pointer;background:linear-gradient(#fff,#e9dff3);border:1px solid #b99dd2;border-radius:8px;min-height:38px;padding:6px;font-size:11px;font-weight:800}.drawing-guide-actions button:hover{background:#e5d3f6}.drawing-guide-messages{background:#fcfaff;flex-direction:column;flex:1;gap:8px;min-height:0;padding:10px;display:flex;overflow-y:auto}.drawing-guide-messages p{overflow-wrap:anywhere;white-space:pre-line;border-radius:10px;margin:0;padding:9px;font-size:12px;line-height:1.5}.drawing-message-guide{color:#3e225c;background:#eee6f7;align-self:flex-start}.drawing-message-student{color:#26365b;background:#e6edf8;align-self:flex-end}.drawing-guide form{border-top:1px solid #e5d9ec;gap:5px;padding:8px;display:flex}.drawing-guide form input{color:#26143d;background:#fff;border:1px solid #cbb4dd;border-radius:8px;flex:1;min-width:0;padding:8px;font-size:12px}.drawing-guide form button{color:#431375;cursor:pointer;background:#e5d4f7;border:1px solid #8847bf;border-radius:8px;flex:none;place-items:center;width:34px;display:grid}.drawing-guide form button:disabled{opacity:.45}.drawing-mobile-help-toggle{display:none}@media (width<=850px){.drawing-studio-backdrop{padding:0}.drawing-studio{border:0;border-radius:0;height:100dvh}.drawing-studio-header{align-items:start;padding:8px}.drawing-mode-switch{order:2}.drawing-studio-header h2{font-size:16px}.drawing-header-actions{gap:3px}.drawing-header-actions :is(button,a){min-height:30px;padding:4px 6px;font-size:10px}.drawing-studio-main{grid-template-rows:minmax(0,1fr) auto;grid-template-columns:59px minmax(0,1fr);gap:5px;padding:5px;position:relative}.drawing-tools{grid-row:1/3}.drawing-tools button{min-height:48px;font-size:8px}.drawing-canvas-column{grid-column:2}.drawing-canvas-head{padding:5px;font-size:10px}.drawing-canvas-foot{padding:5px;font-size:9px}.drawing-mobile-help-toggle{grid-column:2;min-height:38px;display:flex}.drawing-guide{z-index:3;height:min(60vh,520px);display:none;position:absolute;bottom:46px;left:66px;right:0;box-shadow:0 10px 30px #1c093a55}.drawing-guide-open{display:flex}}
