:root{--bg:#0c1110;--panel:#121917;--panel2:#18211e;--line:#293631;--text:#eef5f1;--muted:#91a099;--green:#23a36d;--green2:#16784f;--accent:#e46b2e;--danger:#ef5350;--blue:#4d8dff}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden}body{font:13px Inter,Arial,sans-serif;background:var(--bg);color:var(--text)}button,input,select,textarea{font:inherit}button{cursor:pointer;color:inherit}.topbar{height:62px;background:#101714;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 16px;position:relative;z-index:20}.brand{display:flex;gap:10px;align-items:center}.brandmark{width:38px;height:38px;border-radius:10px;background:#193c2d;color:#59d69a;display:grid;place-items:center}.brandmark svg{width:21px}.brand b{display:block;font-size:16px;letter-spacing:1px}.brand small{color:var(--muted)}.top-actions{display:flex;gap:7px}.top-actions button,.workspacebar button,.layer-actions button{height:34px;border:1px solid var(--line);border-radius:8px;background:#17201d;padding:0 10px;display:flex;align-items:center;gap:6px}.top-actions svg,.workspacebar svg,.layer-actions svg{width:15px}.primary{background:var(--green2)!important;border-color:var(--green)!important;color:white!important}.shell{height:calc(100vh - 62px);display:grid;grid-template-columns:76px 300px minmax(460px,1fr) 310px}.tools{background:#0f1614;border-right:1px solid var(--line);padding:10px 7px;overflow:auto}.tools button{width:100%;border:0;background:transparent;border-radius:9px;color:#aab8b1;padding:9px 2px;margin-bottom:4px;display:grid;place-items:center;gap:4px}.tools button:hover,.tools button.active{background:#1b2b25;color:#65dba0}.tools svg{width:19px}.tools span{font-size:9px}.panel{background:var(--panel);overflow:auto}.left-panel{border-right:1px solid var(--line)}.right-panel{border-left:1px solid var(--line)}.panel-title{padding:16px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between}.panel-title h2{font-size:16px;margin:0}.panel-title small{color:var(--muted)}.panel-title svg{width:18px;color:#5fd49a}.section{padding:14px;border-bottom:1px solid var(--line)}.section h3{font-size:11px;text-transform:uppercase;letter-spacing:.7px;color:#a9b6b0;margin:0 0 12px}.field{display:block;margin:10px 0;color:#b7c2bd;font-size:11px}.field input,.field select,.field textarea,.save-row input,.form-grid input,.form-grid select{width:100%;margin-top:5px;border:1px solid #34443e;background:#0e1513;color:var(--text);border-radius:7px;padding:8px}.field input[type=color]{height:36px;padding:3px}.field input[type=range]{padding:0;accent-color:var(--green)}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}.insert-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.insert-grid button,.insert-btn{min-height:38px;border:1px solid #31413b;background:#18221f;border-radius:8px;color:#dbe7e1;padding:8px;display:flex;align-items:center;justify-content:center;gap:6px}.insert-grid button:hover,.insert-btn:hover{border-color:#3e8c67;background:#1c2c26}.insert-grid svg,.insert-btn svg{width:15px}.icon-search{width:100%;height:36px;border:1px solid #34443e;background:#0e1513;color:white;border-radius:7px;padding:0 9px;margin-bottom:8px}.icon-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;max-height:300px;overflow:auto}.icon-grid button{aspect-ratio:1;border:1px solid #2d3b36;background:#151e1b;border-radius:7px;color:#cbd7d1}.icon-grid button:hover{color:#63d99d;border-color:#3d8e68}.icon-grid svg{width:18px}.workspace{min-width:0;min-height:0;display:grid;grid-template-rows:48px 1fr 28px;background:#090d0c}.workspacebar{background:#111815;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 12px}.measure,.view-actions{display:flex;align-items:center;gap:6px}.measure label{color:var(--muted);font-size:10px}.measure input{width:62px;background:#0d1311;border:1px solid #32413c;color:white;border-radius:6px;padding:6px}.workspacebar button.active{border-color:#3f956c;color:#64d99e}.viewport{position:relative;min-width:0;min-height:0;overflow:scroll;background-color:#0b100e;background-image:linear-gradient(#17201d 1px,transparent 1px),linear-gradient(90deg,#17201d 1px,transparent 1px);background-size:20px 20px;cursor:default}.viewport.panning{cursor:grabbing}.viewport[data-tool="text"],.viewport[data-tool="line"],.viewport[data-tool="path"]{cursor:crosshair}#stage{position:relative;transform-origin:0 0;min-width:100%;min-height:100%}#canvas{display:block;position:absolute;left:40px;top:40px;background:white;box-shadow:0 12px 45px #0008;overflow:visible;touch-action:none}.statusbar{display:flex;align-items:center;justify-content:space-between;padding:0 10px;color:#7f9188;background:#101613;border-top:1px solid var(--line);font-size:10px}.tabs{height:44px;display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line)}.tabs button{border:0;background:transparent;color:#899991}.tabs button.active{color:#65dba0;border-bottom:2px solid var(--green)}.tabpage{padding:12px}.empty{padding:25px 10px;text-align:center;color:#718079}.prop-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.prop-title b{font-size:14px}.prop-title small{color:var(--muted)}.prop-actions{display:flex;gap:5px;margin:10px 0}.prop-actions button{flex:1;height:34px;border:1px solid #33433d;background:#17201d;border-radius:7px}.prop-actions .danger{color:#ff7773}.layers-list{display:grid;gap:5px}.layer{display:grid;grid-template-columns:22px 1fr auto;gap:6px;align-items:center;padding:7px;border:1px solid #293833;border-radius:7px;background:#151d1a}.layer.selected{border-color:#3d9b6d;background:#1b2b25}.layer .drag{cursor:grab;color:#687871}.layer-name{min-width:0}.layer-name b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px}.layer-name small{color:#72827a;font-size:9px}.layer-controls{display:flex}.layer-controls button{width:26px;height:26px;border:0;background:transparent;color:#87978f;padding:4px}.layer-controls svg{width:14px}.layer-actions{display:flex;gap:6px;margin-bottom:10px}.layer-actions button{flex:1;font-size:10px}.modal[hidden]{display:none}.modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center}.backdrop{position:absolute;inset:0;background:#000a}.dialog{position:relative;width:min(650px,92vw);max-height:82vh;overflow:auto;background:#121a17;border:1px solid #35453f;border-radius:13px;box-shadow:0 25px 80px #000b}.dialog header{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid var(--line)}.dialog header b,.dialog header small{display:block}.dialog header small{color:var(--muted);font-size:10px}.dialog header button{border:0;background:transparent}.save-row{display:grid;grid-template-columns:1fr auto;gap:8px;padding:14px}.save-row input{margin:0}.save-row button{border:1px solid var(--green);border-radius:7px;padding:0 14px}.project-row{display:flex;justify-content:space-between;align-items:center;padding:11px 14px;border-top:1px solid #26332e}.project-row small{display:block;color:var(--muted);font-size:9px}.project-row button{border:1px solid #34443e;background:#18211e;border-radius:6px;padding:6px;margin-left:4px}.form-grid{padding:15px;display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-grid label{font-size:11px;color:#b8c4be}.form-grid input,.form-grid select{margin-top:6px}.form-grid .check{display:flex;align-items:center;gap:8px}.form-grid .check input{width:auto;margin:0}.full{width:calc(100% - 30px);margin:0 15px 15px;height:42px;border:0;border-radius:8px}.crop-mark{stroke:#111;stroke-width:.25;vector-effect:non-scaling-stroke}.guide-bleed{fill:none;stroke:#e44949;stroke-width:.35;stroke-dasharray:2 2;pointer-events:none}.guide-safe{fill:none;stroke:#27a86f;stroke-width:.35;stroke-dasharray:2 2;pointer-events:none}.selection-rect{fill:none;stroke:#287cff;stroke-width:.6;stroke-dasharray:2 1;vector-effect:non-scaling-stroke;pointer-events:none}.handle{fill:#fff;stroke:#287cff;stroke-width:.5;vector-effect:non-scaling-stroke}.node{fill:#fff;stroke:#e35c2e;stroke-width:.7;vector-effect:non-scaling-stroke;cursor:move}.design-item{cursor:move}.locked{cursor:not-allowed}.hidden-layer{opacity:.25}.badge{font-size:9px;color:#6bd69f;background:#183526;border:1px solid #27533e;border-radius:20px;padding:2px 6px}@media(max-width:1100px){.shell{grid-template-columns:64px 260px minmax(400px,1fr)}.right-panel{position:fixed;right:0;top:62px;bottom:0;width:300px;z-index:15;box-shadow:-10px 0 30px #0008}.tools span{display:none}.tools button{padding:11px}}@media(max-width:760px){.shell{grid-template-columns:58px 1fr}.left-panel{display:none}.right-panel{width:min(310px,82vw)}.top-actions button{font-size:0}.top-actions button svg{margin:0}.brand small{display:none}.workspacebar .measure{display:none}}
.handle{pointer-events:all;touch-action:none}
.handle[data-resize="nw"],.handle[data-resize="se"]{cursor:nwse-resize}
.handle[data-resize="ne"],.handle[data-resize="sw"]{cursor:nesw-resize}
.handle[data-resize="n"],.handle[data-resize="s"]{cursor:ns-resize}
.handle[data-resize="e"],.handle[data-resize="w"]{cursor:ew-resize}
.project-section-title{padding:10px 14px 6px;color:#6bd69f;font-size:10px;font-weight:800;letter-spacing:.7px;border-top:1px solid #26332e}
.reference-project{background:#17231f;border-left:3px solid var(--green)}
.reference-project button{display:inline-flex;align-items:center;gap:6px}
.reference-project button svg{width:14px}

/* UX zoom/seleção */
.handle{stroke-width:.35;vector-effect:non-scaling-stroke}
.viewport{scrollbar-gutter:stable both-edges;overscroll-behavior:contain}

/* Workspace: rolagem bidirecional permanente */
.viewport{
  scrollbar-gutter: stable;
  scrollbar-width: auto;
  scrollbar-color: #66716d #252b29;
}
.viewport::-webkit-scrollbar{
  width: 13px;
  height: 13px;
}
.viewport::-webkit-scrollbar-track{
  background: #252b29;
}
.viewport::-webkit-scrollbar-thumb{
  background: #66716d;
  border: 3px solid #252b29;
  border-radius: 8px;
}
.viewport::-webkit-scrollbar-thumb:hover{
  background: #7d8984;
}
.viewport::-webkit-scrollbar-corner{
  background: #252b29;
}

/* Selos e formas expandidos */
.shape-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.shape-grid button{min-height:40px;font-size:11px;line-height:1.15;padding:7px}
.shape-tip{font-size:10px;line-height:1.4;color:#85958e;margin:10px 0}
.cut-note{padding:9px 10px;border:1px solid #5a3a56;background:#241822;color:#d7b8d1;border-radius:8px;font-size:10px;line-height:1.4;margin-top:8px}

/* Login e configurações administrativas */
.top-link-btn{height:34px;border:1px solid var(--line);border-radius:8px;background:#17201d;padding:0 10px;display:flex;align-items:center;gap:6px;color:var(--text);text-decoration:none}
.top-link-btn:hover{border-color:#3e8c67;background:#1c2c26}
.top-link-btn svg{width:15px}
.login-page{min-height:100vh;overflow:auto;background:
 radial-gradient(circle at 15% 20%,rgba(35,163,109,.11),transparent 30%),
 linear-gradient(135deg,#0b100e,#111a17)}
.login-shell{min-height:100vh;display:grid;place-items:center;padding:24px}
.login-card{width:min(430px,100%);background:#111916;border:1px solid #293a33;border-radius:18px;padding:32px;box-shadow:0 24px 70px rgba(0,0,0,.32)}
.login-brandmark{width:46px;height:46px;border-radius:12px;background:#173c2c;color:#68dda3;display:grid;place-items:center;font-size:21px;font-weight:800;margin-bottom:12px}
.login-brand{display:flex;flex-direction:column;margin-bottom:26px}.login-brand strong{font-size:18px;letter-spacing:1.4px}.login-brand span{font-size:11px;color:var(--muted);margin-top:3px}
.login-card h1{font-size:22px;margin:0 0 7px}.login-card>p{color:#9aa9a2;line-height:1.5;margin:0 0 22px}
.login-card form label,.settings-form label{display:block;font-size:11px;color:#b8c4be;margin:13px 0}
.login-card form input,.settings-form input{width:100%;height:42px;margin-top:6px;border:1px solid #34443e;background:#0d1412;color:#f3f7f5;border-radius:9px;padding:0 11px;outline:none}
.login-card form input:focus,.settings-form input:focus{border-color:#2da873;box-shadow:0 0 0 3px rgba(35,163,109,.12)}
.login-submit{width:100%;height:44px;border:1px solid var(--green);border-radius:9px;margin-top:7px;font-weight:700}
.login-note{display:block;color:#7f8f87;line-height:1.5;margin-top:18px}
.login-alert,.settings-message{border:1px solid #6c403d;background:#271817;color:#ffb4ae;padding:10px 12px;border-radius:8px;font-size:11px;line-height:1.4;margin:12px 0}
.settings-dialog{max-width:470px}.settings-form{padding:4px 16px 16px}.settings-message{margin:0 16px 16px}

.settings-section-title{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:#63d99d;margin:18px 0 7px;padding-top:10px;border-top:1px solid #293631}
.settings-section-title:first-child{margin-top:5px;border-top:0}
.settings-form select,.settings-inline select{width:100%;height:40px;margin-top:6px;border:1px solid #34443e;background:#0d1412;color:#f3f7f5;border-radius:9px;padding:0 10px}
.settings-tools{padding:0 16px 18px}.settings-action-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.settings-action-grid button,.settings-tools>button{min-height:38px;border:1px solid #31413b;background:#18221f;border-radius:8px;color:#dbe7e1;padding:8px;display:flex;align-items:center;justify-content:center;gap:6px}
.settings-action-grid svg,.settings-tools>button svg{width:15px}.settings-inline{display:block;margin:14px 0 5px;font-size:11px;color:#b8c4be}
.settings-help{font-size:10px;line-height:1.45;color:#819088;margin:7px 0 12px}
.settings-dialog{max-height:88vh;overflow:auto}

/* Fluxo Novo Projeto */
.new-project-dialog{max-width:620px}
.new-project-body{padding:6px 16px 18px}
.project-start-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0 16px}
.project-start-card{position:relative;border:1px solid #31413b;background:#131c19;border-radius:11px;padding:14px;cursor:pointer;display:grid;grid-template-columns:36px 1fr;column-gap:10px;align-items:center;transition:.18s}
.project-start-card:hover{border-color:#46725f;background:#17231f}
.project-start-card.active{border-color:#2fb176;background:#172a23;box-shadow:0 0 0 2px rgba(47,177,118,.08)}
.project-start-card input{position:absolute;opacity:0;pointer-events:none}
.project-start-card .start-icon{width:34px;height:34px;border-radius:8px;background:#1d3028;color:#63d99d;display:grid;place-items:center;grid-row:1/3}
.project-start-card .start-icon svg{width:18px}
.project-start-card b{font-size:12px}.project-start-card small{color:#84948c;line-height:1.35;margin-top:3px}
@media(max-width:700px){.project-start-options{grid-template-columns:1fr}}

.saved-models-list{max-height:190px;overflow:auto;border:1px solid #293832;border-radius:10px;margin:8px 0 14px}
.saved-model-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid #26342f;cursor:pointer;background:#111a17}
.saved-model-row:last-child{border-bottom:0}.saved-model-row:hover{background:#17231f}.saved-model-row.active{background:#183026;box-shadow:inset 3px 0 #35c982}
.saved-model-row input{accent-color:#35c982}.saved-model-row span{display:flex;flex-direction:column;flex:1}.saved-model-row b{font-size:11px}.saved-model-row small{font-size:9px;color:#82928a;margin-top:2px}.saved-model-row svg{width:15px;color:#63d99d}

/* Seleção por área (marquee), padrão de editores gráficos */
.marquee-rect{
  fill:rgba(77,141,255,.10);
  stroke:#4d8dff;
  stroke-width:.45;
  stroke-dasharray:1.6 1;
  vector-effect:non-scaling-stroke;
  pointer-events:none;
}

/* Gerar A3 */
.a3-dialog{width:min(1180px,94vw);max-width:none;height:min(840px,92vh);display:flex;flex-direction:column}
.a3-layout{display:grid;grid-template-columns:320px 1fr;gap:0;min-height:0;flex:1}
.a3-controls{padding:14px 16px;border-right:1px solid var(--line);overflow:auto}
.a3-preview-wrap{background:#090d0c;padding:18px;overflow:auto;display:grid;place-items:start center}
.a3-preview{position:relative;width:min(560px,90%);aspect-ratio:297/420;background:white;box-shadow:0 12px 38px rgba(0,0,0,.4);flex:none}
.a3-tile{position:absolute;box-sizing:border-box}
.a3-tile img{width:100%;height:100%;display:block;object-fit:fill}
.a3-tile.with-crops:before,.a3-tile.with-crops:after{content:"";position:absolute;pointer-events:none}
.a3-tile.with-crops:before{inset:-2px;border-top:1px solid rgba(0,0,0,.5);border-bottom:1px solid rgba(0,0,0,.5)}
.a3-tile.with-crops:after{inset:-2px;border-left:1px solid rgba(0,0,0,.5);border-right:1px solid rgba(0,0,0,.5)}
.a3-summary{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:14px 0}
.a3-summary>div{border:1px solid #2b3b35;background:#101714;border-radius:8px;padding:9px}
.a3-summary span{display:block;color:#82918a;font-size:9px;text-transform:uppercase;letter-spacing:.55px}.a3-summary b{display:block;margin-top:3px;font-size:12px}
.a3-production-note{font-size:10px;line-height:1.45;color:#92a19a;background:#0f1714;border:1px solid #293832;border-radius:8px;padding:10px;margin-bottom:12px}
.a3-check{display:flex!important;align-items:center;gap:7px;margin:10px 0!important}
.a3-empty{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:20px;color:#777;font-size:12px}
@media(max-width:850px){.a3-dialog{height:94vh}.a3-layout{grid-template-columns:1fr}.a3-controls{border-right:0;border-bottom:1px solid var(--line);max-height:330px}.a3-preview{width:min(420px,92%)}} 

.project-name-wrap{min-width:0;flex:1}
.project-rename-inline{display:flex;gap:6px;align-items:center;min-width:360px}
.project-rename-inline input{min-width:180px;flex:1;height:32px}
.project-rename-inline button{white-space:nowrap}
@media(max-width:700px){.project-rename-inline{min-width:0;flex-wrap:wrap}.project-rename-inline input{flex-basis:100%}}

/* Biblioteca de ícones ampliada */
.icon-library-section{padding:14px 12px 10px;display:flex;flex-direction:column;min-height:calc(100vh - 135px)}
.icon-library-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
.icon-library-head h3{margin:0}.icon-library-head .badge{white-space:nowrap}
.icon-categories{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:0 0 9px}
.icon-cat{min-width:0;height:32px;border:1px solid #2d3b36;background:#151e1b;border-radius:7px;color:#afbeb7;padding:0 7px;display:grid;grid-template-columns:16px 1fr auto;align-items:center;gap:5px;text-align:left}
.icon-cat:hover,.icon-cat.active{border-color:#3d8e68;background:#1a2b25;color:#69dda3}
.icon-cat svg{width:14px;height:14px}.icon-cat span{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.icon-cat small{font-size:8px;color:#789087}
.icon-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;height:calc(100vh - 350px);min-height:360px;max-height:none;overflow-y:auto;overflow-x:hidden;padding-right:3px;align-content:start}
.icon-grid button{min-width:0;aspect-ratio:1;border-radius:8px}.icon-grid svg{width:20px;height:20px}
.icon-empty{grid-column:1/-1;color:#718079;text-align:center;padding:28px 8px;font-size:11px}
@media(min-width:1200px){.shell{grid-template-columns:76px 350px minmax(460px,1fr) 310px}.icon-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:1100px){.icon-library-section{min-height:calc(100vh - 130px)}.icon-grid{height:calc(100vh - 345px);min-height:300px}}


/* Acesso da equipe */
.team-register{margin-top:18px;border-top:1px solid var(--border,#273142);padding-top:16px}
.team-register summary{cursor:pointer;font-weight:700;color:#d9e2ef;list-style:none;display:flex;align-items:center;justify-content:center;gap:8px}
.team-register summary::-webkit-details-marker{display:none}
.team-register summary::before{content:'+';font-size:18px;color:#34d399}
.team-register[open] summary::before{content:'–'}
.team-register>p{font-size:12px;color:#8f9bad;text-align:center;margin:10px 0 12px}
.login-team-submit{width:100%;margin-top:4px;background:#17202d;border:1px solid #344156;color:#e7edf5;font-weight:700}
.login-alert.success{border-color:rgba(52,211,153,.35);background:rgba(52,211,153,.09);color:#a7f3d0}
.user-role-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid #2c3647;border-radius:9px;background:#171d27;color:#aeb9ca;font-size:11px;white-space:nowrap}
.user-role-chip svg{width:14px;height:14px;color:#34d399}
.team-admin{margin-top:16px}
.team-user-list{display:grid;gap:8px;margin-top:8px}
.team-user-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid #2a3445;border-radius:10px;background:#151b25}
.team-user-row>div{min-width:0;display:flex;flex-direction:column;gap:3px}
.team-user-row b{font-size:12px;color:#edf2f7}
.team-user-row small{font-size:10px;color:#8491a3}
.team-user-row form{margin:0;display:flex;justify-content:flex-end}
.team-user-row button{display:inline-flex;align-items:center;gap:6px;padding:7px 10px}
.team-user-row button svg{width:14px;height:14px}
@media(max-width:1100px){.user-role-chip{display:none}}

