
:root{
  --bg:#1f1f1f;--dark:#181818;--border:#2b2b2b;--text:#d4d4d4;
  --muted:#858585;--blue:#007acc;--purple:#512da8;--green:#89d185;
  --red:#f48771;--paper:#fffef7;--paper-line:#c9def5;--paper-red:#e7a3a3;
}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:"Segoe UI",Ubuntu,Arial,sans-serif}
button,textarea,input{font:inherit}
button{cursor:pointer}
#app{width:100vw;height:100vh;min-width:960px;display:grid;grid-template-rows:35px 1fr 23px}
.titlebar{display:grid;grid-template-columns:150px 1fr 150px;align-items:center;padding:0 10px;background:var(--dark);font-size:12px;text-align:center;border-bottom:1px solid #111}
.brand-title{font-weight:600}.brand-title span{font-weight:400;color:#999}
.traffic{display:flex;gap:7px}.traffic i{width:12px;height:12px;border-radius:50%;background:#ff5f57}.traffic i:nth-child(2){background:#febc2e}.traffic i:nth-child(3){background:#28c840}
.window-buttons{text-align:right;letter-spacing:10px;color:#888}

.workbench{min-height:0;display:grid;grid-template-columns:48px 270px 4px 1fr}
.activitybar{display:flex;flex-direction:column;background:var(--dark);border-right:1px solid var(--border)}
.activitybar>span{flex:1}.activity{height:48px;border:0;border-left:2px solid transparent;background:transparent;color:#858585;font-size:26px}.activity.active{color:#fff;border-left-color:#fff}.activity img{width:25px;height:25px;vertical-align:middle}
.mobile-only{display:none}
.sidebar{overflow:auto;background:var(--dark);font-size:12px}
.side-view{display:none;min-height:100%;padding-bottom:20px}.side-view.active{display:block}
.sidebar-head{padding:11px 20px 8px;color:#bbb;font-size:11px}.workspace-name{padding:4px 8px;height:25px;font-weight:700}
.side-help{padding:10px 14px;color:#aaa;line-height:1.5}
.wide-button{display:block;width:calc(100% - 28px);margin:8px 14px;padding:9px;border:1px solid #4a4a4a;background:#2d2d2d;color:#ddd}.payment-link{text-align:center;text-decoration:none}.wide-button.secondary{background:#222}
.scratch-textarea{display:block;width:calc(100% - 28px);height:220px;margin:8px 14px;padding:10px;resize:vertical;background:#101010;color:#eee;border:1px solid #444;font:14px/21px "Ubuntu Mono",monospace}

.vertical-resizer{width:4px;background:#252525;cursor:col-resize;z-index:8}
.vertical-resizer:hover,.vertical-resizer.dragging,.horizontal-resizer:hover,.horizontal-resizer.dragging{background:var(--blue)}
.language-row,.group-row,.file-row{width:100%;min-height:24px;border:0;background:transparent;color:var(--text);text-align:left;display:flex;align-items:center;gap:6px}
.language-row{padding-left:7px;font-weight:700}.group-row{padding-left:23px}.file-row{padding:3px 8px 3px 45px}
.file-row:hover,.file-row.active{background:#2a2d2e}.file-row.completed::after{content:"✓";margin-left:auto;color:var(--green)}
.tree-icon{width:16px;height:16px;object-fit:contain;flex:none}.chev{width:10px;color:#bbb}.tree-children.collapsed{display:none}

.main{min-width:0;min-height:0;display:grid;grid-template-rows:36px 45px minmax(260px,1fr) 4px 145px;position:relative}
.tabs-shell{display:flex;min-width:0;background:var(--dark);border-bottom:1px solid var(--border)}
.tabs{display:flex;min-width:0;flex:1;overflow-x:auto;overflow-y:hidden}.tabs::-webkit-scrollbar{height:3px}.tabs::-webkit-scrollbar-thumb{background:#555}
.tab{height:35px;min-width:145px;max-width:280px;padding:0 8px;display:flex;align-items:center;gap:7px;background:#181818;border-right:1px solid var(--border);border-top:1px solid transparent;color:#aaa;font-size:12px;user-select:none;resize:horizontal;overflow:hidden}
.tab.active{background:var(--bg);border-top-color:var(--purple);color:#fff}.tab.dragging{opacity:.45}.tab img{width:15px;height:15px}.tab-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.tab-close{border:0;background:transparent;color:#999;font-size:15px;padding:0 2px}.tab-close:hover{background:#444;color:#fff;border-radius:3px}.tab-action{width:34px;border:0;background:#181818;color:#aaa;font-size:19px}

.lessonbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 12px;background:#202020;border-bottom:1px solid var(--border);font-size:12px}
.lessonbar strong{color:#fff;margin-right:10px}.lessonbar span{color:var(--muted)}
.actions{display:flex;align-items:center;gap:7px}.actions label{color:#bbb;white-space:nowrap}.actions input{accent-color:var(--purple)}
.actions button{height:28px;padding:0 10px;border:1px solid #4a4a4a;background:#2d2d2d;color:#ddd}.actions .primary{background:var(--purple);border-color:var(--purple);color:#fff}

.editor-area{min-height:0;display:grid;grid-template-columns:minmax(350px,1fr) 4px minmax(260px,38%);overflow:hidden}
.left-workspace{min-width:0;min-height:0;display:grid;grid-template-rows:1fr 4px 1fr}
.editor-pane,.preview-pane{min-height:0;display:grid;grid-template-rows:26px 1fr;overflow:hidden;position:relative}
.pane-title{padding:0 10px;display:flex;justify-content:space-between;align-items:center;background:#1d1d1d;border-bottom:1px solid #292929;color:#999;font-size:10px;letter-spacing:.3px;z-index:2}
.horizontal-resizer{height:4px;background:#303030;cursor:row-resize;z-index:8}
.code-shell{min-height:0;display:grid;grid-template-columns:48px 1fr;overflow:hidden;position:relative}
.line-numbers{margin:0;padding:10px 10px 30px 0;text-align:right;color:#858585;border-right:1px solid #252525;font:14px/21px "Ubuntu Mono",Consolas,monospace;white-space:pre;overflow:hidden;z-index:1}
.code-view{margin:0;padding:10px 16px 30px;overflow:auto;color:#d4d4d4;font:14px/21px "Ubuntu Mono",Consolas,monospace;tab-size:4;white-space:pre;z-index:1}
#practiceEditor{width:100%;height:100%;resize:none;border:0;outline:0;padding:10px 16px 30px;background:transparent;color:#d4d4d4;caret-color:#fff;font:14px/21px "Ubuntu Mono",Consolas,monospace;tab-size:4;white-space:pre;overflow:auto;z-index:1}
.watermark::after{content:"PSF-TREINO";position:absolute;right:28px;bottom:28px;font-size:42px;font-weight:800;letter-spacing:4px;color:rgba(255,255,255,.035);transform:rotate(-12deg);pointer-events:none;z-index:0}

.math-mode .code-shell{background-color:var(--paper);background-image:linear-gradient(var(--paper-line) 1px,transparent 1px),linear-gradient(90deg,transparent 44px,var(--paper-red) 45px,var(--paper-red) 46px,transparent 47px);background-size:100% 24px,100% 100%}
.math-mode .line-numbers{color:#8a8a8a;border-right:0;background:transparent}
.math-mode .code-view,.math-mode #practiceEditor{color:#172033;font-family:"DejaVu Sans Mono","Ubuntu Mono",monospace;line-height:24px}
.math-mode.watermark::after{color:rgba(81,45,168,.05)}
.preview-pane{background:#fff}.preview-pane .pane-title{background:#1d1d1d}#previewFrame{width:100%;height:100%;border:0;background:#fff}

.chat-workspace{position:absolute;inset:36px 0 0 0;display:grid;grid-template-rows:54px 1fr auto 80px;background:#171717;z-index:20}
.hidden{display:none!important}
.chat-header{display:flex;justify-content:space-between;align-items:center;padding:0 16px;border-bottom:1px solid #333;background:#202020}.chat-header>div{display:flex;align-items:center;gap:9px}.chat-header img{width:28px}.chat-header span{color:#888;font-size:12px}.chat-header button{border:0;background:transparent;color:#aaa;font-size:24px}
.chat-messages{overflow:auto;padding:18px;display:flex;flex-direction:column;gap:12px;background:radial-gradient(circle at 80% 20%,rgba(81,45,168,.12),transparent 35%),#171717}
.message{max-width:75%;padding:11px 13px;border-radius:10px;line-height:1.5;white-space:pre-wrap}.message.user{align-self:flex-end;background:#512da8;color:#fff}.message.psf{align-self:flex-start;background:#292929;border:1px solid #3b3b3b}.message small{display:block;color:#999;margin-bottom:5px}
.chat-suggestions{display:flex;gap:7px;overflow-x:auto;padding:8px 14px;border-top:1px solid #2c2c2c}.chat-suggestions button{white-space:nowrap;padding:8px 10px;border:1px solid #444;background:#252525;color:#ddd;border-radius:16px}
.chat-input-row{display:grid;grid-template-columns:1fr 90px;gap:8px;padding:10px 14px;border-top:1px solid #333}.chat-input-row textarea{resize:none;background:#222;color:#eee;border:1px solid #444;padding:10px}.chat-input-row button{border:0;background:#512da8;color:#fff}

.panel{min-height:0;display:grid;grid-template-rows:31px 1fr;background:var(--dark)}.terminal-resizer{border-top:1px solid var(--border)}
.panel-tabs{display:flex;align-items:center;padding:0 13px;gap:18px;font-size:11px}.panel-tabs>span{flex:1}.panel-tabs button{border:0;background:transparent;color:#aaa}.panel-tab{height:31px}.panel-tab.active{color:#fff;border-bottom:1px solid #fff}
.panel-content{display:none;min-height:0}.panel-content.active{display:block}
.terminal{height:100%;overflow:auto;padding:8px 13px;font:13px/20px "Ubuntu Mono",Consolas,monospace;white-space:pre-wrap}.prompt{color:var(--green)}.path{color:#569cd6}.muted{color:#858585}.error{color:var(--red)}.success{color:var(--green)}.output{color:#dcdcaa}
.scratch-panel{height:100%;display:grid;grid-template-columns:1fr 120px;gap:8px;padding:8px}.scratch-panel textarea{resize:none;background:#101010;color:#eee;border:1px solid #444;padding:8px;font:14px/20px "Ubuntu Mono",monospace}.scratch-actions{display:flex;flex-direction:column;gap:8px}.scratch-actions button{padding:8px;border:1px solid #444;background:#2b2b2b;color:#eee}

.mobile-keyboard{position:fixed;left:0;right:0;bottom:23px;z-index:50;background:#151515;border-top:1px solid #555;box-shadow:0 -8px 24px rgba(0,0,0,.45);padding-bottom:env(safe-area-inset-bottom)}
.keyboard-head{height:34px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;color:#bbb}.keyboard-head button{border:0;background:transparent;color:#aaa;font-size:20px}
.keyboard-keys{display:grid;grid-template-columns:repeat(10,minmax(38px,1fr));gap:5px;padding:6px 8px 10px;max-height:210px;overflow:auto}.key{min-height:38px;border:1px solid #494949;background:#292929;color:#fff;border-radius:5px}.key.wide{grid-column:span 2}.key.accent{background:#512da8}

.statusbar{display:flex;align-items:center;justify-content:flex-end;gap:14px;padding:0 9px;background:var(--purple);color:#fff;font-size:11px}.statusbar span:first-child{margin-right:auto;font-weight:700}
.flash-error{animation:flashError .25s}.flash-success{animation:flashSuccess .45s}@keyframes flashError{50%{box-shadow:inset 0 0 0 2px var(--red)}}@keyframes flashSuccess{50%{box-shadow:inset 0 0 0 2px var(--green)}}

@media(max-width:1100px){
  .workbench{grid-template-columns:44px 225px 4px 1fr}
  .actions label{display:none}
}
@media(max-width:760px){
  html,body{overflow:hidden}
  #app{min-width:0;grid-template-rows:35px 1fr 23px}
  .titlebar{grid-template-columns:65px 1fr 20px}.window-buttons{display:none}.brand-title span{display:none}
  .workbench{display:grid;grid-template-columns:44px 1fr}
  .activitybar{grid-column:1}.mobile-only{display:block}
  .sidebar{position:fixed;left:44px;top:35px;bottom:23px;width:min(84vw,330px);z-index:60;box-shadow:12px 0 30px rgba(0,0,0,.55);transform:translateX(-110%);transition:.2s}
  .sidebar.mobile-open{transform:translateX(0)}
  #sidebarResizer{display:none}
  .main{grid-column:2;grid-template-rows:36px auto minmax(260px,1fr) 4px 110px}
  .lessonbar{align-items:flex-start;flex-direction:column;padding:6px 8px;min-height:76px}
  .actions{width:100%;overflow-x:auto;padding-bottom:2px}.actions button{white-space:nowrap}.actions label{display:block}
  .editor-area{display:block;overflow:auto}
  .left-workspace{height:100%;grid-template-rows:minmax(260px,1fr) 4px minmax(260px,1fr)}
  #previewResizer,.preview-pane{display:none}
  .tab{min-width:125px;resize:none}
  .panel{font-size:12px}
  .mobile-keyboard{bottom:23px}
  .keyboard-keys{grid-template-columns:repeat(6,minmax(42px,1fr))}
  .message{max-width:90%}
  .chat-workspace{inset:36px 0 0 0}
  .chat-input-row{grid-template-columns:1fr 70px}
  .watermark::after{font-size:27px}
}

.auth-screen{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 20% 10%,rgba(81,45,168,.35),transparent 35%),#121212;overflow:auto}.auth-card{width:min(520px,96vw);background:#1d1d1d;border:1px solid #3a3a3a;border-radius:12px;padding:22px}.auth-brand{display:flex;gap:14px;align-items:center}.auth-brand img{width:54px}.auth-brand h1{margin:0}.auth-brand p{margin:3px 0;color:#aaa}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;margin:18px 0 12px}.auth-tabs button{padding:10px;border:0;background:#292929;color:#aaa}.auth-tabs button.active{background:#512da8;color:#fff}.auth-form{display:none;gap:10px}.auth-form.active{display:grid}.auth-form label{display:grid;gap:5px;color:#ccc;font-size:13px}.auth-form input,.auth-form select{padding:10px;background:#111;color:#fff;border:1px solid #494949;border-radius:4px}.auth-primary,.auth-secondary{padding:11px;border:0;border-radius:4px}.auth-primary{background:#512da8;color:#fff}.auth-secondary{background:#303030;color:#ddd}.auth-message{min-height:22px;margin-top:8px;color:#f48771}.contact-line{text-align:center;color:#bbb}.prototype-note{font-size:11px;color:#777}.title-user{text-align:right}.title-user button{border:1px solid #444;background:#292929;color:#ddd;padding:4px 10px}.mastery-badge{display:inline-block;margin-left:8px;padding:3px 7px;border-radius:10px;background:#3b2a68;color:#e9e0ff;font-size:11px}.file-row.locked{opacity:.45}.file-row.locked::after{content:"🔒";margin-left:auto}.file-row.in-progress::after{content:attr(data-progress);margin-left:auto;color:#e0c86a}.side-contact{padding:10px 14px;color:#999}.profile-workspace{position:absolute;inset:36px 0 0 0;z-index:25;background:#171717;display:grid;grid-template-rows:54px 1fr}.profile-header{display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid #333;background:#202020}.profile-header>div{display:flex;gap:12px}.profile-header span{color:#999;font-size:12px}.profile-header button{border:0;background:transparent;color:#aaa;font-size:24px}.profile-scroll{overflow:auto;padding:18px}.profile-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}.summary-card,.course-card{background:#242424;border:1px solid #383838;border-radius:8px;padding:13px}.summary-card strong{display:block;font-size:22px}.summary-card span{color:#999;font-size:12px}.course-progress-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}.course-card h4{margin:0 0 8px}.progress-track{height:8px;background:#111;border-radius:8px;overflow:hidden}.progress-fill{height:100%;background:#6f4cc3}.course-card small{display:block;margin-top:6px;color:#999}.history-list{display:grid;gap:6px}.history-item{display:grid;grid-template-columns:150px 130px 1fr;gap:10px;padding:9px;background:#222;border-left:3px solid #512da8;font-size:12px}.history-item time{color:#999}.profile-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.profile-actions button{padding:9px;border:1px solid #444;background:#2b2b2b;color:#eee}@media(max-width:760px){.history-item{grid-template-columns:1fr}.auth-card{padding:16px}}

/* PSF-Treino v6 — carregamento compacto e ajuste automático */
.workbench{grid-template-columns:48px 270px 6px 1fr}
.vertical-resizer{width:6px;touch-action:none}
.horizontal-resizer{height:6px;touch-action:none}
.main{--terminal-height:145px;grid-template-rows:36px 45px minmax(260px,1fr) 6px var(--terminal-height)}
.tabs-shell{position:relative;min-height:36px}
.tabs{align-items:stretch;scroll-behavior:smooth}
.tab{flex:1 1 170px;min-width:92px;max-width:230px;resize:none;transition:min-width .16s,max-width .16s,opacity .16s}
.tab-tools{display:flex;flex:none;border-left:1px solid var(--border)}
.tab-action{height:35px;flex:none}
.main.tabs-collapsed{grid-template-rows:8px 45px minmax(260px,1fr) 6px var(--terminal-height)}
.main.tabs-collapsed .tabs{display:none}
.main.tabs-collapsed .tabs-shell{min-height:8px;height:8px;overflow:visible;border-bottom:1px solid #333}
.main.tabs-collapsed .tab-tools{position:absolute;right:0;top:7px;z-index:12;background:#181818;border:1px solid #333}
.main.tabs-collapsed .tab-tools button:not(#collapseTabsButton){display:none}
.main.tabs-collapsed #collapseTabsButton{height:25px;width:30px}
#practiceEditor.accepted{opacity:.72;cursor:not-allowed}
.group-row>span:last-child,.language-row>span:last-child,.file-row>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-row{padding-right:7px}

@media(max-width:1100px){
 .workbench{grid-template-columns:44px 225px 6px 1fr}
 .tab{flex-basis:135px;min-width:82px;max-width:180px}
}
@media(max-width:760px){
 .workbench{grid-template-columns:44px 1fr}
 .main{--terminal-height:110px;grid-template-rows:36px auto minmax(260px,1fr) 6px var(--terminal-height)}
 .main.tabs-collapsed{grid-template-rows:8px auto minmax(260px,1fr) 6px var(--terminal-height)}
 .tab{flex:0 1 128px;min-width:78px;max-width:155px}
 .tab-tools{position:sticky;right:0;background:#181818}
}


/* PSF-Treino v7 — aplicação única e caderno matemático ampliado */
.admin-workspace{position:absolute;inset:36px 0 0 0;z-index:28;background:#151922;display:grid;grid-template-rows:54px 1fr}
.admin-scroll{overflow:auto;padding:18px}.admin-gate{display:grid;place-items:center;min-height:70%}.admin-auth-box{display:grid;gap:9px;width:min(460px,95%);padding:18px;background:#202735;border:1px solid #354158;border-radius:10px}.admin-auth-box input{padding:10px;background:#111827;color:#fff;border:1px solid #46536a}.admin-auth-box button,.admin-tools button{padding:9px;border:1px solid #51407e;background:#512da8;color:#fff}.admin-tools{display:flex;flex-wrap:wrap;gap:8px;margin:15px 0}.admin-tools input{flex:1;min-width:240px;padding:9px;background:#101522;color:#fff;border:1px solid #39465e}.admin-table-wrap{overflow:auto;border:1px solid #354158}.admin-table-wrap table{width:100%;border-collapse:collapse;min-width:1050px;background:#1b2230}.admin-table-wrap th,.admin-table-wrap td{padding:9px;border-bottom:1px solid #354158;text-align:left;font-size:12px}.admin-table-wrap th{position:sticky;top:0;background:#263248}.admin-table-wrap tr:hover td{background:#222d40}.admin-detail{margin-top:15px;padding:14px;border:1px solid #354158;background:#1b2230}.math-mode .code-view,.math-mode #practiceEditor{font-size:15px;line-height:26px}.math-mode .code-shell{background-size:100% 26px,100% 100%}.paper-section-note{color:#7865a8}
@media(max-width:760px){.admin-workspace{inset:36px 0 0 0}.admin-scroll{padding:10px}.admin-tools{display:grid}.admin-tools input{min-width:0}}
