:root{font-family:"Segoe UI",system-ui,sans-serif;color:#233d37;background:#f5f5ef;font-synthesis:none;--ink:#193e36;--muted:#6c7b75;--green:#1e6550;--line:#dfe4db;--paper:#fff;--accent:#e9a47e}*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button,a,input,textarea,select{outline-offset:4px}button{cursor:pointer;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:8px;padding:10px 15px;font-weight:600;transition:background .15s}button:hover{background:#e9efe7}button:disabled{opacity:.55;cursor:wait}.primary{background:var(--green);border-color:var(--green);color:#fff}.primary:hover{background:#184d40}.danger{color:#ae3c35}.small{font-size:12px;padding:7px 10px}.quiet{background:transparent;border-color:transparent}a{color:var(--green)}h1,h2,h3,p{margin-top:0}h1{font-size:32px;letter-spacing:-1px;font-weight:650;margin-bottom:8px}h2{font-size:21px;letter-spacing:-.4px}h3{font-size:16px}p{line-height:1.65}small,.muted{color:var(--muted)}.eyebrow{font-size:11px;letter-spacing:1.8px;font-weight:700;text-transform:uppercase;color:#7d8f7c}.shell{display:grid;grid-template-columns:235px minmax(0,1fr);min-height:100vh}.sidebar{background:#173f37;color:#d5e4d7;padding:30px 20px;position:fixed;inset:0 auto 0 0;width:235px;display:flex;flex-direction:column;z-index:5}.brand{font-size:31px;letter-spacing:-1.7px;color:#fff;font-weight:700;display:flex;align-items:center;gap:11px;margin:0 12px 8px}.brand-mark{display:grid;grid-template-columns:repeat(2,9px);gap:3px;transform:rotate(-8deg)}.brand-mark i{width:9px;height:9px;background:#c3d884;border-radius:3px}.brand-mark i:last-child{background:#e8ab85}.tagline{font-size:10px;letter-spacing:2px;color:#9ebbae;margin:0 12px 40px}.nav{display:flex;flex-direction:column;gap:4px}.nav button{background:transparent;border:none;text-align:left;color:#b6cec1;font-weight:450;padding:12px 15px;display:flex;gap:14px;align-items:center}.nav button.active{background:#31584b;color:#fff}.nav button:hover{background:#274e44}.nav svg{width:18px;height:18px}.nav-divider{height:1px;background:#356054;margin:18px 12px}.sidebar-bottom{margin-top:auto;padding:24px 12px 0;font-size:12px;color:#b6cec1}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#b4d789;margin-right:6px}.workspace{grid-column:2;padding:0 40px 40px;min-width:0}.topbar{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);margin-bottom:32px;font-size:12px;color:#7a887c}.topbar .actions{gap:10px}.avatar{background:#e0e7d7;width:33px;height:33px;border-radius:50%;display:grid;place-items:center;color:var(--green);font-weight:700}.pagehead{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:26px}.pagehead p{color:var(--muted);margin:0;font-size:14px}.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.hero{position:relative;background:#e9eddd;border:1px solid #dde4cf;padding:28px 30px;border-radius:13px;display:flex;justify-content:space-between;gap:30px;margin:25px 0;overflow:hidden}.hero h2{font-size:27px;font-weight:500;margin:10px 0}.hero p{font-size:13px;color:#627362;max-width:440px;margin-bottom:22px}.hero-art{width:180px;flex-shrink:0;position:relative;display:grid;place-items:center}.art-card{width:110px;height:125px;transform:rotate(12deg);background:#fafbf4;border-radius:8px;border:1px solid #c4cead;box-shadow:-19px 14px 0 #d4ddc4;display:grid;place-items:center}.art-card span{font-size:56px;color:#d78e62}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:20px 0 28px}.stat{padding:22px;border:1px solid var(--line);border-radius:11px;background:#fff}.stat label{font-size:12px;color:var(--muted);display:block}.stat strong{font-size:33px;font-weight:550;display:block;margin:9px 0}.stat small{font-size:11px}.two{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,1fr);gap:24px}.panel{background:#fff;border:1px solid var(--line);border-radius:12px;padding:23px;margin-bottom:22px;min-width:0}.panelhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;gap:10px}.panelhead h2{margin:0;font-size:17px}.empty{text-align:center;padding:45px 20px;color:#7b897d;border:1px dashed #d8dfd2;border-radius:10px;background:#fafbf6}.empty strong{display:block;color:#506c5c;margin-bottom:7px;font-size:15px}.empty p{font-size:13px;margin:0}.toolbar{display:flex;align-items:center;gap:10px;margin:20px 0;flex-wrap:wrap}.toolbar input{max-width:330px;flex:1}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px}.card{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:transform .15s,box-shadow .15s}.card:hover{transform:translateY(-2px);box-shadow:0 7px 20px #153e360a}.card-body{padding:19px}.card h3{margin:13px 0 8px;overflow-wrap:anywhere}.card p{font-size:12px;color:var(--muted);line-height:1.65;white-space:pre-line;max-height:60px;overflow:hidden}.card-footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #eef0e8;padding-top:13px;margin-top:15px}.card img{width:100%;height:170px;object-fit:cover;object-position:top center;background:#eff2e8;display:block}.file-placeholder{height:120px;background:linear-gradient(135deg,#e8ecdc,#dce5d8);display:grid;place-items:center;color:#698267;font-size:30px}.badge{display:inline-block;padding:5px 9px;border-radius:5px;background:#e9efe4;color:#526a4b;font-size:10px;font-weight:600;letter-spacing:.2px}.badge.warn{background:#fbecdb;color:#9b6738}.badge.rose{background:#f6e5e1;color:#a46155}.tags{display:flex;gap:5px;flex-wrap:wrap;margin-top:10px}.tag{font-size:10px;color:#7b8a77;background:#f3f5ee;border-radius:4px;padding:3px 6px}.list-row{display:flex;gap:15px;padding:15px 0;border-bottom:1px solid #edf0e6;align-items:center}.list-row:last-child{border-bottom:0}.list-row .grow{flex:1;min-width:0}.list-row strong{font-size:13px;display:block;margin-bottom:5px}.list-row small{font-size:11px}.datebox{width:43px;height:46px;background:#f0f3e8;border-radius:7px;display:grid;place-items:center;font-size:18px;font-weight:550}.datebox small{font-size:9px}.media-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.media-strip img{width:100%;height:100px;object-fit:cover;object-position:top center;border-radius:7px}.media-strip small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:6px;font-size:11px}.note{padding:14px 16px;border-radius:8px;background:#f1f4e8;color:#657354;font-size:12px;line-height:1.7}.error{background:#ffefeb;color:#a53b31;padding:14px;border-radius:8px}.loading{padding:70px;text-align:center;color:#7e8d79}.kanban{display:flex;gap:14px;overflow:auto;align-items:flex-start;padding-bottom:20px}.column{min-width:235px;width:235px;background:#ecefe5;border-radius:10px;padding:12px}.column h3{font-size:12px;padding:6px}.column .card{margin-bottom:12px}.column .card-body{padding:13px}.tablewrap{overflow-x:auto}table{width:100%;border-collapse:collapse;background:#fff;font-size:12px}td,th{text-align:left;padding:14px 12px;border-bottom:1px solid var(--line)}th{color:#7d8978;font-weight:500;font-size:11px}input,textarea,select{width:100%;border:1px solid #d7dfd2;background:#fff;color:#233d37;border-radius:7px;padding:10px 12px;min-height:40px}textarea{min-height:100px;resize:vertical;line-height:1.55}label.field{display:flex;flex-direction:column;gap:7px;font-size:12px;color:#62745e;font-weight:550;margin-bottom:16px}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.full{grid-column:1/-1}.field input[type=checkbox]{width:18px;min-height:18px}.field select[multiple]{height:115px}.formhelp{font-size:11px;font-weight:400;color:#85917e}dialog{border:1px solid #d9e1d0;border-radius:14px;max-width:920px;width:calc(100% - 40px);max-height:90vh;padding:0;color:var(--ink);box-shadow:0 20px 100px #10231e33}dialog::backdrop{background:#14332d66;backdrop-filter:blur(3px)}.modalhead{position:sticky;top:0;background:#fff;padding:22px 26px;display:flex;justify-content:space-between;gap:18px;border-bottom:1px solid var(--line);z-index:2}.modalhead h2{margin:0;font-size:20px}.modalbody{padding:25px}.modalfoot{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.detailtext{white-space:pre-wrap;font-size:13px;line-height:1.7;overflow-wrap:anywhere}.detail-media{max-width:100%;max-height:420px;display:block;margin:0 auto;border-radius:7px;object-position:top center}.safe-frame{position:relative;background:#151f1b;border-radius:8px;padding:12px;display:flex;justify-content:center;align-items:flex-start}.safe-frame:after{content:'Área segura sugerida • revise no destino';position:absolute;inset:10% 8%;border:1px dashed #fff9;pointer-events:none;color:#fff;font-size:10px;text-shadow:0 1px 4px #000;padding:5px}.thumb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}.thumb-grid img{width:100%;height:130px;object-fit:contain;object-position:top center;background:#edf0e6}.calendar{display:grid;grid-template-columns:repeat(7,minmax(100px,1fr));border-left:1px solid var(--line);border-top:1px solid var(--line)}.day{min-height:135px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:9px;background:#fff}.day.outside{background:#f0f2e9}.day.today{background:#f3f6e9}.day strong{font-size:12px;display:block;margin-bottom:10px}.event{display:block;width:100%;text-align:left;background:#e5eddd;border:0;border-left:3px solid #6b8e58;border-radius:4px;font-size:10px;padding:7px;margin:5px 0}.weekday{padding:10px;border-right:1px solid var(--line);background:#e9eee0;color:#738369;text-align:center;font-size:11px}.auth-page{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}.auth-story{background:#173f37;color:#eff4e9;padding:65px 12%;display:flex;flex-direction:column;justify-content:center}.auth-story .brand{margin:0 0 70px}.auth-story h1{font-size:53px;font-weight:450;line-height:1.12;letter-spacing:-2px;max-width:500px}.auth-story p{color:#a6bfb0;font-size:15px;margin-top:20px;max-width:380px}.auth-form{display:flex;align-items:center;justify-content:center;padding:40px}.auth-form form{width:100%;max-width:340px}.auth-form h2{font-size:27px}.auth-form p{font-size:13px;color:#7e8a78;margin-bottom:28px}.auth-form button{width:100%;margin-top:8px;padding:13px}.auth-form small{display:block;text-align:center;margin-top:25px;line-height:1.7}#toast{position:fixed;bottom:25px;right:25px;z-index:30;background:#173f37;color:#fff;padding:15px 22px;border-radius:9px;box-shadow:0 8px 25px #14332d33;max-width:480px;display:none}#toast.show{display:block}.drop-zone{border:2px dashed #cdd8bd;border-radius:10px;padding:27px;text-align:center;background:#f0f4e8;margin:20px 0}.drop-zone.dragover{background:#dce7ce;border-color:#46764a}.progress{height:7px;background:#e4eadd;border-radius:5px;overflow:hidden;margin:10px 0}.progress div{height:100%;background:#78975d}.pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#f3f5ec;padding:18px;font-size:12px;border-radius:7px}.metric-value{font-variant-numeric:tabular-nums}.mobile-brand{display:none}footer{margin-top:35px;font-size:10px;color:#8b9785;display:flex;justify-content:space-between;gap:10px}@media(min-width:1550px){.workspace{padding-left:65px;padding-right:65px}.grid{grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}}@media(max-width:1100px){.sidebar{width:200px;padding:24px 12px}.shell{grid-template-columns:200px minmax(0,1fr)}.workspace{padding:0 24px 24px}.two{grid-template-columns:1fr}.stats{gap:10px}.stat{padding:16px}.hero-art{width:120px}.calendar{min-width:700px}}@media(max-width:700px){.shell{display:block}.sidebar{display:none!important}.brand{font-size:25px;margin:0}.tagline,.sidebar-bottom,.nav-divider,.nav{display:none!important}.workspace{padding:0 16px 25px}.topbar{height:60px;margin-bottom:20px}.pagehead{align-items:flex-start;flex-direction:column}h1{font-size:27px}.hero{padding:22px}.hero-art{display:none}.stats{grid-template-columns:1fr 1fr}.stat strong{font-size:27px}.formgrid{grid-template-columns:1fr}.full{grid-column:1}.auth-page{grid-template-columns:1fr}.auth-story{padding:30px}.auth-story .brand{margin:0 0 25px}.auth-story h1{font-size:34px}.auth-story p{display:none}.auth-form{padding:30px}.modalbody{padding:18px}.modalhead{padding:18px}.media-strip{grid-template-columns:repeat(2,1fr)}}
/* Publication workspace */
.publication-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px;margin:24px 0}.publication-card{border:1px solid var(--line);background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 3px 12px #173f3705}.publication-open{border:0;padding:0;background:none;width:100%;display:block;text-align:left;border-radius:0;font-weight:400}.publication-open:hover{background:#fafff8}.publication-card-cover{position:relative;aspect-ratio:16/9;background:#e4ebdb;overflow:hidden}.publication-card-cover img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .25s}.publication-card:hover .publication-card-cover img{transform:scale(1.025)}.publication-cover-empty{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:linear-gradient(140deg,#dce7d3,#eef0df);color:#729064;min-height:85px}.publication-cover-empty>span{font-size:42px}.publication-cover-empty small{font-size:11px}.publication-status{position:absolute;left:15px;top:15px;background:#fffffff0;color:#375c48;border-radius:6px;padding:6px 10px;font-size:11px;font-weight:600}.publication-card-body{padding:20px}.publication-card-body h2{font-size:19px;line-height:1.4;margin:0 0 10px}.publication-card-body p{font-size:12px;color:#7a8974;line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:41px}.publication-card-bottom{border-top:1px solid #eaf0e2;margin-top:17px;padding-top:14px;display:flex;gap:15px;justify-content:space-between;font-size:10px;color:#768770}.publication-card-bottom span:last-child{color:#245d49;font-weight:600;white-space:nowrap}.publication-top{display:flex;justify-content:space-between;gap:30px;align-items:center;margin-bottom:25px}.publication-top h1{margin-top:10px;overflow-wrap:anywhere}.publication-top-cover{width:175px;flex-shrink:0;border:1px solid var(--line);background:white;border-radius:10px;overflow:hidden}.publication-top-cover>img{width:100%;height:98px;object-fit:cover;object-position:top center;display:block}.publication-top-cover button{font-size:11px;border:0;width:100%;border-radius:0;padding:8px}.studio-bar{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;position:sticky;top:0;z-index:4;padding:14px 0;background:#f5f5eff5;border-bottom:1px solid var(--line);margin-bottom:24px;backdrop-filter:blur(8px)}.studio-bar .muted{font-size:11px}.studio-bar button{font-size:12px}.studio-columns{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(350px,1fr);gap:24px;align-items:start}.studio-writing,.studio-materials{min-width:0}.studio-writing textarea{font-size:13px}.studio-writing .panel{padding:26px}.studio-writing .panelhead h2,.studio-materials .panelhead h2{font-size:17px}.studio-materials>.panel{padding:21px}.studio-materials .actions{gap:6px}.studio-materials .actions button{font-size:11px;padding:8px 10px}.studio-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}.studio-gallery>.empty,.studio-gallery>p{grid-column:1/-1}.studio-gallery .empty{padding:28px 12px}.studio-media-card{min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:9px;background:#fff}.studio-media-preview{padding:0;width:100%;aspect-ratio:16/10;display:flex;align-items:flex-start;justify-content:center;position:relative;background:#edf1e5;border:0;border-radius:0;overflow:hidden}.studio-media-preview img{width:100%;height:100%;object-fit:cover;object-position:top center}.media-empty-icon{font-size:35px;color:#81936d}.media-play{display:grid;place-items:center;position:absolute;inset:calc(50% - 17px) auto auto calc(50% - 17px);width:34px;height:34px;border-radius:50%;background:#173f37ca;color:white;font-size:12px}.studio-media-caption{padding:11px 12px 6px}.studio-media-caption strong{font-size:12px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.studio-media-caption small{font-size:10px;display:block;margin-top:5px;color:#819173}.studio-media-actions{display:flex;gap:3px;flex-wrap:wrap;padding:6px 8px 10px}.studio-media-actions button{font-size:9px;padding:5px 6px;border-color:#e8eee0}.studio-viewer{display:block;max-width:100%;max-height:65vh;object-fit:contain;object-position:top center;margin:0 auto;background:#18251f;border-radius:8px}.youtube-player{width:100%;aspect-ratio:16/9;border:0;border-radius:9px}.reference-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px;margin:22px 0}.reference-grid .studio-media-caption strong{white-space:normal;line-height:1.5}.reference-grid .studio-media-actions:empty{display:none}.button-label{display:inline-block;border:1px solid var(--line);padding:10px 15px;border-radius:8px;cursor:pointer;font-size:13px;font-weight:600}.cover-choice{padding:0;overflow:hidden}.cover-choice img{width:100%;height:110px;object-fit:cover;object-position:top center}.cover-choice span{display:block;padding:10px;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#studio-drop{font-size:12px;padding:18px;margin-bottom:0}#studio-link-viewer>button{display:block;margin:15px auto 0}#studio-link-error{color:#ab4037;font-size:13px;margin:12px 0}#reference-search{max-width:440px}#publication-form select[multiple]{height:95px}
@media(max-width:1150px){.studio-columns{grid-template-columns:1fr}.studio-materials{display:grid;grid-template-columns:1fr 1fr;gap:20px}.studio-materials>.panel{margin-bottom:0}.publication-top h1{font-size:27px}}@media(max-width:700px){.publication-grid{grid-template-columns:1fr}.publication-top{align-items:flex-start;gap:15px}.publication-top-cover{width:105px}.publication-top-cover>img{height:65px;object-position:top center}.publication-top-cover button{font-size:9px}.publication-top h1{font-size:23px}.publication-top p{font-size:12px}.studio-bar{position:static}.studio-bar .actions{gap:5px}.studio-materials{display:block}.studio-materials>.panel{margin-bottom:20px}.studio-writing .panel{padding:20px}.reference-grid{grid-template-columns:1fr 1fr;gap:10px}.studio-gallery{gap:10px}.studio-media-caption{padding:8px}.studio-media-caption strong{font-size:11px}.publication-card-body h2{font-size:19px}}

/* Ordered development stages inside a publication. */
.development-stage{border:1px solid var(--line,#d8ded7);border-radius:16px;padding:20px;margin-top:20px;background:var(--bg,#fafbf8)}
.stage-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.stage-heading .actions button{font-size:12px;padding:6px 10px}
.stage-gallery:empty{display:none}
.stage-picker{max-height:55vh;overflow:auto}
.stage-development>.panelhead{flex-wrap:wrap;gap:12px}
@media(max-width:640px){.development-stage{padding:12px}.stage-add-materials{flex-wrap:wrap}.stage-heading{align-items:flex-start}}
@media(max-width:640px){.development-stage{padding:12px}.stage-add-materials{flex-wrap:wrap}.stage-heading{align-items:flex-start}}

/* Central Redes PWA: instalação, conectividade e atualização controlada. */
.pwa-banner{position:fixed;left:50%;bottom:max(18px,env(safe-area-inset-bottom));z-index:50;transform:translateX(-50%);width:min(620px,calc(100% - 28px));display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 14px 12px 18px;border:1px solid #bad084;border-radius:12px;background:#fff;color:#173f37;box-shadow:0 10px 30px rgba(23,63,55,.18);font-size:13px}.pwa-banner[hidden]{display:none}.pwa-banner button,.pwa-install{min-height:44px}.pwa-banner button{flex-shrink:0;padding:8px 14px;background:#1e6550;color:#fff;border-color:#1e6550}.pwa-install{position:fixed;right:18px;bottom:max(18px,env(safe-area-inset-bottom));z-index:45;padding:10px 16px;border-color:#1e6550;background:#1e6550;color:#fff;box-shadow:0 8px 22px rgba(23,63,55,.2)}.pwa-install[hidden]{display:none}#pwa-offline{border-color:#e6b772;background:#fffaf0}#pwa-ios-help{bottom:max(76px,calc(env(safe-area-inset-bottom) + 76px))}@media(max-width:600px){.pwa-banner{align-items:stretch;flex-direction:column}.pwa-banner button{width:100%}.pwa-install{left:14px;right:14px;width:calc(100% - 28px)}}
.stage-text-block{margin:16px 0;padding:12px;border:1px solid var(--line,#d8ded7);border-radius:12px;background:white}
.stage-block-heading{display:flex;gap:8px;align-items:center;margin-bottom:8px}
.stage-block-heading>input{min-width:0;flex:1;font-weight:600;border-color:transparent}
.stage-block-heading .actions{flex-shrink:0;gap:4px}
.stage-block-heading button{padding:5px 9px}
.stage-add-menu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.stage-add-materials{margin-top:16px}

/* SaaS Auth Tabs & Card */
.auth-card{width:100%;max-width:380px}
.auth-tabs{display:flex;gap:6px;margin-bottom:24px;background:#e5ebe1;padding:4px;border-radius:10px}
.auth-tab{flex:1;border:none;background:transparent;padding:10px;border-radius:7px;font-weight:600;font-size:13px;color:#5a6d60;cursor:pointer;transition:all .15s}
.auth-tab.active{background:#fff;color:var(--ink);box-shadow:0 2px 8px #173f3718}
.auth-tab:hover:not(.active){background:#dbe3d6;color:var(--ink)}
.avatar-btn{display:inline-flex;align-items:center;gap:8px;padding:3px 12px 3px 4px;border-radius:20px;border:1px solid var(--line);background:#fff;cursor:pointer;color:var(--ink);transition:all .15s}
.avatar-btn:hover{background:#edf3eb;border-color:#b9cbb6}

/* Campo de senha com alternador de exibição (olho) */
.password-wrap{position:relative;display:flex;align-items:center;width:100%;box-sizing:border-box}
.password-wrap input{padding-right:44px !important;width:100% !important;box-sizing:border-box}
.auth-form .password-wrap .password-toggle,
.password-wrap .password-toggle,
button.password-toggle{
  position:absolute !important;
  right:6px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:32px !important;
  height:32px !important;
  min-width:32px !important;
  max-width:32px !important;
  min-height:32px !important;
  max-height:32px !important;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:none !important;
  border-radius:6px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  cursor:pointer !important;
  color:#6c7e70 !important;
  transition:color .15s,background .15s !important;
  line-height:1 !important;
  z-index:3 !important;
  box-shadow:none !important;
}

/* Dark theme contrast fixes: authentication and user management. */
:root[data-theme='dark'] .admin-user-card-name {
  color: #f4f4f5;
}

:root[data-theme='dark'] .admin-user-card-email,
:root[data-theme='dark'] .admin-user-card-val {
  color: #c4cbc7;
}

:root[data-theme='dark'] .admin-user-card-lbl {
  color: #82dfc2;
}

:root[data-theme='dark'] .admin-user-card-divider {
  background: rgba(255,255,255,.18);
}

:root[data-theme='dark'] .auth-card {
  background: #0f0f0f;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  padding: 22px;
}

:root[data-theme='dark'] .auth-tabs {
  background: #171917;
  border: 1px solid rgba(255,255,255,.14);
}

:root[data-theme='dark'] .auth-tab {
  background: transparent;
  color: #c8cecb;
}

:root[data-theme='dark'] .auth-tab.active {
  background: #26302d;
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(117,223,189,.24), 0 4px 14px rgba(0,0,0,.32);
}

:root[data-theme='dark'] .auth-tab:hover:not(.active) {
  background: rgba(117,223,189,.10);
  color: #f4f7f5;
}

:root[data-theme='dark'] .auth-form h2 {
  color: #f7f8f7;
}

:root[data-theme='dark'] .auth-form p,
:root[data-theme='dark'] .auth-form small,
:root[data-theme='dark'] .auth-form .formhelp {
  color: #b6bdb9;
}

:root[data-theme='dark'] .auth-form label.field {
  color: #d9dddb;
}

:root[data-theme='dark'] .auth-form input {
  background: #171b19;
  color: #f7f8f7;
  border-color: rgba(255,255,255,.24);
}

:root[data-theme='dark'] .auth-form input::placeholder {
  color: #939c97;
  opacity: 1;
}

:root[data-theme='dark'] .auth-form input:-webkit-autofill,
:root[data-theme='dark'] .auth-form input:-webkit-autofill:hover,
:root[data-theme='dark'] .auth-form input:-webkit-autofill:focus {
  -webkit-text-fill-color: #f7f8f7;
  caret-color: #f7f8f7;
  -webkit-box-shadow: 0 0 0 1000px #171b19 inset;
  border-color: rgba(117,223,189,.48);
}

:root[data-theme='dark'] .auth-form a {
  color: #83e8c8 !important;
}

:root[data-theme='dark'] .auth-form .primary {
  background: #1f745a;
  border-color: #59d3ae;
  color: #ffffff;
}

:root[data-theme='dark'] .auth-form .primary:hover {
  background: #278164;
}

/* Dark card system — solid graphite surfaces inspired by Kasaweb. */
:root[data-theme='dark'] .hub-card,
:root[data-theme='dark'] .publication-card,
:root[data-theme='dark'] .studio-media-card,
:root[data-theme='dark'] .schedule-card,
:root[data-theme='dark'] .admin-kpi-card,
:root[data-theme='dark'] .admin-table-card,
:root[data-theme='dark'] .admin-user-card,
:root[data-theme='dark'] .admin-detail-kpi,
:root[data-theme='dark'] .admin-detail-card,
:root[data-theme='dark'] .module-admin-card,
:root[data-theme='dark'] .google-user-card,
:root[data-theme='dark'] .google-menu-group,
:root[data-theme='dark'] .filter-hub,
:root[data-theme='dark'] .studio-access-panel,
:root[data-theme='dark'] .pub-text-block,
:root[data-theme='dark'] .stage-text-block,
:root[data-theme='dark'] .upload-preview-area,
:root[data-theme='dark'] .qr-result {
  background: #151515;
  color: #f4f4f5;
  border-color: rgba(255,255,255,.13);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 16px 40px rgba(0,0,0,.28);
}

:root[data-theme='dark'] .hub-card:hover,
:root[data-theme='dark'] .publication-card:hover,
:root[data-theme='dark'] .studio-media-card:hover,
:root[data-theme='dark'] .schedule-card:hover,
:root[data-theme='dark'] .admin-kpi-card:hover,
:root[data-theme='dark'] .admin-user-card:hover,
:root[data-theme='dark'] .module-admin-card:hover,
:root[data-theme='dark'] .google-user-card:hover {
  background: #181818;
  border-color: rgba(89,211,174,.48);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 20px 48px rgba(0,0,0,.42);
}

:root[data-theme='dark'] .hub-card-body,
:root[data-theme='dark'] .publication-card-body,
:root[data-theme='dark'] .studio-media-caption,
:root[data-theme='dark'] .studio-media-actions,
:root[data-theme='dark'] .module-admin-body,
:root[data-theme='dark'] .card-body {
  background: transparent;
  color: #f4f4f5;
}

:root[data-theme='dark'] .hub-card-title,
:root[data-theme='dark'] .publication-card-body h2,
:root[data-theme='dark'] .admin-kpi-val,
:root[data-theme='dark'] .admin-detail-card-title,
:root[data-theme='dark'] .admin-user-card strong,
:root[data-theme='dark'] .module-admin-card h3,
:root[data-theme='dark'] .studio-media-caption strong {
  color: #f4f4f5;
}

:root[data-theme='dark'] .hub-card-desc,
:root[data-theme='dark'] .hub-card-subtitle,
:root[data-theme='dark'] .hub-card-meta,
:root[data-theme='dark'] .publication-card-body p,
:root[data-theme='dark'] .publication-card-bottom,
:root[data-theme='dark'] .admin-kpi-title,
:root[data-theme='dark'] .admin-kpi-sub,
:root[data-theme='dark'] .admin-detail-kpi-lbl,
:root[data-theme='dark'] .studio-media-caption small {
  color: #a1a1aa;
}

:root[data-theme='dark'] .hub-card-footer,
:root[data-theme='dark'] .publication-card-bottom,
:root[data-theme='dark'] .module-admin-footer,
:root[data-theme='dark'] .admin-detail-card-title,
:root[data-theme='dark'] .studio-media-actions {
  background: transparent;
  border-color: rgba(255,255,255,.10);
}

:root[data-theme='dark'] .hub-card-tag,
:root[data-theme='dark'] .card-date-badge,
:root[data-theme='dark'] .module-admin-key {
  background: #202322;
  color: #a7efd8;
  border-color: rgba(89,211,174,.20);
}

:root[data-theme='dark'] .hub-card-media,
:root[data-theme='dark'] .publication-card-cover,
:root[data-theme='dark'] .studio-media-preview,
:root[data-theme='dark'] .publication-cover-empty {
  background: #101211;
}

:root[data-theme='dark'] .hub-card-status {
  background: rgba(20,20,20,.92);
  color: #e4e4e7;
  border: 1px solid rgba(255,255,255,.14);
}

:root[data-theme='dark'] .hub-card-status.online {
  background: rgba(22,101,52,.24);
  color: #86efac;
  border-color: rgba(134,239,172,.28);
}

:root[data-theme='dark'] .hub-card-status.offline {
  background: rgba(63,63,70,.72);
  color: #d4d4d8;
  border-color: rgba(255,255,255,.12);
}

:root[data-theme='dark'] .hub-card-status.coming {
  background: rgba(91,33,182,.24);
  color: #d8b4fe;
  border-color: rgba(216,180,254,.24);
}

:root[data-theme='dark'] .publication-open:hover,
:root[data-theme='dark'] .google-menu-card:hover {
  background: rgba(255,255,255,.055);
}

:root[data-theme='dark'] .admin-toolbar,
:root[data-theme='dark'] .google-drawer-header,
:root[data-theme='dark'] .google-drawer-sheet {
  background: #111312;
  color: #f4f4f5;
  border-color: rgba(255,255,255,.11);
}

:root[data-theme='dark'] [style*='background: #fff;'],
:root[data-theme='dark'] [style*='background:#fff;'],
:root[data-theme='dark'] [style*='background: #ffffff;'],
:root[data-theme='dark'] [style*='background:#ffffff;'] {
  background: #151515 !important;
  color: #f4f4f5 !important;
  border-color: rgba(255,255,255,.12) !important;
}
.auth-form .password-wrap .password-toggle:hover,
.password-wrap .password-toggle:hover,
button.password-toggle:hover{
  color:var(--green,#1e6550) !important;
  background:#edf4ec !important;
}
.password-toggle:focus-visible{
  outline:2px solid var(--green,#1e6550) !important;
  outline-offset:1px !important;
}
.password-toggle svg{
  width:20px !important;
  height:20px !important;
  stroke:currentColor !important;
  fill:none !important;
  stroke-width:2 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
  display:block !important;
  pointer-events:none !important;
}

/* Central Completa de Filtros e Pesquisa */
.filter-hub{background:#fff;border:1px solid var(--line,#e2e8e0);border-radius:14px;padding:16px 20px;margin-bottom:24px;box-shadow:0 3px 12px rgba(23,63,55,0.04)}
.filter-search-row{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.filter-search-wrap{position:relative;flex:1;display:flex;align-items:center}
.filter-search-icon{position:absolute;left:14px;font-size:15px;color:#8ba08d;pointer-events:none}
.filter-search-wrap input{width:100%;padding:10px 38px 10px 38px;border:1px solid #c9d8c6;border-radius:10px;font-size:14px;background:#fbfdfb;transition:border-color .15s,box-shadow .15s}
.filter-search-wrap input:focus{border-color:var(--green,#1e6550);outline:none;box-shadow:0 0 0 3px rgba(30,101,80,0.12);background:#fff}
.filter-clear-input{position:absolute;right:10px;background:none;border:none;font-size:18px;color:#94a395;cursor:pointer;padding:4px 8px;line-height:1}
.filter-clear-input:hover{color:#2d3748}
.filter-total-count{font-size:13px;font-weight:600;color:#5a6d60;white-space:nowrap;padding:6px 12px;background:#edf3ec;border-radius:20px}
.filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;padding-top:14px;border-top:1px solid #edf2ec}
.filter-group{display:flex;flex-direction:column;gap:5px}
.filter-label{font-size:11px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;color:#788b7b}
.filter-group select{padding:8px 12px;border:1px solid #d3ded0;border-radius:8px;font-size:13px;background:#fff;color:var(--ink,#1e2a22);cursor:pointer;transition:border-color .15s}
.filter-group select:focus{border-color:var(--green,#1e6550);outline:none}
.filter-chips-bar{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:14px;padding-top:12px;border-top:1px dashed #dce5da}
.filter-chips-title{font-size:12px;font-weight:600;color:#6d8070}
.filter-chips-list{display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.filter-chip{display:inline-flex;align-items:center;gap:6px;background:#e9f2e7;color:#1e6550;border:1px solid #bad084;padding:4px 10px;border-radius:20px;font-size:12px;font-weight:550;cursor:pointer;transition:all .15s}
.filter-chip:hover{background:#dbe9d8;border-color:#1e6550}
.filter-clear-all{background:none;border:none;color:#9e4747;font-size:12px;font-weight:600;cursor:pointer;padding:4px 8px;border-radius:6px}
.filter-clear-all:hover{background:#fee2e2;color:#b91c1c}

/* Status Ativo e Métricas no Card de Publicação */
.pub-card-active{border-color:#bad084;box-shadow:0 3px 14px rgba(30,101,80,0.08)}
.status-active{background:#1e6550 !important;color:#fff !important;font-weight:700}
.pub-views-chip{position:absolute;bottom:8px;right:8px;background:rgba(23,40,32,0.82);color:#fff;font-size:11px;font-weight:600;padding:3px 8px;border-radius:6px;backdrop-filter:blur(4px);display:flex;align-items:center;gap:4px}
.card-date-badge{font-size:12px;font-weight:600;color:#1e6550;background:#eef6ed;padding:2px 8px;border-radius:6px}

/* Topo do Estúdio e Meta Bar */
.pub-meta-bar{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:10px}
.pub-meta-badge{display:inline-flex;align-items:center;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:700}
.pub-meta-badge.meta-active{background:#e2f2de;color:#165b40;border:1px solid #9dc896}
.pub-meta-badge.meta-inactive{background:#f3f4f6;color:#6b7280;border:1px solid #d1d5db}
.pub-ext-link{font-size:12px;font-weight:600;color:#1e6550;text-decoration:none;padding:3px 8px;background:#ebf5e9;border-radius:6px;transition:background .15s}
.pub-ext-link:hover{background:#dbeed6}
.pub-meta-views{font-size:12px;color:#4b5563;background:#f3f4f6;padding:3px 10px;border-radius:12px;font-weight:500}
.pub-meta-date{font-size:12px;color:#1e6550;background:#f0f7ef;padding:3px 10px;border-radius:12px}
.primary-alt{background:#1e6550 !important;color:#fff !important;border:none !important;font-weight:600 !important}
.primary-alt:hover{background:#154a3a !important}

/* Painel Lateral de Status e Histórico de Acesso */
.studio-access-panel{background:#fff;border-left:4px solid var(--green,#1e6550)}
.access-kpi-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.kpi-card{background:#f8faf8;border:1px solid #e1e9df;border-radius:8px;padding:10px 12px;display:flex;flex-direction:column;gap:3px}
.kpi-label{font-size:11px;font-weight:600;text-transform:uppercase;color:#788b7b;letter-spacing:0.04em}
.kpi-value{font-size:15px;color:var(--ink,#1e2a22)}
.kpi-active{color:#1e6550;font-weight:700}
.pub-link-note{font-size:12px;margin:8px 0;word-break:break-all}
.pub-link-note a{color:#1e6550;font-weight:600;text-decoration:none}
.pub-date-note{font-size:11px;color:#6b7280;margin:4px 0}
.access-history-wrap{margin-top:10px;max-height:190px;overflow-y:auto;border:1px solid #e5ece3;border-radius:8px}
.access-history-table{width:100%;font-size:12px;border-collapse:collapse}
.access-history-table th{background:#edf4ec;color:#495b4e;text-align:left;padding:7px 10px;font-size:11px;font-weight:700}
.access-history-table td{padding:7px 10px;border-top:1px solid #edf2ec;color:#2d3748}

/* Calendário com Publicações */
.event.event-publication{background:#f0f8ee;border:1px solid #b5d5b0;border-left:4px solid var(--green,#1e6550);color:#194432;border-radius:6px;padding:5px 8px;margin-bottom:5px;cursor:pointer;transition:transform .12s,box-shadow .12s}
.event.event-publication:hover{background:#e3f2e1;transform:translateY(-1px);box-shadow:0 2px 8px rgba(30,101,80,0.15)}
.event.event-pub-active{border-left:4px solid #10b981;background:#ebf7ea}
.event-pub-badge{display:inline-block;font-size:9px;font-weight:750;text-transform:uppercase;letter-spacing:0.05em;background:#1e6550;color:#fff;padding:1px 5px;border-radius:3px;margin-bottom:3px}
.event-sched-badge{display:inline-block;font-size:9px;font-weight:750;text-transform:uppercase;letter-spacing:0.05em;background:#475569;color:#fff;padding:1px 5px;border-radius:3px;margin-bottom:3px}
.event.event-schedule{border-left:4px solid #475569}
.day-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
.day-count{font-size:10px;font-weight:700;color:#5a6d60;background:#e5eee3;padding:1px 5px;border-radius:10px}

/* Programação de Agendamentos e Compromissos */
.schedule-list{display:flex;flex-direction:column;gap:12px;margin-top:14px}
.schedule-card{background:#fff;border:1px solid var(--line,#dbe4db);border-radius:10px;padding:14px 16px;box-shadow:0 2px 6px rgba(23,63,55,0.03);display:flex;flex-direction:column;gap:10px;transition:border-color .15s,box-shadow .15s}
.schedule-card:hover{border-color:#b9cfb5;box-shadow:0 4px 12px rgba(23,63,55,0.06)}
.schedule-card-header{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.schedule-date-badge{display:inline-flex;align-items:center;gap:6px;background:#f0f5ee;color:#1e6550;padding:4px 10px;border-radius:6px;font-size:12px;font-weight:550}
.schedule-date-icon{font-size:13px}
.schedule-date-text b{color:#144c3c}
.schedule-commitment{display:flex;flex-direction:column;gap:2px}
.schedule-commitment-label{font-size:10px;text-transform:uppercase;letter-spacing:0.06em;color:#788b7b;font-weight:700}
.schedule-commitment-title{font-size:14px;color:var(--ink,#193e36);line-height:1.4}
.schedule-meta-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:2px}
.schedule-network-chip{font-size:11px;color:#506253;background:#f3f6f1;padding:2px 8px;border-radius:4px;border:1px solid #e2ebd9}
.schedule-notes{font-size:11px;color:#6b7c6e;margin:4px 0 0;line-height:1.5;background:#f9fbf8;padding:6px 10px;border-radius:6px}
.schedule-card-published{border-left:3px solid var(--green,#1e6550)}
.schedule-description{font-size:13px;color:var(--ink,#193e36);margin:2px 0 0;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.schedule-card-actions{display:flex;justify-content:flex-end;gap:6px;align-items:center;border-top:1px solid #eef2eb;padding-top:10px;margin-top:2px}
.schedule-empty{margin-top:10px}

/* 03 · Textos para publicar */
.pub-text-block{margin:14px 0;padding:14px 16px;border:1px solid var(--line,#dfe4db);border-radius:12px;background:#fff;box-shadow:0 1px 4px rgba(23,63,55,0.03);transition:border-color .15s,box-shadow .15s}
.pub-text-block:hover{border-color:#bdceb9}
.pub-text-block:focus-within{border-color:var(--green,#1e6550);box-shadow:0 0 0 1px var(--green,#1e6550),0 3px 10px rgba(30,101,80,0.07)}
.pub-text-block-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.pub-text-label-wrap{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pub-text-label-wrap strong{font-size:13px;color:var(--ink,#193e36)}
.pub-text-label-wrap small{font-size:11px;color:var(--muted,#6c7b75)}
.pub-text-badge{background:#ebf3e8;color:#1e6550;font-size:10px;font-weight:700;border-radius:4px;padding:2px 7px}
.pub-text-remove-btn{font-size:14px;padding:4px 8px;line-height:1;border-radius:6px;color:#a84840}
.pub-text-remove-btn:hover{background:#fdeeee;color:#b91c1c}
.pub-text-block textarea,.pub-text-block input{margin-top:2px;font-size:13px;border:1px solid #dbe2d6;border-radius:8px;transition:border-color .15s}
.pub-text-block textarea:focus,.pub-text-block input:focus{border-color:var(--green,#1e6550)}
.pub-text-menu-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-top:8px}
.pub-text-menu-item{text-align:left;background:#fafcf9;border:1px solid var(--line,#dfe4db);border-radius:10px;padding:14px 16px;cursor:pointer;transition:all .15s;display:flex;flex-direction:column;gap:6px;width:100%}
.pub-text-menu-item:hover{background:#f0f6ed;border-color:var(--green,#1e6550);transform:translateY(-1px);box-shadow:0 4px 12px rgba(23,63,55,0.08)}
.pub-text-menu-header{display:flex;align-items:center;gap:8px}
.pub-text-menu-header strong{font-size:13px;color:var(--ink,#193e36)}
.pub-text-empty{padding:36px 20px}

/* Miniaturas e todas as visualizações das mídias: exibir do topo para baixo (top center) */
img,
video,
.card img,
.publication-card-cover img,
.publication-top-cover img,
.publication-top-cover > img,
.studio-media-preview img,
.cover-choice img,
.media-strip img,
.thumb-grid img,
.stage-gallery img,
.studio-gallery img,
.studio-viewer,
.detail-media {
  object-position: top center !important;
}/* ==========================================================
   CENTRAL DE FERRAMENTAS (HUB DE SERVIÇOS REDES)
========================================================== */
.hub-layout {
  min-height: 100vh;
  background: #f4f6f1;
  color: var(--ink, #193e36);
  display: flex;
  flex-direction: column;
}

.hub-header {
  background: #173f37;
  color: #fff;
  padding: 16px 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #24584e;
  position: sticky;
  top: 0;
  z-index: 20;
  backdrop-filter: blur(8px);
}

.hub-brand-wrap {
  display: flex;
  align-items: center;
  gap: 16px;
}

.hub-brand-wrap .brand {
  margin: 0;
  font-size: 26px;
}

.hub-suite-tag {
  background: rgba(195, 216, 132, 0.18);
  border: 1px solid rgba(195, 216, 132, 0.4);
  color: #d8e8a7;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 20px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.hub-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.hub-header-actions .primary {
  background: #bad084;
  color: #173f37;
  border-color: #bad084;
  font-weight: 700;
}

.hub-back-btn {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  color: #c7decb !important;
  font-size: 12px;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 8px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.15s ease;
  box-shadow: none !important;
}

.hub-back-btn:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
}

.hub-header-divider {
  width: 1px;
  height: 22px;
  background: rgba(255, 255, 255, 0.14);
  margin: 0 4px;
}

/* Monochromatic Premium Icon Button (Borderless) */
.hub-icon-btn {
  background: transparent !important;
  border: none !important;
  outline: none;
  color: #b2cbbb;
  width: 38px;
  height: 38px;
  min-width: 38px;
  min-height: 38px;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  margin: 0;
  position: relative;
  transition: color 0.15s ease, background 0.15s ease, transform 0.15s ease;
  box-shadow: none !important;
}

.hub-icon-btn svg {
  display: block;
  width: 20px;
  height: 20px;
  pointer-events: none;
}

.hub-icon-btn:hover {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.08) !important;
  transform: translateY(-1px);
}

.hub-icon-btn:active,
.hub-icon-btn.active {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.14) !important;
}

.hub-icon-logout {
  color: #b2cbbb;
}

.hub-icon-logout:hover {
  color: #fca5a5;
  background: rgba(239, 68, 68, 0.12) !important;
}

/* Minimalist Unread Dot */
.hub-icon-dot {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 6px;
  height: 6px;
  background: #f87171;
  border-radius: 50%;
  box-shadow: 0 0 6px rgba(248, 113, 113, 0.9);
  pointer-events: none;
}

/* User Pill - Dark Glassmorphism */
.hub-user-pill {
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  background: rgba(255, 255, 255, 0.06) !important;
  color: #e5ede8 !important;
  font-weight: 550;
  font-size: 12px;
  border-radius: 20px;
  padding: 3px 12px 3px 4px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  transition: all 0.18s ease;
  box-shadow: none !important;
}

.hub-user-pill .avatar {
  background: #bad084;
  color: #173f37;
  font-weight: 700;
}

.hub-user-pill:hover {
  background: rgba(255, 255, 255, 0.14) !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
  color: #ffffff !important;
  transform: translateY(-1px);
}

/* Studio Topbar Icon Buttons */
.topbar-icon-btn {
  background: transparent !important;
  border: none !important;
  outline: none;
  color: #63756c;
  width: 36px;
  height: 36px;
  min-width: 36px;
  min-height: 36px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  transition: all 0.15s ease;
  box-shadow: none !important;
}

.topbar-icon-btn svg {
  display: block;
  width: 18px;
  height: 18px;
  pointer-events: none;
}

.topbar-icon-btn:hover {
  color: #173f37;
  background: rgba(23, 63, 55, 0.06) !important;
}

.topbar-icon-logout:hover {
  color: #dc2626;
  background: rgba(220, 38, 38, 0.08) !important;
}

.hub-container {
  max-width: 1400px;
  width: 100%;
  margin: 0 auto;
  padding: 36px 32px 64px;
  box-sizing: border-box;
  flex: 1;
}

.hub-hero {
  background: linear-gradient(135deg, #1b4940 0%, #153831 60%, #122d27 100%);
  color: #fff;
  border-radius: 20px;
  padding: 36px 42px;
  margin-bottom: 32px;
  box-shadow: 0 10px 30px rgba(23, 63, 55, 0.18);
  position: relative;
  overflow: hidden;
  border: 1px solid #2d6b5e;
}

.hub-hero::after {
  content: '';
  position: absolute;
  right: -50px;
  bottom: -50px;
  width: 320px;
  height: 320px;
  background: radial-gradient(circle, rgba(186, 208, 132, 0.15) 0%, transparent 70%);
  pointer-events: none;
}

.hub-hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #bad084;
  margin-bottom: 12px;
}

.hub-hero h1 {
  font-size: 38px;
  font-weight: 700;
  letter-spacing: -1.2px;
  margin: 0 0 12px;
  color: #ffffff;
}

.hub-hero p {
  font-size: 15px;
  color: #c4d7cc;
  max-width: 680px;
  line-height: 1.65;
  margin: 0;
}

.hub-controls-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 28px;
  flex-wrap: wrap;
}

.hub-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.hub-tab {
  background: #fff;
  border: 1px solid var(--line, #dfe4db);
  color: #495e54;
  padding: 8px 16px;
  border-radius: 24px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.18s ease;
}

.hub-tab:hover {
  background: #e9efe7;
  color: var(--ink, #173f37);
  border-color: #bad084;
}

.hub-tab.active {
  background: #173f37;
  color: #bad084;
  border-color: #173f37;
  box-shadow: 0 3px 10px rgba(23, 63, 55, 0.16);
}

.hub-search-box {
  position: relative;
  min-width: 280px;
  max-width: 360px;
  flex: 1;
}

.hub-search-box input {
  padding-left: 38px;
  border-radius: 24px;
  border: 1px solid #d3ded0;
  background: #fff;
  font-size: 13px;
  height: 42px;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.hub-search-box input:focus {
  border-color: var(--green, #1e6550);
  outline: none;
  box-shadow: 0 0 0 3px rgba(30, 101, 80, 0.12);
}

.hub-search-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #8fa292;
  font-size: 14px;
  pointer-events: none;
}

.hub-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: 28px;
}

.hub-card {
  background: #ffffff;
  border: 1px solid #dee5da;
  border-radius: 18px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 4px 16px rgba(23, 63, 55, 0.05);
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.22s, border-color 0.22s;
  position: relative;
}

.hub-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 36px rgba(23, 63, 55, 0.12);
  border-color: #a9c680;
}

.hub-card-media {
  position: relative;
  aspect-ratio: 16/9;
  width: 100%;
  background: #e1e9dc;
  overflow: hidden;
}

.hub-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  transition: transform 0.4s ease;
  display: block;
}

.hub-card:hover .hub-card-media img {
  transform: scale(1.04);
}

.hub-card-category {
  position: absolute;
  left: 14px;
  top: 14px;
  background: rgba(23, 63, 55, 0.88);
  color: #bad084;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.4px;
  padding: 5px 12px;
  border-radius: 20px;
  backdrop-filter: blur(6px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.hub-card-status {
  position: absolute;
  right: 14px;
  top: 14px;
  background: rgba(255, 255, 255, 0.95);
  color: #173f37;
  font-size: 11px;
  font-weight: 700;
  padding: 5px 11px;
  border-radius: 20px;
  backdrop-filter: blur(6px);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.hub-card-status.online {
  color: #166534;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
}

.hub-card-status.offline {
  color: #718096;
  background: #f7fafc;
  border: 1px solid #e2e8f0;
}

.hub-card-status.coming {
  color: #5b21b6;
  background: #f5f3ff;
  border: 1px solid #ddd6fe;
}

.hub-pulse-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
  animation: hubPulse 1.8s infinite;
}

@keyframes hubPulse {
  0% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
  }
  70% {
    box-shadow: 0 0 0 8px rgba(34, 197, 94, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
  }
}

.hub-card-body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.hub-card-header {
  margin-bottom: 12px;
}

.hub-card-subtitle {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: #728c7d;
  margin-bottom: 4px;
  display: block;
}

.hub-card-title {
  font-size: 21px;
  font-weight: 700;
  color: var(--ink, #173f37);
  margin: 0;
  line-height: 1.3;
}

.hub-card-desc {
  font-size: 13px;
  line-height: 1.65;
  color: #5f7067;
  margin: 0 0 18px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  flex: 1;
}

.hub-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 22px;
}

.hub-card-tag {
  background: #f1f5ee;
  color: #3b5a48;
  font-size: 11px;
  font-weight: 550;
  padding: 3px 9px;
  border-radius: 6px;
  border: 1px solid #e1e9dc;
}

.hub-card-footer {
  margin-top: auto;
  padding-top: 18px;
  border-top: 1px solid #eef2ec;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.hub-card-meta {
  font-size: 12px;
  color: #798b7e;
  font-weight: 500;
}

.hub-btn-launch {
  background: #173f37;
  color: #fff;
  border: 1px solid #173f37;
  padding: 10px 18px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.18s ease;
}

.hub-btn-launch:hover {
  background: #24584e;
  border-color: #24584e;
  color: #bad084;
  transform: translateX(2px);
}

.hub-btn-soon {
  background: #f3f5f0;
  color: #788c7f;
  border: 1px dashed #c8d4c3;
  padding: 10px 18px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.18s ease;
}

.hub-btn-soon:hover {
  background: #e8ede3;
  color: #405a49;
}

/* Retorno à Central a partir da barra lateral */
.nav-hub-btn {
  background: #24584e !important;
  color: #bad084 !important;
  font-weight: 650 !important;
  border-radius: 8px !important;
  margin-bottom: 6px !important;
  border: 1px solid #366c61 !important;
}

.nav-hub-btn:hover {
  background: #2f6d60 !important;
  color: #fff !important;
}

.topbar-hub-btn {
  background: #e8f0e5;
  color: #173f37;
  border: 1px solid #bad084;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 20px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  cursor: pointer;
  transition: all 0.15s ease;
}

.topbar-hub-btn:hover {
  background: #bad084;
  color: #173f37;
}

@media (max-width: 900px) {
  .hub-hero {
    padding: 26px 22px;
  }
  .hub-hero h1 {
    font-size: 28px;
  }
  .hub-grid {
    grid-template-columns: 1fr;
  }
  .hub-header {
    padding: 14px 20px;
  }
}

/* System Settings Subnav & WhatsApp Integration Components */
.settings-subnav {
  display: flex;
  gap: 8px;
  background: #f1f5ee;
  padding: 6px;
  border-radius: 12px;
  margin-bottom: 24px;
  border: 1px solid #dee5da;
  flex-wrap: wrap;
}

.settings-subnav .tab-btn {
  background: transparent;
  border: none;
  padding: 9px 18px;
  font-size: 13px;
  font-weight: 600;
  color: #55695e;
  border-radius: 8px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all 0.15s ease;
}

.settings-subnav .tab-btn:hover {
  background: rgba(255, 255, 255, 0.7);
  color: #173f37;
}

.settings-subnav .tab-btn.active {
  background: #ffffff;
  color: #173f37;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.settings-subnav .tab-btn .tab-badge {
  font-size: 10px;
  padding: 2px 7px;
  border-radius: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.wa-status-card {
  background: #ffffff;
  border: 1px solid #dee5da;
  border-radius: 14px;
  padding: 22px 24px;
  margin-bottom: 22px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

.wa-status-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 16px;
}

.wa-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
}

.wa-badge.working {
  background: #dcfce7;
  color: #166534;
  border: 1px solid #86efac;
}

.wa-badge.qr-pending, .wa-badge.starting {
  background: #fef9c3;
  color: #854d0e;
  border: 1px solid #fde047;
}

.wa-badge.stopped, .wa-badge.failed {
  background: #fee2e2;
  color: #991b1b;
  border: 1px solid #fca5a5;
}

.wa-pulse-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}

.wa-badge.working .wa-pulse-dot {
  background: #22c55e;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.25);
  animation: wa-pulse 2s infinite;
}

.wa-badge.qr-pending .wa-pulse-dot, .wa-badge.starting .wa-pulse-dot {
  background: #eab308;
  box-shadow: 0 0 0 3px rgba(234, 179, 8, 0.25);
  animation: wa-pulse 1.5s infinite;
}

.wa-badge.stopped .wa-pulse-dot, .wa-badge.failed .wa-pulse-dot {
  background: #ef4444;
}

@keyframes wa-pulse {
  0% { transform: scale(0.95); opacity: 0.9; }
  50% { transform: scale(1.15); opacity: 1; }
  100% { transform: scale(0.95); opacity: 0.9; }
}

.wa-qr-box {
  background: #f8faf7;
  border: 2px dashed #bad084;
  border-radius: 16px;
  padding: 24px;
  text-align: center;
  max-width: 440px;
  margin: 0 auto;
}

.wa-qr-img {
  width: 240px;
  height: 240px;
  background: #ffffff;
  border-radius: 12px;
  padding: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  margin: 12px auto;
  display: block;
}

.wa-module-pill {
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 12px;
  font-weight: 600;
  display: inline-block;
}

.wa-module-roleta {
  background: #fdf4ff;
  color: #86198f;
  border: 1px solid #f0abfc;
}

.wa-module-central {
  background: #eef7ee;
  color: #1e6550;
  border: 1px solid #b7dbb0;
}

.wa-module-qr {
  background: #eff6ff;
  color: #1e40af;
  border: 1px solid #bfdbfe;
}

/* ════════════════════════════════════════════════════════════════════════════
   PAINEL ADMINISTRATIVO CENTRAL (SUPERADMIN)
════════════════════════════════════════════════════════════════════════════ */
.hub-superadmin-btn {
  background: linear-gradient(135deg, #1e6550, #134e3f);
  color: #ffffff;
  border: 1px solid #2d7a62;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  box-shadow: 0 2px 6px rgba(30, 101, 80, 0.25);
  cursor: pointer;
  transition: all 0.2s ease;
}

.hub-superadmin-btn:hover {
  background: linear-gradient(135deg, #24755d, #165b49);
  box-shadow: 0 4px 10px rgba(30, 101, 80, 0.35);
  transform: translateY(-1px);
}

.hub-superadmin-btn.active {
  background: #bad084;
  color: #12382c;
  border-color: #a4be6c;
  box-shadow: 0 2px 8px rgba(186, 208, 132, 0.4);
}

.admin-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}

.admin-kpi-card {
  background: #ffffff;
  border: 1px solid #dee5da;
  border-radius: 14px;
  padding: 20px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  position: relative;
  overflow: hidden;
}

.admin-kpi-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(22, 61, 55, 0.08);
}

.admin-kpi-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.admin-kpi-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}

.admin-kpi-title {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #627362;
}

.admin-kpi-val {
  font-size: 28px;
  font-weight: 700;
  color: #13332a;
  line-height: 1.1;
  margin-bottom: 6px;
}

.admin-kpi-sub {
  font-size: 12px;
  color: #718471;
  line-height: 1.4;
}

.admin-table-card {
  background: #ffffff;
  border: 1px solid #dee5da;
  border-radius: 16px;
  box-shadow: 0 4px 20px rgba(19, 51, 42, 0.05);
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}

.admin-users-table {
  width: 100%;
  min-width: 1240px;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
}

.admin-users-table thead tr {
  background: #f7faf6;
}

.admin-users-table th {
  padding: 16px 18px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #496353;
  border-bottom: 2px solid #dee5da;
  white-space: nowrap;
}

.admin-users-table tbody tr {
  border-bottom: 1px solid #edf2eb;
  transition: background 0.15s ease;
  min-height: 72px;
}

.admin-users-table tbody tr:hover {
  background: #f8fbf6;
}

.admin-users-table tbody tr:last-child td {
  border-bottom: none;
}

.admin-users-table td {
  padding: 18px 18px;
  vertical-align: middle;
  border-bottom: 1px solid #edf2eb;
  color: #233d37;
}

.admin-user-cell {
  display: flex;
  align-items: center;
  gap: 14px;
}

.admin-avatar {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 700;
  color: #ffffff;
  flex-shrink: 0;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.admin-user-info {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.admin-username-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.admin-username {
  font-size: 14px;
  font-weight: 700;
  color: #13332a;
  line-height: 1.3;
}

.admin-user-email {
  font-size: 12px;
  color: #556c5e;
  line-height: 1.2;
}

.admin-org-cell {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.admin-org-name {
  font-size: 13.5px;
  font-weight: 600;
  color: #173f37;
  line-height: 1.3;
}

.admin-org-slug {
  font-size: 11px;
  color: #556b5d;
  background: #f0f4ee;
  padding: 2px 7px;
  border-radius: 5px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  display: inline-block;
  width: fit-content;
  border: 1px solid #e1e8dd;
}

.admin-date-cell {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 12.5px;
  color: #374d42;
  white-space: nowrap;
}

.admin-date-time {
  font-size: 11px;
  color: #728779;
}

.admin-actions-cell {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  white-space: nowrap;
}

.admin-btn-action {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  font-size: 12px;
  font-weight: 600;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.18s ease;
  line-height: 1;
}

.admin-btn-action:hover {
  transform: translateY(-1px);
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.08);
}

.admin-btn-plan {
  background: #f0fdf4;
  color: #15803d;
  border: 1px solid #bbf7d0;
}

.admin-btn-plan:hover {
  background: #dcfce7;
  border-color: #86efac;
}

.admin-btn-role {
  background: #f8fafc;
  color: #334155;
  border: 1px solid #cbd5e1;
}

.admin-btn-role:hover {
  background: #f1f5f9;
  border-color: #94a3b8;
}

.admin-btn-suspend {
  background: #fff1f2;
  color: #be123c;
  border: 1px solid #fecdd3;
}

.admin-btn-suspend:hover {
  background: #ffe4e6;
  border-color: #fda4af;
}

.admin-btn-activate {
  background: #f0fdf4;
  color: #047857;
  border: 1px solid #a7f3d0;
}

.admin-btn-activate:hover {
  background: #d1fae5;
  border-color: #6ee7b7;
}

.admin-btn-view {
  background: #eff6ff;
  color: #1d4ed8;
  border: 1px solid #bfdbfe;
}

.admin-btn-view:hover {
  background: #dbeafe;
  border-color: #93c5fd;
}

/* ─── CARDS EXPANDIDOS DE USUÁRIOS (SUPERADMIN CENTRAL) ──────────────── */
.admin-user-cards-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
}

.admin-user-card {
  background: #ffffff;
  border: 1.5px solid #dce6db;
  border-radius: 16px;
  padding: 20px 24px;
  min-height: 120px;
  box-shadow: 0 2px 10px rgba(19, 51, 42, 0.04);
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1);
  cursor: pointer;
  position: relative;
  display: flex;
  flex-direction: column;
}

.admin-user-card:hover {
  border-color: #1e6550;
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(30, 101, 80, 0.1);
  background: #fbfdfb;
}

.admin-user-card:focus-visible {
  outline: 2px solid #1e6550;
  outline-offset: 2px;
}

.admin-user-card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.admin-user-card-identity {
  display: flex;
  align-items: center;
  gap: 16px;
}

.admin-user-card-name-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.admin-user-card-name {
  font-size: 16px;
  font-weight: 700;
  color: #13332a;
}

.admin-user-card-email {
  font-size: 13px;
  color: #556c5e;
  margin-top: 2px;
  display: block;
}

.admin-user-card-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.admin-user-card-divider {
  height: 1px;
  background: #edf3ec;
  margin: 16px 0 14px;
  width: 100%;
}

.admin-user-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 18px;
  width: 100%;
}

.admin-user-card-col {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.admin-user-card-lbl {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #728b7c;
}

.admin-user-card-val {
  font-size: 13.5px;
  color: #1f362b;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

/* ─── MODAL DE FICHA COMPLETA DO CONTATO ───────────────────────────── */
.admin-detail-sheet {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.admin-detail-header-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  background: #f7faf6;
  border: 1px solid #dce6db;
  border-radius: 14px;
}

.admin-detail-header-left {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.admin-detail-name {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: #13332a;
}

.admin-detail-header-meta {
  margin-top: 6px;
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  font-size: 13px;
  color: #52675b;
}

.admin-detail-linked-agency {
  color: #1d4ed8;
  font-weight: 600;
}

.admin-detail-phone { color: #1e6550; }

.admin-detail-avatar {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-weight: 800;
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
  flex-shrink: 0;
}

.admin-id-pill {
  background: #eef4ec;
  border: 1px solid #d5e0d3;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 11.5px;
  color: #3b5346;
  transition: background 0.15s ease;
}

.admin-id-pill:hover {
  background: #e0ece0;
}

.admin-detail-kpis-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px;
}

.admin-detail-kpi {
  background: #ffffff;
  border: 1px solid #e1e9df;
  border-radius: 12px;
  padding: 14px 16px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.admin-detail-kpi-val {
  font-size: 20px;
  font-weight: 800;
  color: #1e6550;
  line-height: 1.1;
}

.admin-detail-kpi-lbl {
  font-size: 11.5px;
  color: #637a6d;
  font-weight: 600;
}

.admin-detail-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 16px;
}

.admin-detail-card {
  background: #ffffff;
  border: 1px solid #dee7dc;
  border-radius: 12px;
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.admin-detail-card-title {
  font-size: 13.5px;
  font-weight: 700;
  color: #13332a;
  display: flex;
  align-items: center;
  gap: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid #edf2ec;
}

.admin-detail-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.admin-detail-item {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  font-size: 13px;
}

.admin-detail-item .lbl {
  color: #60766a;
  font-size: 12px;
  white-space: nowrap;
}

.admin-detail-item .val {
  color: #13332a;
  text-align: right;
  word-break: break-word;
}

.admin-detail-footer-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  padding-top: 14px;
  border-top: 1px solid #dee7dc;
  margin-top: 4px;
}

.admin-toolbar {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  padding: 16px 20px;
  background: #ffffff;
  border: 1px solid #dee5da;
  border-radius: 14px;
  box-shadow: 0 2px 8px rgba(19, 51, 42, 0.03);
}

.plan-pill {
  display: inline-flex;
  align-items: center;
  padding: 4px 11px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.plan-free {
  background: #f1f5f9;
  color: #475569;
  border: 1px solid #cbd5e1;
}

.plan-plus,
.plan-starter {
  background: #e0f2fe;
  color: #0369a1;
  border: 1px solid #7dd3fc;
}

.plan-pro {
  background: #dcfce7;
  color: #15803d;
  border: 1px solid #86efac;
}

.plan-enterprise {
  background: #fef3c7;
  color: #b45309;
  border: 1px solid #fcd34d;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 8px;
  font-size: 11.5px;
  font-weight: 600;
  white-space: nowrap;
}

.status-active {
  background: #ecfdf5;
  color: #047857;
  border: 1px solid #a7f3d0;
}

.status-suspended {
  background: #fee2e2;
  color: #b91c1c;
  border: 1px solid #fca5a5;
}

.badge-superadmin {
  background: linear-gradient(135deg, #ede9fe 0%, #f3e8ff 100%);
  color: #6d28d9;
  border: 1px solid #d8b4fe;
  font-weight: 700;
  padding: 4px 9px;
  border-radius: 6px;
}

.badge-admin {
  background: #dbeafe;
  color: #1d4ed8;
  border: 1px solid #bfdbfe;
  padding: 4px 9px;
  border-radius: 6px;
}

.badge-agency {
  background: #eff6ff;
  color: #1d4ed8;
  border: 1px solid #bfdbfe;
  font-weight: 700;
  padding: 4px 9px;
  border-radius: 6px;
}

.badge-client {
  background: #f0fdf4;
  color: #15803d;
  border: 1px solid #bbf7d0;
  font-weight: 600;
  padding: 4px 9px;
  border-radius: 6px;
}

.hub-agency-btn {
  background: #eff6ff;
  color: #1d4ed8;
  border: 1px solid #bfdbfe;
  font-size: 12px;
  font-weight: 700;
  padding: 7px 14px;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s ease;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.hub-agency-btn:hover {
  background: #dbeafe;
  border-color: #93c5fd;
  transform: translateY(-1px);
}

.agency-mode-banner {
  background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 100%);
  color: #ffffff;
  padding: 10px 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  box-shadow: 0 4px 12px rgba(30, 58, 138, 0.25);
  position: relative;
  z-index: 100;
  border-bottom: 2px solid #60a5fa;
  flex-wrap: wrap;
  gap: 12px;
}

.agency-mode-info {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 13px;
}

.agency-mode-tag {
  background: #3b82f6;
  color: #ffffff;
  font-weight: 800;
  font-size: 11px;
  padding: 3px 8px;
  border-radius: 4px;
  letter-spacing: 0.5px;
}

.agency-exit-btn {
  background: #ffffff;
  color: #1e3a8a;
  font-weight: 700;
  font-size: 12px;
  border: none;
  padding: 6px 14px;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.agency-exit-btn:hover {
  background: #f8fafc;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
  transform: translateY(-1px);
}

.agency-delegation-card {
  background: #ffffff;
  border: 1px solid #dee5da;
  border-radius: 12px;
  padding: 18px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  transition: all 0.2s ease;
  margin-bottom: 12px;
}

.agency-delegation-card:hover {
  border-color: #bad084;
  box-shadow: 0 4px 12px rgba(30, 101, 80, 0.06);
}

/* ─── GESTÃO DINÂMICA DE MÓDULOS & PLUGINS (SUPERADMIN) ─── */
.module-admin-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: 20px;
  margin-top: 16px;
}

.module-admin-card {
  background: #ffffff;
  border: 1px solid #dee5da;
  border-radius: 14px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
  transition: all 0.25s ease;
}

.module-admin-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(30, 101, 80, 0.08);
  border-color: #bad084;
}

.module-admin-thumb-wrap {
  position: relative;
  height: 140px;
  background: #f1f5f9;
  overflow: hidden;
}

.module-admin-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.module-admin-thumb-overlay {
  position: absolute;
  top: 10px;
  left: 10px;
  right: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  pointer-events: none;
}

.module-admin-body {
  padding: 18px 20px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.module-admin-title-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 6px;
}

.module-admin-title {
  font-size: 16px;
  font-weight: 700;
  color: #13332a;
  margin: 0;
  line-height: 1.3;
}

.module-admin-sub {
  font-size: 12px;
  color: #627362;
  margin: 0 0 10px;
  line-height: 1.4;
}

.module-admin-desc {
  font-size: 13px;
  color: #495e54;
  line-height: 1.5;
  margin: 0 0 14px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.module-admin-meta-row {
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: #f8faf7;
  border: 1px solid #edf2eb;
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 12px;
  margin-top: auto;
  margin-bottom: 14px;
}

.module-admin-url {
  color: #1e6550;
  word-break: break-all;
  font-weight: 600;
  text-decoration: none;
}

.module-admin-url:hover {
  text-decoration: underline;
}

.module-admin-key {
  font-family: monospace;
  background: #ffffff;
  padding: 2px 6px;
  border-radius: 4px;
  border: 1px solid #dee5da;
  font-size: 11px;
  color: #334155;
}

.module-admin-footer {
  border-top: 1px solid #edf2eb;
  padding: 12px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #fafcf9;
  gap: 8px;
  flex-wrap: wrap;
}



/* Leitor QR promocional central */
.qr-reader-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);gap:24px;margin-top:20px;align-items:start}
.qr-camera-stage{position:relative;overflow:hidden;border-radius:16px;background:#102c25;aspect-ratio:4/3;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.qr-camera-stage[hidden]{display:none}.qr-camera-stage video{width:100%;height:100%;object-fit:cover;display:block}
.qr-camera-guide{position:absolute;inset:50% auto auto 50%;width:min(62%,260px);aspect-ratio:1;transform:translate(-50%,-50%);border:3px solid #bad084;border-radius:18px;box-shadow:0 0 0 999px rgba(10,30,24,.34);pointer-events:none}
.qr-reader-actions{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}.qr-reader-actions button{min-height:44px}
.qr-manual-form{display:flex;align-items:end;gap:10px;margin-top:14px}.qr-manual-form .field{flex:1;margin:0}.qr-manual-form button{min-height:44px}
.qr-result{display:flex;gap:14px;border:1px solid #dee5da;border-radius:14px;padding:20px;background:#fff;min-height:160px}
.qr-result.is-valid{border-color:#86b89f;background:#f3faf6}.qr-result.is-invalid{border-color:#e8b4b4;background:#fff7f7}
.qr-result-icon{width:42px;height:42px;flex:0 0 42px;border-radius:50%;display:grid;place-items:center;font-size:22px;font-weight:800;background:#1e6550;color:#fff}
.qr-result.is-invalid .qr-result-icon{background:#b42318}.qr-result h3{margin:5px 0 8px;color:#173f37}.qr-result p{margin:0 0 10px;color:#50655a}
.qr-result-meta{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#3f564d}
@media(max-width:760px){.qr-reader-grid{grid-template-columns:1fr}.qr-manual-form{align-items:stretch;flex-direction:column}.qr-manual-form button{width:100%}.qr-camera-stage{aspect-ratio:1}.settings-subnav{overflow-x:auto;flex-wrap:nowrap}.settings-subnav .tab-btn{flex:0 0 auto}}

/* ==========================================================
   APPEARANCE: LIGHT / DARK (KASAWEB-INSPIRED)
========================================================== */
:root {
  color-scheme: light;
  --redes-bg: #f5f5ef;
  --redes-surface: #ffffff;
  --redes-surface-alt: #f8faf7;
  --redes-text: #233d37;
  --redes-muted: #6c7b75;
  --redes-border: #dee5da;
  --redes-focus: #1e6550;
}

:root[data-theme='dark'] {
  color-scheme: dark;
  --ink: #f3f7f5;
  --muted: #99a1af;
  --green: #59d3ae;
  --line: rgba(255,255,255,.12);
  --paper: #0a0a0a;
  --accent: #bad084;
  --redes-bg: #050505;
  --redes-surface: #0a0a0a;
  --redes-surface-alt: #101312;
  --redes-text: #f3f7f5;
  --redes-muted: #99a1af;
  --redes-border: rgba(255,255,255,.12);
  --redes-focus: #75dfbd;
}

html[data-theme='dark'],html[data-theme='dark'] body {
  background-color: #050505;
  color: var(--redes-text);
}

html[data-theme='dark'] body {
  background-image: linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size: 28px 28px;
}

[data-theme='dark'] .hub-layout,[data-theme='dark'] .workspace,[data-theme='dark'] .auth-form {
  background: transparent;
  color: var(--redes-text);
}

[data-theme='dark'] .sidebar,[data-theme='dark'] .hub-header,[data-theme='dark'] .auth-story {
  background: rgba(5,12,10,.94);
  border-color: rgba(117,223,189,.18);
  box-shadow: 0 14px 45px rgba(0,0,0,.4);
}

[data-theme='dark'] .panel,[data-theme='dark'] .card,[data-theme='dark'] .stat,[data-theme='dark'] .wa-status-card,[data-theme='dark'] .agency-delegation-card,[data-theme='dark'] dialog,[data-theme='dark'] table,[data-theme='dark'] .modalhead,[data-theme='dark'] .auth-card {
  background: rgba(10,10,10,.88);
  color: var(--redes-text);
  border-color: rgba(255,255,255,.11);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055),0 18px 55px rgba(0,0,0,.28);
  backdrop-filter: blur(18px);
}

[data-theme='dark'] button:not(.primary),[data-theme='dark'] .button,[data-theme='dark'] input,[data-theme='dark'] textarea,[data-theme='dark'] select {
  background: rgba(255,255,255,.045);
  color: var(--redes-text);
  border-color: rgba(255,255,255,.14);
}

[data-theme='dark'] button:not(.primary):hover,[data-theme='dark'] .button:hover {
  background: rgba(117,223,189,.1);
  border-color: rgba(117,223,189,.35);
}

[data-theme='dark'] .primary {
  background: #2d8f70;
  border-color: #54cba6;
  color: #fff;
  box-shadow: 0 0 0 1px rgba(117,223,189,.12),0 10px 28px rgba(30,101,80,.28);
}

[data-theme='dark'] .primary:hover {background:#36a27f}
[data-theme='dark'] h1,[data-theme='dark'] h2,[data-theme='dark'] h3,[data-theme='dark'] strong {color:#f5f7f6}
[data-theme='dark'] small,[data-theme='dark'] .muted,[data-theme='dark'] .pagehead p,[data-theme='dark'] label.field {color:#a3aaa7}
[data-theme='dark'] a,[data-theme='dark'] .eyebrow {color:#75dfbd}
[data-theme='dark'] .topbar,[data-theme='dark'] .card-footer,[data-theme='dark'] .list-row,[data-theme='dark'] td,[data-theme='dark'] th,[data-theme='dark'] .modalhead {border-color:rgba(255,255,255,.1)}
[data-theme='dark'] th {color:#a8b0ac}
[data-theme='dark'] .empty,[data-theme='dark'] .note,[data-theme='dark'] .pre,[data-theme='dark'] .column,[data-theme='dark'] .weekday,[data-theme='dark'] .day,[data-theme='dark'] .settings-subnav,[data-theme='dark'] .drop-zone {
  background: rgba(255,255,255,.035);
  color: #aeb7b2;
  border-color: rgba(255,255,255,.11);
}
[data-theme='dark'] .day.outside,[data-theme='dark'] .day.today {background:rgba(117,223,189,.045)}
[data-theme='dark'] .event,[data-theme='dark'] .badge,[data-theme='dark'] .tag {background:rgba(117,223,189,.1);color:#a7efd8}
[data-theme='dark'] .hero {background:linear-gradient(135deg,rgba(30,101,80,.2),rgba(255,255,255,.035));border-color:rgba(117,223,189,.16)}
[data-theme='dark'] .hero p {color:#aeb7b2}
[data-theme='dark'] .settings-subnav .tab-btn {color:#aeb7b2}
[data-theme='dark'] .settings-subnav .tab-btn:hover,[data-theme='dark'] .settings-subnav .tab-btn.active {background:rgba(255,255,255,.08);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
[data-theme='dark'] dialog::backdrop {background:rgba(0,0,0,.76);backdrop-filter:blur(6px)}
[data-theme='dark'] #toast {background:#111814;border:1px solid rgba(117,223,189,.25)}
[data-theme='dark'] ::selection {background:#2d8f70;color:#fff}
[data-theme='dark'] :focus-visible {outline:2px solid #75dfbd}

/* Neutralize legacy inline light colors while the interface migrates to semantic tokens. */
[data-theme='dark'] [style*='#13332a'],[data-theme='dark'] [style*='#0f172a'],[data-theme='dark'] [style*='#1e3a8a'],[data-theme='dark'] [style*='#334155'] {color:#f3f7f5!important}
[data-theme='dark'] [style*='#495e54'],[data-theme='dark'] [style*='#50655a'],[data-theme='dark'] [style*='#55695e'],[data-theme='dark'] [style*='#627362'],[data-theme='dark'] [style*='#7a8b7e'] {color:#a3aaa7!important}
[data-theme='dark'] [style*='background:#f8faf7'],[data-theme='dark'] [style*='background:#f8fafc'],[data-theme='dark'] [style*='background:#fafcf8'],[data-theme='dark'] [style*='background:#fafbf6'] {background:rgba(255,255,255,.035)!important;border-color:rgba(255,255,255,.11)!important}
[data-theme='dark'] [style*='border-color:#e2e8e0'],[data-theme='dark'] [style*='border:1px solid #dee5da'],[data-theme='dark'] [style*='border-bottom:1px solid #edf2eb'] {border-color:rgba(255,255,255,.11)!important}

.theme-settings-panel {padding:28px}
.theme-current-badge {display:inline-flex;padding:7px 12px;border-radius:999px;background:#e9f2e7;color:#1e6550;font-size:12px;font-weight:750}
.theme-choice-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:20px}
.theme-choice {position:relative;display:grid;grid-template-columns:76px 1fr 24px;align-items:center;gap:15px;padding:15px;border:1px solid var(--line);border-radius:16px;background:var(--paper);cursor:pointer;transition:transform .18s,border-color .18s,box-shadow .18s}
.theme-choice:hover {transform:translateY(-2px);border-color:#bad084}
.theme-choice.is-selected {border-color:#1e6550;box-shadow:0 0 0 3px rgba(30,101,80,.12)}
.theme-choice input {position:absolute;opacity:0;pointer-events:none}
.theme-choice strong,.theme-choice small {display:block}
.theme-choice small {font-size:11px;line-height:1.45;margin-top:4px}
.theme-preview {height:58px;border-radius:11px;display:grid;place-items:center;font-size:23px;border:1px solid rgba(127,127,127,.2)}
.theme-preview-light {background:#f5f5ef;color:#1e6550}
.theme-preview-dark {background:#050505;color:#75dfbd;box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.theme-preview-system {background:linear-gradient(115deg,#f5f5ef 49%,#050505 51%);color:#bad084}
.theme-choice-check {opacity:0;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#1e6550;color:#fff;font-size:12px}
.theme-choice.is-selected .theme-choice-check {opacity:1}
.theme-sync-note {margin:22px 0 0}
[data-theme='dark'] .theme-current-badge {background:rgba(117,223,189,.12);color:#a7efd8;border:1px solid rgba(117,223,189,.18)}
[data-theme='dark'] .theme-choice {background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.11);box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
[data-theme='dark'] .theme-choice.is-selected {border-color:#75dfbd;box-shadow:0 0 0 3px rgba(117,223,189,.1),inset 0 1px 0 rgba(255,255,255,.06)}
@media(max-width:760px){.theme-choice-grid{grid-template-columns:1fr}.theme-settings-panel{padding:20px}.theme-choice{grid-template-columns:64px 1fr 24px}}

/* ==========================================================================
   REDES MOBILE NAVIGATION & GOOGLE-STYLE ACCOUNT DRAWER
   ========================================================================== */
.brand{cursor:pointer;user-select:none;transition:opacity .15s}
.brand:hover{opacity:.9}
.brand:active{transform:scale(0.98)}

.mobile-header-bar{display:none}
.mobile-hamburger-btn{display:none}
.pub-editor-tabs-bar{display:none}

/* Hamburger button styling */
.mobile-hamburger-btn{
  align-items:center;
  gap:9px;
  padding:5px 10px 5px 8px;
  border-radius:22px;
  border:1px solid #bad084;
  background:#173f37;
  color:#fff;
  cursor:pointer;
  box-shadow:0 2px 8px rgba(23,63,55,0.18);
  transition:all .15s ease;
  font-family:inherit;
}
.mobile-hamburger-btn:hover{background:#1f5247}
.mobile-hamburger-btn:active{transform:scale(0.96)}
.hamburger-lines{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:3.5px;
  width:18px;
  height:16px;
}
.hamburger-lines span{
  display:block;
  width:100%;
  height:2.2px;
  background:#bad084;
  border-radius:2px;
}
.mobile-hamburger-avatar{
  width:26px;
  height:26px;
  font-size:12px;
  font-weight:700;
  border-radius:50%;
  color:#fff;
  display:grid;
  place-items:center;
  box-shadow:0 1px 4px rgba(0,0,0,0.2);
}

/* Google-style Drawer Modal */
#google-mobile-drawer{
  position:fixed;
  inset:0;
  z-index:1000;
  pointer-events:none;
  opacity:0;
  transition:opacity .25s cubic-bezier(0.16,1,0.3,1);
}
#google-mobile-drawer.open{
  pointer-events:auto;
  opacity:1;
}
.google-drawer-backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,35,29,0.65);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}
.google-drawer-sheet{
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  max-height:92vh;
  background:#f8faf7;
  border-radius:28px 28px 0 0;
  box-shadow:0 -12px 45px rgba(0,0,0,0.3);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  transform:translateY(100%);
  transition:transform .32s cubic-bezier(0.16,1,0.3,1);
  max-width:540px;
  margin:0 auto;
}
#google-mobile-drawer.open .google-drawer-sheet{
  transform:translateY(0);
}
.google-drawer-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 20px 14px;
  border-bottom:1px solid #edf1eb;
  background:#fff;
}
.google-drawer-brand{
  display:flex;
  align-items:center;
  gap:9px;
  font-weight:700;
  font-size:22px;
  color:#173f37;
  cursor:pointer;
  letter-spacing:-1px;
}
.google-drawer-brand .brand-mark{
  display:grid;
  grid-template-columns:repeat(2,8px);
  gap:3px;
  transform:rotate(-8deg);
}
.google-drawer-brand .brand-mark i{
  width:8px;
  height:8px;
  background:#bad084;
  border-radius:2px;
}
.google-drawer-brand .brand-mark i:last-child{
  background:#e8ab85;
}
.google-drawer-close-btn{
  width:36px;
  height:36px;
  border-radius:50%;
  background:#edf2ea;
  border:none;
  font-size:16px;
  display:grid;
  place-items:center;
  color:#495e54;
  cursor:pointer;
  transition:all .15s ease;
}
.google-drawer-close-btn:hover{background:#dfe7dc;color:#173f37}
.google-drawer-content{
  overflow-y:auto;
  padding:18px 18px calc(26px + env(safe-area-inset-bottom));
  display:flex;
  flex-direction:column;
  gap:14px;
  -webkit-overflow-scrolling:touch;
}

/* User Card inside Google Drawer */
.google-user-card{
  display:flex;
  align-items:center;
  gap:14px;
  padding:15px 16px;
  background:#fff;
  border:1px solid #e1e8df;
  border-radius:22px;
  cursor:pointer;
  box-shadow:0 2px 10px rgba(23,63,55,0.04);
  transition:all .15s ease;
}
.google-user-card:hover{
  background:#f6faf5;
  border-color:#bad084;
  box-shadow:0 4px 14px rgba(23,63,55,0.08);
}
.google-user-avatar-wrap{position:relative;flex-shrink:0}
.google-user-avatar{
  width:48px;
  height:48px;
  border-radius:50%;
  color:#fff;
  font-size:19px;
  font-weight:700;
  display:grid;
  place-items:center;
  box-shadow:0 2px 6px rgba(0,0,0,0.15);
}
.google-user-info{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}
.google-user-name-row{display:flex;align-items:center;gap:8px}
.google-user-name{
  font-size:16px;
  color:#173f37;
  font-weight:700;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.google-user-email{
  font-size:13px;
  color:#627568;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.google-user-plan-wrap{margin-top:4px}
.google-plan-badge{
  display:inline-block;
  padding:3px 10px;
  border-radius:12px;
  font-size:11px;
  font-weight:700;
  background:#eef8ee;
  color:#15803d;
  border:1px solid #bbf7d0;
}
.google-plan-badge.plan-pro{background:#eff6ff;color:#1d4ed8;border-color:#bfdbfe}
.google-plan-badge.plan-superadmin{background:#f5f3ff;color:#6d28d9;border-color:#ddd6fe}
.google-user-arrow{color:#8da092;padding:6px;display:flex;align-items:center}

/* Capsule Group & Button Cards */
.google-menu-group{
  display:flex;
  flex-direction:column;
  gap:6px;
  background:#fff;
  border:1px solid #e5ece2;
  border-radius:20px;
  padding:8px;
  box-shadow:0 2px 8px rgba(23,63,55,0.03);
}
.google-menu-card{
  display:flex;
  align-items:center;
  gap:13px;
  padding:11px 13px;
  border:none;
  background:transparent;
  border-radius:14px;
  text-align:left;
  width:100%;
  cursor:pointer;
  transition:all .15s ease;
  font-family:inherit;
}
.google-menu-card:hover,.google-menu-card:active{
  background:#f1f6ef;
}
.google-menu-card.active{
  background:#eaf2e8;
}
.google-menu-card.active strong{
  color:#1e6550;
  font-weight:700;
}
.google-menu-icon{
  width:38px;
  height:38px;
  border-radius:12px;
  display:grid;
  place-items:center;
  font-size:18px;
  flex-shrink:0;
}
.google-menu-text{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
}
.google-menu-text strong{
  font-size:14px;
  color:#173f37;
  font-weight:600;
  line-height:1.3;
}
.google-menu-text small{
  font-size:12px;
  color:#6c8072;
  line-height:1.3;
  margin-top:2px;
}
.google-menu-arrow{
  color:#9cb0a2;
  font-size:18px;
  font-weight:600;
}

/* ==========================================================================
   PUBLICATIONS FILTERS MODAL & BUTTON
   ========================================================================== */
.btn-open-filters{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 14px;
  border-radius:8px;
  background:#eaf3e7;
  color:#1e6550;
  font-weight:600;
  font-size:12px;
  border:1px solid #c8dcc3;
  cursor:pointer;
  transition:all .15s ease;
}
.btn-open-filters:hover{background:#dfeade}
.btn-open-filters.has-active{
  background:#1e6550;
  color:#fff;
  border-color:#1e6550;
}
.filter-badge-count{
  display:inline-grid;
  place-items:center;
  min-width:18px;
  height:18px;
  padding:0 5px;
  border-radius:9px;
  background:#1e6550;
  color:#fff;
  font-size:11px;
  font-weight:800;
}
.btn-open-filters.has-active .filter-badge-count{
  background:#bad084;
  color:#173f37;
}
.studio-filters-modal-form{padding:6px 0}
.filters-modal-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

/* ==========================================================================
   PUBLICATION EDITOR SEGMENTED TABS & MOBILE VIEWS
   ========================================================================== */
.pub-editor-tabs-bar{
  display:none;
}

/* Upload Dialog with Preview & Explicit Submit */
.upload-dialog-wrap{padding:4px 0}
.upload-dialog-box{
  border:2px dashed #b8ceae;
  border-radius:14px;
  padding:26px 16px;
  text-align:center;
  background:#f8fbf5;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  position:relative;
}
.upload-dialog-icon{font-size:38px}
.upload-dialog-prompt strong{display:block;font-size:15px;color:#173f37}
.upload-dialog-prompt small{font-size:12px;color:#627568}
.upload-file-input{
  position:absolute;
  inset:0;
  opacity:0;
  cursor:pointer;
  width:100%;
  height:100%;
}
.upload-pick-btn{
  pointer-events:none;
  margin-top:6px;
  font-size:13px;
  padding:10px 18px;
}
.upload-preview-area{
  margin-top:14px;
  background:#fff;
  border:1px solid #e1e8dc;
  border-radius:12px;
  padding:12px 16px;
}
.upload-preview-header{
  font-size:13px;
  font-weight:700;
  color:#1e6550;
  margin-bottom:8px;
}
.upload-files-list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.upload-file-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:12px;
  color:#37483e;
  padding:5px 0;
  border-bottom:1px solid #f1f4ee;
}
.upload-file-item:last-child{border-bottom:none}
.upload-file-name{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  max-width:75%;
  font-weight:600;
}
.upload-file-size{color:#7d8f82;font-size:11px}

/* ==========================================================================
   MOBILE MEDIA QUERY RULES (<= 768px)
   ========================================================================== */
@media(max-width:768px){
  .shell{display:block!important;grid-template-columns:1fr!important}
  .sidebar{display:none!important}
  .workspace{padding:0 16px 24px!important}
  
  /* Clutter-free Header */
  .topbar{
    height:60px!important;
    margin-bottom:16px!important;
    border-bottom:1px solid #e1e7dc!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
  }
  .topbar-desktop-left,.topbar-desktop-actions,.hub-header-actions{
    display:none!important;
  }
  .mobile-header-bar{
    display:flex!important;
    align-items:center;
    justify-content:space-between;
    width:100%;
  }
  .mobile-header-brand-wrap{
    display:flex;
    align-items:center;
    gap:8px;
    min-width:0;
  }
  .mobile-header-brand-wrap .brand{
    margin:0!important;
    font-size:22px!important;
    color:#173f37!important;
    cursor:pointer;
    flex-shrink:0;
  }
  .mobile-header-brand-wrap .brand-mark i{background:#1e6550}
  .mobile-header-brand-wrap .brand-mark i:last-child{background:#e8ab85}
  .mobile-header-title{
    font-size:13px;
    font-weight:600;
    color:#627568;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .mobile-hamburger-btn{
    display:inline-flex!important;
  }
  .hub-header{
    display:flex!important;
    justify-content:space-between!important;
    align-items:center!important;
    padding:14px 16px!important;
  }
  .hub-suite-tag{display:none!important}
  .hub-mobile-hamburger{display:inline-flex!important}

  /* Publications Filter mobile optimizations */
  .filter-hub .filter-grid{
    display:none!important;
  }
  .filter-search-row{
    flex-wrap:wrap;
    gap:8px;
  }
  .filter-search-wrap{
    width:100%;
    min-width:100%;
    order:1;
  }
  .btn-open-filters{
    order:2;
    flex:1;
    justify-content:center;
    font-size:13px;
    padding:9px 14px;
  }
  .filter-hub .primary.small{
    order:2;
    padding:9px 16px;
    font-size:13px;
  }
  .filter-total-count{
    order:3;
    width:100%;
    text-align:center;
    margin-top:2px;
  }
  .filters-modal-grid{
    grid-template-columns:1fr;
  }

  /* Publication Editor: Segmented Tabs on Mobile */
  .pub-editor-tabs-bar{
    display:flex!important;
    overflow-x:auto;
    gap:8px;
    padding:10px 0;
    margin-bottom:16px;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
    position:sticky;
    top:0;
    background:#f5f5eff2;
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
    z-index:10;
  }
  .pub-editor-tabs-bar::-webkit-scrollbar{display:none}
  .pub-editor-tab{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:8px 14px;
    border-radius:20px;
    border:1px solid #d5decb;
    background:#fff;
    color:#495e54;
    font-size:13px;
    font-weight:600;
    white-space:nowrap;
    cursor:pointer;
    flex-shrink:0;
    transition:all .15s ease;
    font-family:inherit;
  }
  .pub-editor-tab.active{
    background:#1e6550;
    border-color:#1e6550;
    color:#fff;
    box-shadow:0 3px 10px rgba(30,101,80,0.22);
  }
  .pub-editor-tab.active .pub-tab-badge{
    background:rgba(255,255,255,0.25);
    color:#fff;
  }
  .pub-tab-badge{
    padding:2px 7px;
    border-radius:10px;
    background:#eef3ec;
    color:#556b5f;
    font-size:11px;
    font-weight:700;
  }
  .studio-columns{
    display:block!important;
  }
  .studio-writing[data-pub-tab-content],
  .studio-tab-panel[data-pub-tab-content]{
    display:none;
  }
  .studio-writing[data-pub-tab-content].tab-active,
  .studio-tab-panel[data-pub-tab-content].tab-active{
    display:block;
  }
  .studio-materials{
    display:block!important;
  }
}
/* Hub: barra de seleção de categoria no mobile */
.hub-cat-select-wrap{display:none}
.hub-scan-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-size:18px}
@media(max-width:720px){
  .hub-controls-bar{flex-direction:column;align-items:stretch;gap:12px}
  .hub-tabs{display:none}
  .hub-cat-select-wrap{display:flex;flex-direction:column;gap:6px;width:100%}
  .hub-cat-label{font-size:11px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:#7d8f7c}
  .hub-cat-select{width:100%;min-height:50px;padding:0 44px 0 16px;border:1px solid var(--line,#dfe4db);border-radius:14px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23173f37' stroke-width='3'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right 16px center;color:var(--ink,#173f37);font-size:16px;font-weight:650;appearance:none;-webkit-appearance:none;box-shadow:0 2px 8px rgba(23,63,55,.08)}
  .hub-search-box{min-width:0;max-width:none;width:100%}
  .hub-scan-btn{display:none}
}
/* Login: fontes maiores nos campos */
.auth-form form{max-width:380px}
.auth-form label.field{font-size:15px;gap:8px;margin-bottom:18px}
.auth-form input,.auth-form select{font-size:18px;min-height:52px;padding:12px 14px;border-radius:9px}
.auth-form button{font-size:17px;padding:15px}
.auth-form p{font-size:15px}
.auth-form small{font-size:14px}
.auth-form h2{font-size:30px}
.hub-card.is-clickable{cursor:pointer}
.hub-card.is-clickable:focus-visible{outline:3px solid #bad084;outline-offset:3px}
.hub-card.is-clickable:active{transform:translateY(0) scale(.995)}
/* Instagram: conexão */
.instagram-panel .ig-account{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:16px;border:1px solid var(--line,#dfe4db);border-radius:12px;margin:14px 0;background:#f7faf5}
.instagram-panel .ig-account strong{display:block;font-size:17px}
.instagram-panel .ig-meta{display:flex;flex-direction:column;gap:4px;font-size:13px}
.instagram-panel .ig-actions{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}

.qr-notice{margin:10px 0 0;padding:10px 12px;border-radius:10px;font-weight:700}
.qr-notice.ok{background:#dcf7e6;color:#0b6b35}.qr-notice.warn{background:#fff1d6;color:#7a4a00}
.qr-block{display:grid;gap:8px;margin-top:12px;max-width:360px}
.qr-field{display:grid;gap:4px;font-weight:600}.qr-field input,.qr-field select{min-height:44px;padding:0 12px;border-radius:10px;border:1px solid #cdd8d1;font-size:16px}
:root[data-theme='dark'] .qr-notice.ok{background:#12372a;color:#9ff0c4}:root[data-theme='dark'] .qr-notice.warn{background:#3b2c0b;color:#ffd98a}
