@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(geist-latin.woff2) format("woff2")}
#mcc-app{--font-geist-sans:Geist;--cream:#faf6f0;--white:#fffdfc;--lilac:#a78bfa;--lilac2:#eee5fb;--rose:#c9828f;--rose2:#f8e8eb;--ink:#35283a;--muted:#847984;--line:#e9e0e8;--green:#6d8f78;--shadow:0 14px 42px rgba(77,54,81,.07)}
#mcc-app *{box-sizing:border-box}#mcc-app{background:var(--cream)}#mcc-app{margin:0;background:radial-gradient(circle at 76% 0%,#fff,transparent 36rem),var(--cream);color:var(--ink);font-family:var(--font-geist-sans),Inter,Manrope,"Segoe UI",sans-serif}#mcc-app button,#mcc-app input,#mcc-app select{font:inherit}#mcc-app button{color:inherit}
#mcc-app .shell{min-height:100vh}#mcc-app .sidebar{position:fixed;inset:0 auto 0 0;z-index:30;display:flex;width:268px;flex-direction:column;border-right:1px solid #cab9cd8c;background:linear-gradient(160deg,#ffffffc2,#f7eff9eb),var(--white);padding:38px 22px 26px;backdrop-filter:blur(18px)}
#mcc-app .brand{display:flex;align-items:center;gap:13px;padding:0 10px 46px}#mcc-app .brand>b,#mcc-app .loader{display:grid;width:43px;height:43px;place-items:center;border-radius:15px;background:linear-gradient(145deg,var(--lilac),#d8c9f1);color:#fff;font-size:20px;box-shadow:0 9px 22px #a78bfa47}#mcc-app .brand span{display:flex;flex-direction:column;font-size:18px;line-height:1.12}#mcc-app .brand strong{font-weight:780}
#mcc-app .sidebar nav{display:flex;flex-direction:column;gap:9px}#mcc-app .sidebar nav button{display:flex;align-items:center;gap:16px;border:1px solid transparent;border-radius:17px;background:transparent;padding:15px 17px;color:#514156;cursor:pointer;font-size:16px;text-align:left;transition:.18s}#mcc-app .sidebar nav button i{display:grid;width:22px;place-items:center;font-style:normal;font-size:23px}#mcc-app .sidebar nav button:hover{background:#ffffffb8;transform:translateX(2px)}#mcc-app .sidebar nav button.active{border-color:#d4bee9;background:linear-gradient(135deg,#eadff8,#f0e7fa);color:#62458a;box-shadow:0 8px 22px #7e579e17}
#mcc-app .private{display:flex;align-items:center;gap:12px;margin-top:auto;border:1px solid var(--line);border-radius:16px;background:#ffffffad;padding:14px}#mcc-app .private>i{width:10px;height:10px;border-radius:50%;background:#7ba888;box-shadow:0 0 0 5px #e8f2e9}#mcc-app .private span{display:flex;flex-direction:column}#mcc-app .private b{font-size:13px}#mcc-app .private small{margin-top:2px;color:var(--muted);font-size:11px}
#mcc-app main{min-height:100vh;margin-left:268px;padding:38px 48px 64px}#mcc-app main>header{display:flex;min-height:82px;align-items:center;justify-content:space-between;gap:24px;margin-bottom:32px}#mcc-app main>header h1{margin:2px 0 0;font-size:clamp(30px,3vw,42px);font-weight:780;letter-spacing:-.045em}#mcc-app main>header small,#mcc-app .modal header small,#mcc-app .intro small{color:var(--rose);font-size:12px;font-weight:720;letter-spacing:.1em;text-transform:uppercase}#mcc-app .sectionHeading{display:flex;flex:1;align-items:center}#mcc-app main>header.sectionBar{min-height:88px;margin-bottom:24px;border:1px solid #e5d9e7;border-radius:20px;background:linear-gradient(105deg,#fffdfc,#f8f0fa);padding:15px 18px 15px 24px;box-shadow:inset 5px 0 0 #b59ade,0 12px 34px #4d36510d}#mcc-app main>header.sectionBar h1{margin:0;font-size:clamp(30px,3vw,38px)}#mcc-app main>header.sectionBar .new{min-height:48px}
#mcc-app .new,#mcc-app .submit{display:inline-flex;min-height:52px;align-items:center;justify-content:center;gap:10px;border:0;border-radius:15px;background:linear-gradient(135deg,#cc7889,#c76378);color:#fff;cursor:pointer;font-weight:680;padding:0 24px;box-shadow:0 11px 26px #b85f723b;transition:.18s}#mcc-app .new:hover,#mcc-app .submit:hover{transform:translateY(-2px);box-shadow:0 15px 30px #b85f724a}#mcc-app .new b{font-size:25px;font-weight:400}#mcc-app .stack{display:flex;flex-direction:column;gap:24px}
#mcc-app .metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}#mcc-app .metrics article{display:flex;min-width:0;min-height:205px;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:20px;background:#fffdfcdb;padding:26px 20px;box-shadow:var(--shadow);text-align:center;flex-direction:column;transition:.2s}#mcc-app .metrics article:hover{transform:translateY(-3px);box-shadow:0 18px 48px #4d36511c}#mcc-app .metrics article>i{display:grid;width:58px;height:58px;place-items:center;border-radius:50%;margin-bottom:19px;background:#e9ddf7;color:#68478b;font-size:25px;font-style:normal}#mcc-app .metrics article>i.rose{background:#f9e4e7;color:#a85f6d}#mcc-app .metrics article>i.purple{background:#e2d7f4}#mcc-app .metrics article>span{color:#66566a;font-size:15px}#mcc-app .metrics article>b{max-width:100%;margin:10px 0 7px;overflow:hidden;font-size:clamp(23px,2.1vw,32px);font-weight:780;letter-spacing:-.035em;text-overflow:ellipsis;white-space:nowrap}#mcc-app .metrics article>small{color:var(--muted);font-size:13px}
#mcc-app .panel{overflow:hidden;border:1px solid var(--line);border-radius:21px;background:#fffdfce6;box-shadow:var(--shadow)}#mcc-app .panelHead{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:28px 32px 20px}#mcc-app .panelHead h2,#mcc-app .intro h2{margin:0;font-size:23px;font-weight:750;letter-spacing:-.025em}#mcc-app .panelHead p,#mcc-app .intro p{margin:6px 0 0;color:var(--muted);font-size:13px}#mcc-app .panelHead>b{border-radius:999px;background:var(--lilac2);color:#70508f;font-size:12px;padding:9px 13px}
#mcc-app .invoice{padding:0 32px 20px}#mcc-app .invrow{display:grid;grid-template-columns:minmax(190px,1.5fr) minmax(160px,1fr) minmax(130px,.8fr) 110px;min-height:86px;align-items:center;gap:20px;border-top:1px solid #eee6ec}#mcc-app .invhead{min-height:42px;border-top:0;color:#857487;font-size:10px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}#mcc-app .cname,#mcc-app .due{display:flex;align-items:center;gap:14px}#mcc-app .minicard{display:grid;width:52px;height:36px;place-items:center;border:1px solid #5a3e601f;border-radius:8px;background:linear-gradient(145deg,#e5d2fb,#f1e7ff);color:#61496b;font-style:normal;letter-spacing:-3px;box-shadow:0 5px 12px #634b731a}#mcc-app .minicard.c1{background:linear-gradient(145deg,#f9d6dd,#f7e8e9)}#mcc-app .minicard.c2{background:linear-gradient(145deg,#e5ddfb,#f0ebfa)}#mcc-app .due{font-size:13px}#mcc-app .due>i{display:flex;flex-direction:column;font-style:normal}#mcc-app .due small{margin-top:3px;color:var(--muted);font-size:11px}#mcc-app .invrow em{width:max-content;border:1px solid #ead0d6;border-radius:10px;background:#fbebee;color:#82505b;font-size:12px;font-style:normal;padding:7px 10px}#mcc-app .invrow em.paid{border-color:#d1e2d1;background:#edf4ed;color:#577361}
#mcc-app .invoiceCards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:0 32px 28px}#mcc-app .invoiceCard{display:flex;min-height:255px;flex-direction:column;border:1px solid #e7dce9;border-radius:18px;background:linear-gradient(150deg,#fff,#faf5fc);padding:19px;box-shadow:0 9px 24px #583e6410}#mcc-app .invoiceCard>header{display:flex;align-items:center;gap:12px}#mcc-app .invoiceCard>header span{display:flex;min-width:0;flex-direction:column}#mcc-app .invoiceCard>header b{overflow:hidden;font-size:14px;text-overflow:ellipsis;white-space:nowrap}#mcc-app .invoiceCard>header small,#mcc-app .invoiceValue small,#mcc-app .invoiceMeta small,#mcc-app .noInvoice small{margin-top:3px;color:var(--muted);font-size:10px}#mcc-app .invoiceValue{display:flex;flex-direction:column;margin:23px 0 17px}#mcc-app .invoiceValue>b{margin-top:5px;color:#684b78;font-size:25px}#mcc-app .invoiceMeta{display:flex;justify-content:space-between;gap:12px}#mcc-app .invoiceMeta>span{display:flex;flex-direction:column}#mcc-app .invoiceMeta>span:last-child{align-items:flex-end}#mcc-app .invoiceMeta b{margin-top:4px;font-size:12px}#mcc-app .invoiceMeta em{margin-top:3px;color:var(--rose);font-size:9px;font-style:normal}#mcc-app .invoiceCard>button{min-height:38px;margin-top:auto;border:0;border-radius:11px;background:#eee4f5;color:#684b78;cursor:pointer;font-size:11px;font-weight:750}#mcc-app .noInvoice{display:flex;flex:1;align-items:center;justify-content:center;flex-direction:column;text-align:center}#mcc-app .noInvoice b{color:#75687a;font-size:13px}
#mcc-app .dup{display:flex;width:100%;align-items:center;gap:15px;border:1px solid #eadbb9;border-radius:17px;background:#fff8e4b8;color:#66532d;cursor:pointer;padding:16px 20px;text-align:left}#mcc-app .dup>i{display:grid;width:39px;height:39px;place-items:center;border-radius:12px;background:#fae7b6;color:#a57725;font-style:normal;font-weight:800}#mcc-app .dup>span{display:flex;flex:1;flex-direction:column}#mcc-app .dup span b{font-size:13px}#mcc-app .dup small{margin-top:3px;color:#8b784e;font-size:12px}#mcc-app .dup>strong{font-size:12px}
#mcc-app .listHead{align-items:flex-end}#mcc-app .listActions{display:flex;align-items:center;justify-content:flex-end;gap:10px}#mcc-app .excelBtn{display:inline-flex;min-height:45px;align-items:center;justify-content:center;gap:8px;border:1px solid #cdbbdd;border-radius:14px;background:linear-gradient(135deg,#eee4f7,#e4d4f1);color:#674b7b;cursor:pointer;font-size:12px;font-weight:720;padding:0 15px;white-space:nowrap;box-shadow:0 7px 17px #6b4b7814}#mcc-app .excelBtn b{display:grid;width:22px;height:22px;place-items:center;border-radius:7px;background:#765796;color:#fff;font-size:15px}#mcc-app .excelBtn:hover{border-color:#bca4d3;background:linear-gradient(135deg,#e8dcf3,#dac7ea)}#mcc-app .excelBtn:disabled{cursor:not-allowed;opacity:.45}#mcc-app .search{display:flex;width:min(320px,100%);align-items:center;gap:9px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--muted);padding:0 13px}#mcc-app .search input{width:100%;min-height:43px;border:0;outline:0;background:transparent}#mcc-app .filters{display:flex;flex-wrap:wrap;gap:10px;padding:0 32px 20px}#mcc-app .filters select,#mcc-app .filters label{min-height:40px;border:1px solid var(--line);border-radius:12px;background:#fff;color:#5b4b5e;font-size:12px;padding:0 12px}#mcc-app .filters label{display:flex;align-items:center;gap:7px}#mcc-app .filters input{accent-color:#7557a8}#mcc-app .filters .dueSelect{min-width:190px;border-color:#d9c8e7;background:#fbf8fd;color:#674e75;font-weight:650}#mcc-app .filters .dueSelect:disabled{border-color:var(--line);background:#f5f1f4;color:#a397a4}
#mcc-app .records{padding:0 32px 22px;transition:.18s}#mcc-app .records.loading{opacity:.45}#mcc-app .record{display:grid;grid-template-columns:minmax(220px,1.8fr) minmax(115px,.8fr) 75px 130px 100px 150px;min-height:77px;align-items:center;gap:16px;border-top:1px solid #eee6ec;font-size:12px}#mcc-app .rhead{min-height:40px;border-top:0;color:#857487;font-size:10px;font-weight:750;letter-spacing:.07em;text-transform:uppercase}#mcc-app .desc{display:flex;min-width:0;align-items:center;gap:11px}#mcc-app .desc>i{display:grid;width:38px;height:38px;flex:none;place-items:center;border-radius:12px;background:var(--lilac2);color:#6c4b8b;font-style:normal;font-weight:760}#mcc-app .desc>b{display:flex;min-width:0;flex-direction:column;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#mcc-app .desc small{margin-top:4px;overflow:hidden;color:var(--muted);font-size:10px;font-weight:400;text-overflow:ellipsis}#mcc-app .record>button,#mcc-app .rowActions button{width:max-content;min-height:32px;border:1px solid #d9c7e6;border-radius:10px;background:#f7f1fb;color:#70528a;cursor:pointer;font-size:10px;font-weight:650;padding:0 9px}#mcc-app .record>button.paidBtn{border-color:#d3e3d4;background:#edf4ed;color:#5e8069}#mcc-app .rowActions{display:flex;gap:6px}#mcc-app .rowActions button.deleteBtn{border-color:#ead0d6;background:#fff5f6;color:#9e5866}#mcc-app .empty{display:grid;min-height:130px;place-items:center;color:var(--muted);font-size:13px}
#mcc-app .intro{display:flex;align-items:center;justify-content:space-between;gap:22px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(135deg,#ffffffcc,#efe2f7ad);padding:28px 32px}#mcc-app .intro>b{color:#6f4b82;font-size:clamp(24px,3vw,34px)}#mcc-app .cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}#mcc-app .credit{position:relative;min-height:218px;overflow:hidden;border:1px solid #67476c29;border-radius:22px;background:linear-gradient(145deg,#dbcaf2,#f2e8fb);padding:24px;box-shadow:0 16px 36px #4f375621}#mcc-app .credit.c1{background:linear-gradient(145deg,#f3cbd3,#f9e5e8)}#mcc-app .credit.c2{background:linear-gradient(145deg,#d8d1ec,#eeeafa)}#mcc-app .credit:after{position:absolute;right:-44px;bottom:-90px;width:190px;height:190px;border-radius:50%;background:#ffffff42;content:""}#mcc-app .credit>div{display:flex;justify-content:space-between}#mcc-app .credit>div i{width:31px;height:23px;border-radius:6px;background:linear-gradient(135deg,#e9cd78,#c9a84f)}#mcc-app .credit h3{margin:26px 0 5px;font-size:19px}#mcc-app .credit>p{margin:0;color:#35283ab8;font-size:13px;letter-spacing:.12em}#mcc-app .credit footer{position:absolute;right:24px;bottom:22px;left:24px;z-index:1;display:flex;justify-content:space-between}#mcc-app .credit footer span{display:flex;flex-direction:column}#mcc-app .credit footer span:last-child{align-items:flex-end}#mcc-app .credit footer small{color:#35283a9e;font-size:9px;text-transform:uppercase}#mcc-app .credit footer b{margin-top:3px;font-size:12px}#mcc-app .note{margin:0;color:var(--muted);font-size:12px;text-align:center}
#mcc-app .reports{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}#mcc-app .bars{padding-bottom:24px}#mcc-app .bar{padding:9px 32px}#mcc-app .bar>span{display:flex;justify-content:space-between;margin-bottom:8px;font-size:12px}#mcc-app .bar small{color:var(--muted)}#mcc-app .bar>i{display:block;height:10px;overflow:hidden;border-radius:999px;background:#f1eaf3}#mcc-app .bar>i b{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#b49ade,#8d6dba)}#mcc-app .bar.rose>i b{background:linear-gradient(90deg,#e3a7b1,#c87585)}
#mcc-app .modalBg{position:fixed;inset:0;z-index:80;display:grid;place-items:center;background:#30213361;padding:14px;backdrop-filter:blur(7px)}#mcc-app .modal{width:min(720px,100%);max-height:calc(100dvh - 28px);overflow:auto;border-radius:22px;background:var(--white);padding:21px 26px;box-shadow:0 28px 80px #30213340}#mcc-app .modal header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:14px}#mcc-app .modal h2{margin:2px 0 0;font-size:24px}#mcc-app .modal header button{display:grid;width:36px;height:36px;place-items:center;border:1px solid var(--line);border-radius:11px;background:#fff;cursor:pointer;font-size:23px}#mcc-app .modal form{display:flex;flex-direction:column;gap:10px}#mcc-app .modal form>div{display:flex;gap:13px}#mcc-app .modal form>.purchaseBasics{display:grid;align-items:end;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}#mcc-app .modal label{display:flex;flex:1;flex-direction:column;gap:5px;color:#58485b;font-size:12px;font-weight:620}#mcc-app .modal .amountField{display:flex;min-width:0;flex-direction:column;gap:5px;color:#58485b;font-size:12px;font-weight:620}#mcc-app .amountControl{display:grid;grid-template-columns:minmax(0,1fr) 44px;gap:8px}#mcc-app .amountField input{text-align:right;font-weight:720;letter-spacing:.02em}#mcc-app .calcButtonWrap{position:relative;width:44px;height:42px}#mcc-app .calcIcon{display:block;width:44px;height:42px;border:1px solid #d9cbe3;border-radius:12px;background-color:#f5edf9;background-image:url("/calculator-icon.png");background-position:50% 60%;background-repeat:no-repeat;background-size:auto 34px;cursor:pointer;box-shadow:0 6px 16px #76567f24;transition:.18s}#mcc-app .calcIcon:hover,#mcc-app .calcIcon.active{border-color:#bca4d3;background-color:#eadff4;box-shadow:0 9px 21px #76567f38;transform:translateY(-1px)}#mcc-app .modal input,#mcc-app .modal select{width:100%;min-height:42px;border:1px solid var(--line);border-radius:12px;outline:0;background:#fff;padding:0 13px}#mcc-app .modal input[name=totalAmount]{appearance:textfield;-moz-appearance:textfield}#mcc-app .modal input[name=totalAmount]::-webkit-inner-spin-button,#mcc-app .modal input[name=totalAmount]::-webkit-outer-spin-button{margin:0;-webkit-appearance:none}#mcc-app .modal input:focus,#mcc-app .modal select:focus{border-color:#bea3dc;box-shadow:0 0 0 4px #f1e9f8}#mcc-app .calculator{position:absolute;top:49px;right:0;z-index:8;width:min(290px,calc(100vw - 52px));border:1px solid #dacbe1;border-radius:17px;outline:0;background:#fffdfc;padding:12px;box-shadow:0 20px 50px #35283a33}#mcc-app .calcScreen{display:flex;min-height:57px;align-items:flex-end;justify-content:center;border-radius:12px;background:linear-gradient(135deg,#f3ecf8,#faf6fc);padding:8px 12px;flex-direction:column}#mcc-app .calcScreen small{color:#8a798d;font-size:10px}#mcc-app .calcScreen strong{max-width:100%;overflow:hidden;color:#4c3852;font-size:23px;text-overflow:ellipsis;white-space:nowrap}#mcc-app .calcHint{margin:7px 0 -2px;color:#8a798d;font-size:9px;text-align:center}#mcc-app .calcKeys{display:grid;margin-top:9px;grid-template-columns:repeat(4,1fr);gap:6px}#mcc-app .calcKeys button{min-height:36px;border:1px solid #eee4ef;border-radius:10px;background:#fff;color:#514056;cursor:pointer;font-weight:700}#mcc-app .calcKeys button:hover{background:#f6effa}#mcc-app .calcKeys .function{background:#f5eef7;color:#74517e}#mcc-app .calcKeys .operator,#mcc-app .calcKeys .equals{border-color:#dac7e4;background:#eee2f5;color:#684979}#mcc-app .calculator .useValue{width:100%;min-height:39px;margin-top:9px;border:0;border-radius:11px;background:linear-gradient(135deg,#a88ad1,#8f6dbb);color:#fff;cursor:pointer;font-size:12px;font-weight:750}#mcc-app .calculator .useValue:disabled{cursor:not-allowed;opacity:.45}#mcc-app .modal form>p{margin:0;border-radius:11px;background:var(--lilac2);color:#745b7e;font-size:11px;padding:8px 12px}#mcc-app .modal .modalActions{display:flex;gap:10px}#mcc-app .modal .closeAction{min-height:44px;flex:0 0 130px;border:1px solid #d9c8df;border-radius:13px;background:#fff;color:#6d5872;cursor:pointer;font-weight:680}#mcc-app .modal .submit{width:auto;min-height:44px;flex:1}#mcc-app .submit:disabled{opacity:.6}
#mcc-app .confirm{width:min(430px,100%);border-radius:24px;background:#fff;padding:32px;text-align:center;box-shadow:0 28px 80px #30213340}#mcc-app .confirm>i{display:grid;width:54px;height:54px;margin:0 auto 16px;place-items:center;border-radius:50%;background:#f9e1e5;color:#a75465;font-style:normal;font-weight:800}#mcc-app .confirm h2{margin:0;font-size:23px}#mcc-app .confirm p{margin:10px 0 24px;color:var(--muted);font-size:13px;line-height:1.55}#mcc-app .confirm>div{display:flex;gap:10px}#mcc-app .confirm button{min-height:45px;flex:1;border:1px solid var(--line);border-radius:13px;background:#fff;cursor:pointer;font-weight:700}#mcc-app .confirm button.danger{border:0;background:#bd5d70;color:#fff}#mcc-app .confirm button:disabled{opacity:.6}
#mcc-app .toast{position:fixed;right:28px;bottom:28px;z-index:100;max-width:360px;border-radius:14px;background:#4e3d54;color:#fff;font-size:12px;font-weight:620;padding:14px 17px;box-shadow:0 15px 38px #2d1d313d}#mcc-app .center{display:grid;min-height:100vh;place-items:center;text-align:center;color:var(--muted)}#mcc-app .loader{width:62px;height:62px;margin:auto;font-size:24px}#mcc-app .error{max-width:440px;border:1px solid var(--line);border-radius:22px;background:#fff;padding:35px;box-shadow:var(--shadow)}#mcc-app .error h1{font-size:22px}#mcc-app .error button{border:0;border-radius:12px;background:#7557a8;color:#fff;padding:11px 16px}#mcc-app .hamb,#mcc-app .backdrop{display:none}
@media(max-width:1180px){#mcc-app main{padding-left:28px;padding-right:28px}#mcc-app .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}#mcc-app .invoiceCards{grid-template-columns:repeat(2,minmax(0,1fr))}#mcc-app .records{overflow-x:auto}#mcc-app .record{min-width:920px}#mcc-app .cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:860px){#mcc-app .sidebar{width:min(298px,85vw);transform:translateX(-105%);transition:.22s}#mcc-app .sidebar.open{transform:translateX(0)}#mcc-app .backdrop{position:fixed;inset:0;z-index:20;display:block;border:0;background:#32213547}#mcc-app main{margin-left:0;padding:24px 20px 48px}#mcc-app .hamb{display:grid;width:43px;height:43px;place-items:center;border:1px solid var(--line);border-radius:13px;background:#fff}#mcc-app main>header{min-height:62px;margin-bottom:24px}#mcc-app main>header.sectionBar{min-height:68px;padding:9px 10px 9px 15px;border-radius:16px}#mcc-app main>header>div{flex:1}#mcc-app main>header h1,#mcc-app main>header.sectionBar h1{font-size:27px}#mcc-app .new span{display:none}#mcc-app .new{width:47px;min-height:47px;padding:0}#mcc-app .invrow{grid-template-columns:minmax(160px,1.5fr) 110px 95px}#mcc-app .invrow>:nth-child(2){display:none}#mcc-app .reports{grid-template-columns:1fr}}
@media(max-width:620px){#mcc-app main{padding-left:14px;padding-right:14px}#mcc-app .metrics{grid-template-columns:1fr 1fr;gap:11px}#mcc-app .metrics article{min-height:180px;border-radius:17px;padding:18px 12px}#mcc-app .metrics article>i{width:46px;height:46px;margin-bottom:13px}#mcc-app .metrics article>span{font-size:12px}#mcc-app .metrics article>b{font-size:20px}#mcc-app .metrics article>small{font-size:10px}#mcc-app .dup>strong{display:none}#mcc-app .panelHead,#mcc-app .invoice,#mcc-app .records,#mcc-app .filters,#mcc-app .bar{padding-left:18px;padding-right:18px}#mcc-app .panelHead{padding-top:22px}#mcc-app .invoiceCards{grid-template-columns:1fr;padding:0 18px 22px}#mcc-app .invoiceCard{min-height:240px}#mcc-app .invrow{grid-template-columns:minmax(145px,1.4fr) 92px;gap:12px}#mcc-app .invrow>:nth-child(2),#mcc-app .invrow>:nth-child(4){display:none}#mcc-app .listHead{align-items:stretch;flex-direction:column}#mcc-app .listActions{width:100%;align-items:stretch;flex-direction:column-reverse}#mcc-app .excelBtn{width:100%}#mcc-app .search{width:100%}#mcc-app .filters{display:grid;grid-template-columns:1fr 1fr}#mcc-app .filters select,#mcc-app .filters .dueSelect{width:100%;min-width:0}#mcc-app .cards{grid-template-columns:1fr}#mcc-app .intro{align-items:flex-start;padding:23px;flex-direction:column}#mcc-app .modal form>div{flex-direction:column}#mcc-app .modal form>.purchaseBasics{grid-template-columns:1fr;justify-content:stretch}#mcc-app .modal form>.modalActions{flex-direction:row}#mcc-app .modal .closeAction{flex-basis:105px}#mcc-app .modalBg{padding:10px}#mcc-app .modal{max-height:calc(100dvh - 20px);padding:19px 16px}#mcc-app .toast{right:14px;bottom:14px}}
@media(prefers-reduced-motion:reduce){#mcc-app *{transition-duration:.01ms!important;animation-duration:.01ms!important}}
#mcc-app .calculator{position:fixed;top:50%;right:calc(50% - 334px);z-index:95;width:min(290px,calc(100vw - 32px));box-shadow:0 24px 60px #35283a4d;transform:translateY(-50%)}
@media(max-width:860px){#mcc-app .calculator{right:24px}}
@media(max-width:620px){#mcc-app .calculator{right:auto;left:50%;transform:translate(-50%,-50%)}}
#mcc-app .creditActions{display:flex;position:relative;z-index:2;gap:6px}#mcc-app .creditActions button,#mcc-app .registryRow button{min-height:30px;border:1px solid #6d52752b;border-radius:9px;background:#ffffff9c;color:#59415f;cursor:pointer;font-size:10px;font-weight:720;padding:0 9px}#mcc-app .creditActions button:hover,#mcc-app .registryRow button:hover{background:#fff}#mcc-app .creditActions button.deleteBtn,#mcc-app .registryRow button.deleteBtn{border-color:#af596a38;background:#fff5f6b8;color:#985263}#mcc-app .emptyRegistry{display:grid;min-height:150px;place-items:center;border:1px dashed #d9cbdc;border-radius:19px;color:var(--muted);font-size:13px}#mcc-app .registryList{padding:8px 30px}#mcc-app .registryRow{display:flex;min-height:78px;align-items:center;gap:14px;border-bottom:1px solid #eee6ec}#mcc-app .registryRow:last-child{border-bottom:0}#mcc-app .registryRow>i{display:grid;width:42px;height:42px;flex:none;place-items:center;border-radius:13px;background:linear-gradient(145deg,#eadff7,#dfcff0);color:#684b7e;font-style:normal;font-weight:780}#mcc-app .registryRow>span{display:flex;min-width:0;flex:1;flex-direction:column}#mcc-app .registryRow>span b{font-size:14px}#mcc-app .registryRow>span small{margin-top:4px;color:var(--muted);font-size:11px}#mcc-app .registryRow>div{display:flex;gap:7px}#mcc-app .registryModal{width:min(560px,100%);overflow:visible}#mcc-app .registryModal.personModal{width:min(480px,100%)}#mcc-app .registryModal input[type=number]{appearance:textfield;-moz-appearance:textfield}#mcc-app .registryModal input[type=number]::-webkit-inner-spin-button,#mcc-app .registryModal input[type=number]::-webkit-outer-spin-button{margin:0;-webkit-appearance:none}
@media(max-width:620px){#mcc-app .registryList{padding:5px 16px}#mcc-app .registryRow{align-items:flex-start;padding:15px 0;flex-wrap:wrap}#mcc-app .registryRow>span{padding-top:5px}#mcc-app .registryRow>div{width:100%;padding-left:56px}#mcc-app .registryRow button{min-height:34px}#mcc-app .creditActions button{padding:0 7px}}
#mcc-app,html[data-theme=lilas] #mcc-app{--theme-page:#faf6f0;--theme-glow:#fff;--theme-accent:#a78bfa;--theme-dark:#684b82;--theme-soft:#eee5fb;--theme-soft2:#f7eff9;--theme-action:#cc7889;--theme-action2:#c76378;--theme-line:#e9e0e8;--theme-shadow:#76567f2b}
html[data-theme=rose] #mcc-app{--cream:#fff7f5;--white:#fffdfc;--lilac:#d88798;--lilac2:#f9e5e9;--rose:#b86072;--rose2:#fce9ec;--ink:#422d34;--muted:#8d777d;--line:#eedde1;--green:#79927d;--theme-page:#fff7f5;--theme-glow:#fffefd;--theme-accent:#d88798;--theme-dark:#8c4d5b;--theme-soft:#f9e5e9;--theme-soft2:#fdf0f2;--theme-action:#ce7184;--theme-action2:#b95d70;--theme-line:#eedde1;--theme-shadow:#a9546828}
html[data-theme=salvia] #mcc-app{--cream:#f6f8f4;--white:#fffefa;--lilac:#789887;--lilac2:#e5efe8;--rose:#c98c6d;--rose2:#f7e9e0;--ink:#2e3b34;--muted:#728077;--line:#dfe8e1;--green:#6f907b;--theme-page:#f6f8f4;--theme-glow:#fffefa;--theme-accent:#789887;--theme-dark:#4f725f;--theme-soft:#e5efe8;--theme-soft2:#eff5f0;--theme-action:#8aa892;--theme-action2:#6f907b;--theme-line:#dfe8e1;--theme-shadow:#55715f29}
#mcc-app{background:radial-gradient(circle at 76% 0%,var(--theme-glow),transparent 36rem),var(--theme-page)}#mcc-app .sidebar{border-color:var(--theme-line);background:linear-gradient(160deg,#ffffffc9,var(--theme-soft2)),var(--white)}#mcc-app .brand>b,#mcc-app .loader{background:linear-gradient(145deg,var(--theme-accent),var(--theme-soft));box-shadow:0 9px 22px var(--theme-shadow)}#mcc-app .sidebar nav button.active{border-color:var(--theme-accent);background:linear-gradient(135deg,var(--theme-soft),var(--theme-soft2));color:var(--theme-dark);box-shadow:0 8px 22px var(--theme-shadow)}#mcc-app main>header.sectionBar{border-color:var(--theme-line);background:linear-gradient(105deg,var(--white),var(--theme-soft2));box-shadow:inset 5px 0 0 var(--theme-accent),0 12px 34px var(--theme-shadow)}#mcc-app .new,#mcc-app .submit{background:linear-gradient(135deg,var(--theme-action),var(--theme-action2));box-shadow:0 11px 26px var(--theme-shadow)}#mcc-app .new:hover,#mcc-app .submit:hover{box-shadow:0 15px 30px var(--theme-shadow)}#mcc-app .intro{background:linear-gradient(135deg,#ffffffd6,var(--theme-soft))}#mcc-app .intro>b,#mcc-app .invoiceValue>b{color:var(--theme-dark)}#mcc-app .metrics article>i,#mcc-app .metrics article>i.purple{background:var(--theme-soft);color:var(--theme-dark)}#mcc-app .panelHead>b,#mcc-app .desc>i,#mcc-app .registryRow>i{background:var(--theme-soft);color:var(--theme-dark)}#mcc-app .invoiceCard>button{background:var(--theme-soft);color:var(--theme-dark)}#mcc-app .filters .dueSelect{border-color:var(--theme-accent);background:var(--theme-soft2);color:var(--theme-dark)}#mcc-app .modal input:focus,#mcc-app .modal select:focus{border-color:var(--theme-accent);box-shadow:0 0 0 4px var(--theme-soft)}#mcc-app .modal form>p,#mcc-app .calcScreen{background:var(--theme-soft);color:var(--theme-dark)}#mcc-app .calcIcon{border-color:var(--theme-line);background-color:var(--theme-soft2)}#mcc-app .calcIcon:hover,#mcc-app .calcIcon.active{border-color:var(--theme-accent);background-color:var(--theme-soft);box-shadow:0 9px 21px var(--theme-shadow)}#mcc-app .calculator .useValue,#mcc-app .bar>i b{background:linear-gradient(90deg,var(--theme-accent),var(--theme-dark))}#mcc-app .appearanceBtn{display:flex;min-height:58px;align-items:center;gap:13px;margin-top:auto;border:1px solid var(--theme-line);border-radius:16px;background:#ffffffb5;color:var(--theme-dark);cursor:pointer;padding:9px 13px;text-align:left;transition:.18s}#mcc-app .appearanceBtn:hover{border-color:var(--theme-accent);background:var(--theme-soft2);transform:translateY(-1px)}#mcc-app .appearanceBtn>i{display:grid;width:35px;height:35px;place-items:center;border-radius:12px;background:linear-gradient(145deg,var(--theme-accent),var(--theme-soft));color:#fff;font-size:18px;font-style:normal}#mcc-app .appearanceBtn>span{display:flex;flex-direction:column}#mcc-app .appearanceBtn b{font-size:13px}#mcc-app .appearanceBtn small{margin-top:2px;color:var(--muted);font-size:10px}#mcc-app .sidebar .private{margin-top:10px}#mcc-app .themePicker{width:min(560px,100%);border:1px solid var(--theme-line);border-radius:24px;background:var(--white);padding:25px;box-shadow:0 28px 80px #30213340}#mcc-app .themePicker>header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:20px}#mcc-app .themePicker header small{color:var(--theme-action2);font-size:11px;font-weight:750;letter-spacing:.1em;text-transform:uppercase}#mcc-app .themePicker h2{margin:4px 0 0;font-size:27px}#mcc-app .themePicker header p{margin:5px 0 0;color:var(--muted);font-size:12px}#mcc-app .themePicker header>button{display:grid;width:38px;height:38px;place-items:center;border:1px solid var(--theme-line);border-radius:12px;background:#fff;cursor:pointer;font-size:23px}#mcc-app .themeOptions{display:grid;gap:10px}#mcc-app .themeOptions>button{display:grid;min-height:80px;align-items:center;grid-template-columns:92px 1fr 34px;gap:14px;border:1px solid var(--theme-line);border-radius:17px;background:#fff;cursor:pointer;padding:12px 15px;text-align:left;transition:.18s}#mcc-app .themeOptions>button:hover{transform:translateY(-1px);box-shadow:0 9px 24px var(--theme-shadow)}#mcc-app .themeOptions>button.selected{border:2px solid var(--theme-accent);background:var(--theme-soft2)}#mcc-app .themeSwatches{display:flex}#mcc-app .themeSwatches i{width:34px;height:34px;border:3px solid #fff;border-radius:50%;box-shadow:0 3px 9px #38253f24}#mcc-app .themeSwatches i+ i{margin-left:-9px}#mcc-app .themeOptions>button>span:nth-child(2){display:flex;flex-direction:column}#mcc-app .themeOptions b{font-size:14px}#mcc-app .themeOptions small{margin-top:4px;color:var(--muted);font-size:11px}#mcc-app .themeOptions strong{display:grid;width:28px;height:28px;place-items:center;border-radius:50%;background:var(--theme-accent);color:#fff}#mcc-app .themeDone{width:100%;min-height:46px;margin-top:17px;border:0;border-radius:14px;background:linear-gradient(135deg,var(--theme-action),var(--theme-action2));color:#fff;cursor:pointer;font-weight:750}
html[data-theme=rose] #mcc-app .credit{background:linear-gradient(145deg,#f1cbd3,#fbe8eb)}html[data-theme=rose] #mcc-app .credit.c1{background:linear-gradient(145deg,#edbcc7,#f7dce2)}html[data-theme=rose] #mcc-app .credit.c2{background:linear-gradient(145deg,#e8ced5,#f8e9ec)}html[data-theme=salvia] #mcc-app .credit{background:linear-gradient(145deg,#cfe0d5,#eaf2ec)}html[data-theme=salvia] #mcc-app .credit.c1{background:linear-gradient(145deg,#d9e6d8,#f0f4e9)}html[data-theme=salvia] #mcc-app .credit.c2{background:linear-gradient(145deg,#c9dcd1,#e4eee8)}
@media(max-width:620px){#mcc-app .themePicker{padding:20px 16px}#mcc-app .themeOptions>button{grid-template-columns:78px 1fr 28px;padding:11px}#mcc-app .themeSwatches i{width:30px;height:30px}}


/* Ajuste 1.4.1: menu lateral mais compacto, rolável e responsivo */
#mcc-app .sidebar{
  padding:22px 18px 18px;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:var(--theme-accent) transparent;
}
#mcc-app .sidebar::-webkit-scrollbar{width:6px}
#mcc-app .sidebar::-webkit-scrollbar-track{background:transparent}
#mcc-app .sidebar::-webkit-scrollbar-thumb{border-radius:999px;background:var(--theme-accent)}
#mcc-app .brand{gap:11px;padding:0 8px 22px}
#mcc-app .brand>b{width:39px;height:39px;border-radius:13px;font-size:18px}
#mcc-app .brand span{font-size:16px;line-height:1.15}
#mcc-app .sidebar nav{gap:4px}
#mcc-app .sidebar nav button{
  min-height:46px;
  gap:13px;
  border-radius:14px;
  padding:10px 13px;
  font-size:14px;
}
#mcc-app .sidebar nav button i{width:20px;font-size:20px}
#mcc-app .appearanceBtn{min-height:50px;gap:11px;margin-top:12px;padding:7px 11px}
#mcc-app .appearanceBtn>i{width:32px;height:32px;border-radius:10px;font-size:16px}
#mcc-app .appearanceBtn b{font-size:12px}
#mcc-app .appearanceBtn small{font-size:9px}
#mcc-app .private{gap:10px;margin-top:8px;padding:10px 11px}
#mcc-app .private b{font-size:12px}
#mcc-app .private small{font-size:10px}

@media(max-width:860px){
  #mcc-app .sidebar{
    width:min(282px,86vw);
    padding:18px 15px 16px;
  }
  #mcc-app .brand{padding-bottom:18px}
  #mcc-app .sidebar nav button{min-height:44px;padding:9px 12px;font-size:14px}
  #mcc-app main{padding:20px 16px 42px}
}

@media(max-width:620px){
  #mcc-app .sidebar{width:min(270px,88vw)}
  #mcc-app .brand span{font-size:15px}
  #mcc-app .sidebar nav{gap:3px}
  #mcc-app .sidebar nav button{min-height:42px;gap:11px;padding:8px 11px;font-size:13px}
  #mcc-app .sidebar nav button i{font-size:18px}
  #mcc-app main>header h1,#mcc-app main>header.sectionBar h1{font-size:24px}
}

@media(max-height:720px) and (min-width:861px){
  #mcc-app .sidebar{padding-top:16px;padding-bottom:14px}
  #mcc-app .brand{padding-bottom:14px}
  #mcc-app .sidebar nav{gap:2px}
  #mcc-app .sidebar nav button{min-height:40px;padding:7px 12px;font-size:13px}
  #mcc-app .appearanceBtn{min-height:44px;margin-top:8px}
  #mcc-app .private{margin-top:6px;padding:8px 10px}
}

/* Ajuste 2.0.4: cabeçalho do menu sempre visível no computador, tablet e celular */
#mcc-app .brand{
  flex:none;
  min-height:48px;
  padding-top:4px;
  padding-bottom:20px;
}
#mcc-app .brand span{
  min-width:0;
  font-size:16px;
  line-height:1.18;
}
#mcc-app .brand strong{
  display:block;
  white-space:normal;
}
body.admin-bar #mcc-app .sidebar{
  top:32px;
  height:calc(100dvh - 32px);
}
@media(max-width:782px){
  body.admin-bar #mcc-app .sidebar{
    top:46px;
    height:calc(100dvh - 46px);
  }
}
@media(max-height:720px) and (min-width:861px){
  #mcc-app .brand{
    min-height:44px;
    padding-top:2px;
    padding-bottom:12px;
  }
  #mcc-app .brand span{font-size:15px}
}
@media(max-width:620px){
  #mcc-app .brand{
    min-height:44px;
    padding-top:2px;
    padding-bottom:14px;
  }
  #mcc-app .brand span{font-size:15px}
}

/* Versão 2.0.5: novos ícones e central de configurações */
#mcc-app .sidebar nav button i.mcc-image-icon {
  width: 24px !important;
  height: 24px !important;
  flex: 0 0 24px !important;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  filter: none !important;
}
#mcc-app .sidebar nav button.active i.mcc-image-icon { transform: scale(1.05); }
#mcc-app .mcc-original-appearance { display: none !important; }
#mcc-app .mcc-settings-button {
  width: 100%; border: 1px solid var(--border, #eadde1); background: rgba(255,255,255,.72);
  border-radius: 17px; padding: 10px 12px; display: grid; grid-template-columns: 34px 1fr 14px;
  align-items: center; gap: 9px; text-align: left; color: inherit; cursor: pointer; margin-top: 8px;
  box-shadow: 0 8px 22px rgba(85,55,68,.05); transition: .2s ease;
}
#mcc-app .mcc-settings-button:hover { transform: translateY(-1px); box-shadow: 0 10px 25px rgba(85,55,68,.09); }
#mcc-app .mcc-settings-button > i {
  width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center;
  font-style: normal; font-size: 18px; color: #fff; background: linear-gradient(145deg,var(--primary,#d88798),var(--primary-dark,#b86072));
}
#mcc-app .mcc-settings-button span { min-width: 0; display: flex; flex-direction: column; line-height: 1.18; }
#mcc-app .mcc-settings-button b { font-size: 13px; }
#mcc-app .mcc-settings-button small { font-size: 10px; opacity: .65; margin-top: 3px; }
#mcc-app .mcc-settings-button strong { font-size: 20px; opacity: .45; }

.mcc-settings-overlay {
  position: fixed; inset: 0; z-index: 999999; background: rgba(42,29,35,.38); backdrop-filter: blur(5px);
  display: grid; place-items: center; padding: 18px; font-family: inherit;
}
.mcc-settings-modal {
  width: min(720px,100%); max-height: min(760px,calc(100vh - 36px)); overflow: auto;
  background: #fffafc; border: 1px solid #f0dfe5; border-radius: 26px; padding: 22px;
  box-shadow: 0 28px 80px rgba(58,31,42,.24); color: #49363e;
}
.mcc-settings-modal header { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; margin-bottom: 18px; }
.mcc-settings-modal header small { color: #b56e80; text-transform: uppercase; letter-spacing: .11em; font-weight: 800; font-size: 10px; }
.mcc-settings-modal header h2 { margin: 4px 0 3px; font-size: 27px; line-height: 1.1; }
.mcc-settings-modal header p { margin: 0; opacity: .68; font-size: 13px; }
.mcc-settings-close { border: 0; width: 38px; height: 38px; border-radius: 50%; background: #f8e8ed; color: #8a5060; font-size: 25px; cursor: pointer; flex: 0 0 auto; }
.mcc-settings-grid { display: grid; gap: 11px; }
.mcc-setting-card {
  width: 100%; border: 1px solid #eedce2; border-radius: 18px; background: #fff; padding: 15px;
  display: grid; grid-template-columns: 43px 1fr 18px; gap: 12px; align-items: center; text-align: left;
  color: inherit; cursor: pointer; transition: .18s ease; box-sizing: border-box;
}
.mcc-setting-card:hover { border-color: #dca9b7; transform: translateY(-1px); box-shadow: 0 10px 28px rgba(98,54,70,.08); }
.mcc-setting-card > i { width: 43px; height: 43px; border-radius: 14px; display: grid; place-items: center; font-style: normal; font-size: 20px; background: #f9e5ea; color: #a95f73; }
.mcc-setting-card.backup > i { background: #e5f2e8; color: #4e8661; }
.mcc-setting-card.restore > i { background: #e8eefb; color: #5675aa; }
.mcc-setting-card span { display: flex; flex-direction: column; line-height: 1.25; }
.mcc-setting-card b { font-size: 14px; }
.mcc-setting-card small { font-size: 11px; opacity: .64; margin-top: 4px; }
.mcc-setting-card strong { font-size: 22px; opacity: .35; }
.mcc-setting-card[disabled] { opacity: .6; pointer-events: none; }
.mcc-settings-note { margin-top: 14px; border-radius: 16px; padding: 12px 14px; background: #f6f1f3; display: flex; gap: 10px; align-items: center; }
.mcc-settings-note > i { color: #73aa83; font-style: normal; font-size: 12px; }
.mcc-settings-note span { display: flex; flex-direction: column; }
.mcc-settings-note b { font-size: 12px; }
.mcc-settings-note small { font-size: 10px; opacity: .6; margin-top: 2px; }
.mcc-toast { position: fixed; left: 50%; bottom: 24px; z-index: 1000000; transform: translate(-50%,30px); opacity: 0; pointer-events: none; background: #334b3b; color: #fff; border-radius: 999px; padding: 12px 18px; font: 600 13px/1.2 Arial,sans-serif; box-shadow: 0 12px 30px rgba(0,0,0,.18); transition: .25s ease; }
.mcc-toast.error { background: #8d3c4f; }
.mcc-toast.show { opacity: 1; transform: translate(-50%,0); }
@media (max-width: 640px) {
  .mcc-settings-overlay { padding: 10px; place-items: end center; }
  .mcc-settings-modal { border-radius: 24px 24px 18px 18px; padding: 18px 15px; max-height: 88vh; }
  .mcc-settings-modal header h2 { font-size: 23px; }
  .mcc-setting-card { padding: 13px 12px; grid-template-columns: 40px 1fr 14px; gap: 10px; }
  .mcc-setting-card > i { width: 40px; height: 40px; }
  #mcc-app .mcc-settings-button { margin-bottom: 4px; }
}


/* Versão 2.0.6: ícones do menu e central de configurações corrigidos */
#mcc-app .sidebar nav button i.mcc-image-icon{
  width:24px !important;
  height:24px !important;
  flex:0 0 24px !important;
  display:grid;
  place-items:center;
}
#mcc-app .sidebar nav button i.mcc-image-icon img.mcc-menu-img{
  display:block;
  width:22px;
  height:22px;
  object-fit:contain;
}
#mcc-app .mcc-original-appearance,
#mcc-app .mcc-original-private{
  display:none !important;
}
#mcc-app .mcc-settings-button{
  width:100%;
  display:grid;
  grid-template-columns:34px 1fr 14px;
  align-items:center;
  gap:10px;
  margin-top:10px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#ffffffc7;
  text-align:left;
  cursor:pointer;
  box-shadow:0 8px 22px rgba(85,55,68,.06);
}
#mcc-app .mcc-settings-button:hover{transform:translateY(-1px)}
#mcc-app .mcc-settings-button > i{
  width:34px;height:34px;border-radius:11px;display:grid;place-items:center;
  font-style:normal;font-size:18px;color:#fff;
  background:linear-gradient(145deg,#d88798,#b86072);
}
#mcc-app .mcc-settings-button span{display:flex;flex-direction:column;min-width:0;line-height:1.15}
#mcc-app .mcc-settings-button b{font-size:13px}
#mcc-app .mcc-settings-button small{font-size:10px;color:var(--muted);margin-top:3px}
#mcc-app .mcc-settings-button strong{font-size:18px;opacity:.35}


/* Versão 2.0.7: menu mais legível e setas alinhadas */
@media (min-width: 861px){
  #mcc-app .sidebar{width:286px;padding-left:20px;padding-right:20px}
  #mcc-app main{margin-left:286px}
}
#mcc-app .sidebar nav button{
  min-height:50px;
  gap:14px;
  padding:11px 14px;
  font-size:15px;
}
#mcc-app .sidebar nav button i.mcc-image-icon{
  width:29px !important;
  height:29px !important;
  flex:0 0 29px !important;
}
#mcc-app .sidebar nav button i.mcc-image-icon img.mcc-menu-img{
  width:27px;
  height:27px;
}
#mcc-app .mcc-settings-button{
  grid-template-columns:40px minmax(0,1fr) 18px;
  gap:11px;
  padding:11px 13px;
}
#mcc-app .mcc-settings-button > i{
  width:40px;
  height:40px;
  border-radius:13px;
  font-size:20px;
}
#mcc-app .mcc-settings-button b{font-size:14px}
#mcc-app .mcc-settings-button small{font-size:10.5px;line-height:1.25}
#mcc-app .mcc-settings-button strong{
  justify-self:end;
  align-self:center;
  line-height:1;
  margin-left:6px;
}
.mcc-setting-card{
  grid-template-columns:46px minmax(0,1fr) 24px;
  gap:13px;
}
.mcc-setting-card strong{
  justify-self:end;
  align-self:center;
  width:24px;
  text-align:center;
  line-height:1;
  margin-left:8px;
}
.mcc-setting-card span{min-width:0;padding-right:4px}
@media(max-width:860px){
  #mcc-app .sidebar nav button{font-size:14.5px;min-height:47px}
  #mcc-app .sidebar nav button i.mcc-image-icon{width:27px !important;height:27px !important;flex-basis:27px !important}
  #mcc-app .sidebar nav button i.mcc-image-icon img.mcc-menu-img{width:25px;height:25px}
}
@media(max-width:620px){
  #mcc-app .sidebar nav button{font-size:14px;min-height:45px}
  #mcc-app .sidebar nav button i.mcc-image-icon{width:25px !important;height:25px !important;flex-basis:25px !important}
  #mcc-app .sidebar nav button i.mcc-image-icon img.mcc-menu-img{width:23px;height:23px}
  .mcc-setting-card{grid-template-columns:42px minmax(0,1fr) 22px;gap:10px}
  .mcc-setting-card strong{width:22px;margin-left:4px}
}


/* Versão 2.0.8: ícone de faturas e botão configurações ajustados */
#mcc-app .mcc-settings-button{grid-template-columns:40px 1fr !important;gap:12px !important;}
#mcc-app .mcc-settings-button strong{display:none !important;}
#mcc-app .mcc-settings-button > i{background:none !important;color:inherit !important;padding:0 !important;}
#mcc-app .mcc-settings-button > i.mcc-settings-icon-wrap{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:linear-gradient(145deg,#d88798,#b86072) !important;}
#mcc-app .mcc-settings-button > i.mcc-settings-icon-wrap img.mcc-settings-img{display:block;width:20px;height:20px;object-fit:contain;filter:brightness(0) invert(1);}


/* Versão 2.0.9: início mais compacto e configurações integrada ao menu */
#mcc-app .metrics{gap:16px}
#mcc-app .metrics article{
  min-height:150px;
  padding:18px 18px;
  border-radius:18px;
}
#mcc-app .metrics article>i{
  width:46px;
  height:46px;
  margin-bottom:12px;
  font-size:21px;
}
#mcc-app .metrics article>span{font-size:13px}
#mcc-app .metrics article>b{
  margin:7px 0 5px;
  font-size:clamp(21px,1.8vw,28px);
}
#mcc-app .metrics article>small{font-size:11px}
#mcc-app .panelHead{padding:22px 26px 15px}
#mcc-app .panelHead h2{font-size:21px}
#mcc-app .panelHead p{font-size:12px}
#mcc-app .invoiceCards{gap:13px;padding:0 26px 22px}
#mcc-app .invoiceCard{
  min-height:195px;
  padding:16px;
  border-radius:16px;
}
#mcc-app .invoiceCard>header b{font-size:13px}
#mcc-app .invoiceValue{margin:16px 0 12px}
#mcc-app .invoiceValue>b{font-size:22px}
#mcc-app .invoiceMeta b{font-size:11px}
#mcc-app .invoiceCard>button{min-height:34px;font-size:10.5px}
#mcc-app .noInvoice b{font-size:12px}

/* Configurações passa a ser um item comum do menu */
#mcc-app .sidebar nav .mcc-settings-button{
  display:flex !important;
  grid-template-columns:none !important;
  width:100%;
  min-height:48px;
  align-items:center;
  gap:15px !important;
  margin:0 !important;
  border:1px solid transparent !important;
  border-radius:15px !important;
  background:transparent !important;
  padding:10px 14px !important;
  color:#514156 !important;
  box-shadow:none !important;
  text-align:left;
  font-size:15px !important;
  font-weight:400 !important;
}
#mcc-app .sidebar nav .mcc-settings-button:hover{
  background:#ffffffb8 !important;
  transform:translateX(2px) !important;
}
#mcc-app .sidebar nav .mcc-settings-button>i.mcc-image-icon{
  width:26px !important;
  height:26px !important;
  flex:0 0 26px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:0 !important;
  background:none !important;
}
#mcc-app .sidebar nav .mcc-settings-button>i.mcc-image-icon img.mcc-menu-img{
  width:24px !important;
  height:24px !important;
  filter:none !important;
}
@media(max-width:620px){
  #mcc-app .metrics{gap:10px}
  #mcc-app .metrics article{min-height:138px;padding:14px 10px}
  #mcc-app .metrics article>i{width:40px;height:40px;margin-bottom:9px;font-size:18px}
  #mcc-app .metrics article>span{font-size:11px}
  #mcc-app .metrics article>b{font-size:18px;margin:6px 0 4px}
  #mcc-app .metrics article>small{font-size:9px}
  #mcc-app .panelHead{padding:19px 18px 13px}
  #mcc-app .panelHead h2{font-size:19px}
  #mcc-app .invoiceCards{padding:0 18px 18px}
  #mcc-app .invoiceCard{min-height:180px;padding:14px}
  #mcc-app .sidebar nav .mcc-settings-button{min-height:46px;padding:9px 13px !important;font-size:14px !important}
}


/* Versão 2.0.10: filtros de lançamentos alinhados lado a lado */
@media (min-width: 961px){
  #mcc-app .filters{
    display:grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap:12px;
    align-items:center;
  }
  #mcc-app .filters select,
  #mcc-app .filters label,
  #mcc-app .filters .dueSelect{
    width:100%;
    min-width:0;
  }
}
@media (min-width: 621px) and (max-width: 960px){
  #mcc-app .filters{
    display:grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:12px;
    align-items:center;
  }
  #mcc-app .filters select,
  #mcc-app .filters label,
  #mcc-app .filters .dueSelect{
    width:100%;
    min-width:0;
  }
}


/* Versão 2.0.13: vencimentos disponíveis em todos os cartões e ordenação */
#mcc-app .filters .mcc-sort-select{
  width:100%;
  min-width:0;
  min-height:40px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
  color:#5b4b5e;
  font-size:12px;
  padding:0 12px;
}
@media (min-width: 1101px){
  #mcc-app .filters{
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  }
}
@media (min-width: 621px) and (max-width: 1100px){
  #mcc-app .filters{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  #mcc-app .filters .mcc-sort-select:last-child{
    grid-column:1 / -1;
  }
}
@media (max-width:620px){
  #mcc-app .filters .mcc-sort-select{
    grid-column:1 / -1;
  }
}


/* Versão 2.0.14: filtros mais alinhados e campo de ordem mais visível */
#mcc-app .filters select,
#mcc-app .filters .mcc-sort-select{
  text-overflow:ellipsis;
}
@media (min-width: 1101px){
  #mcc-app .filters{
    grid-template-columns: 1.04fr 1.04fr 1.04fr 1.16fr 1.22fr !important;
    gap: 10px;
  }
  #mcc-app .filters select,
  #mcc-app .filters .mcc-sort-select{
    font-size: 11.5px;
    padding: 0 10px;
  }
}
@media (min-width: 621px) and (max-width: 1100px){
  #mcc-app .filters{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px;
  }
  #mcc-app .filters .dueSelect,
  #mcc-app .filters .mcc-sort-select{
    grid-column: span 1;
  }
}


/* Versão 2.0.15: calculadora e botão de fechar centralizados */
#mcc-app .modal header button{
  display:grid !important;
  place-items:center !important;
  width:40px !important;
  height:40px !important;
  padding:0 !important;
  line-height:1 !important;
  border:1px solid #e7b6c2 !important;
  border-radius:12px !important;
  background:linear-gradient(145deg,#fdecef,#f6d9e1) !important;
  color:#a54f65 !important;
  font-size:27px !important;
  font-weight:700 !important;
  box-shadow:0 7px 18px rgba(165,79,101,.14) !important;
}
#mcc-app .modal header button:hover{
  background:linear-gradient(145deg,#f9dfe5,#efc5d0) !important;
  color:#8e3f54 !important;
  transform:translateY(-1px);
}
#mcc-app .calcButtonWrap{
  display:grid !important;
  place-items:center !important;
  width:44px !important;
  height:42px !important;
}
#mcc-app .calcIcon{
  display:grid !important;
  place-items:center !important;
  width:44px !important;
  height:42px !important;
  padding:0 !important;
  background-position:center !important;
  background-size:30px 30px !important;
}
@media(max-width:620px){
  #mcc-app .modal header button{width:38px !important;height:38px !important;font-size:25px !important}
}


/* Versão 2.0.16: calculadora sem borda e mais alinhada ao campo */
#mcc-app .amountControl{
  align-items:center;
}
#mcc-app .calcButtonWrap{
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:42px;
}
#mcc-app .calcIcon{
  width:36px !important;
  height:36px !important;
  border:0 !important;
  border-radius:10px;
  background-color:transparent !important;
  background-position:center center !important;
  background-size:auto 30px !important;
  box-shadow:none !important;
}
#mcc-app .calcIcon:hover,
#mcc-app .calcIcon.active{
  border:0 !important;
  background-color:rgba(216,135,152,.12) !important;
  box-shadow:none !important;
  transform:none !important;
}


/* Versão 2.0.16: modal de compra com título limpo e melhor espaçamento */
#mcc-app .modal.mcc-purchase-modal header{
  margin-bottom:18px;
}
#mcc-app .modal.mcc-purchase-modal h2{
  margin:0;
}
#mcc-app .modal.mcc-purchase-modal form{
  gap:14px;
}
#mcc-app .modal.mcc-purchase-modal label,
#mcc-app .modal.mcc-purchase-modal .amountField{
  gap:8px;
}
#mcc-app .modal.mcc-purchase-modal input,
#mcc-app .modal.mcc-purchase-modal select{
  margin-top:2px;
}
#mcc-app .modal.mcc-purchase-modal .purchaseBasics,
#mcc-app .modal.mcc-purchase-modal form>div{
  gap:16px;
}


/* Versão 2.0.19: fontes personalizáveis, tamanho do texto e novas paletas */
html[data-theme=laranja] #mcc-app{
  --cream:#fff8f1;--white:#fffdfa;--lilac:#e59a58;--lilac2:#fff0df;--rose:#c86f37;--rose2:#fde9d9;
  --ink:#4b3122;--muted:#8b7465;--line:#f0ddcf;--green:#79927d;
  --theme-page:#fff8f1;--theme-glow:#fffdf9;--theme-accent:#e59a58;--theme-dark:#a95528;
  --theme-soft:#fff0df;--theme-soft2:#fff7ec;--theme-action:#de8245;--theme-action2:#c86f37;
  --theme-line:#f0ddcf;--theme-shadow:#b8663228;
}
html[data-theme=vermelho] #mcc-app{
  --cream:#fff6f6;--white:#fffdfd;--lilac:#cf5b63;--lilac2:#fde9e9;--rose:#9f3944;--rose2:#f9dfe1;
  --ink:#47272c;--muted:#8c7074;--line:#efd9dc;--green:#79927d;
  --theme-page:#fff6f6;--theme-glow:#fffefe;--theme-accent:#cf5b63;--theme-dark:#8f303a;
  --theme-soft:#fde9e9;--theme-soft2:#fff0f1;--theme-action:#c84e58;--theme-action2:#9f3944;
  --theme-line:#efd9dc;--theme-shadow:#a13d4728;
}
html[data-theme=laranja] #mcc-app .credit{background:linear-gradient(145deg,#f8c48f,#fff0df)}
html[data-theme=vermelho] #mcc-app .credit{background:linear-gradient(145deg,#efabb0,#fde9e9)}
html[data-theme=cinza] #mcc-app{
  --cream:#f7f8fa;--white:#ffffff;--lilac:#7f8a96;--lilac2:#eef1f4;--rose:#5f6872;--rose2:#e7eaee;
  --ink:#30363c;--muted:#78818a;--line:#dde2e7;--green:#79927d;
  --theme-page:#f7f8fa;--theme-glow:#ffffff;--theme-accent:#7f8a96;--theme-dark:#525b64;
  --theme-soft:#eef1f4;--theme-soft2:#f5f7f9;--theme-action:#727d88;--theme-action2:#5f6872;
  --theme-line:#dde2e7;--theme-shadow:#5f687226;
}
html[data-theme=cinza] #mcc-app .credit{background:linear-gradient(145deg,#d9dee4,#f1f3f5)}

#mcc-app{
  font-family:var(--mcc-user-font, var(--font-geist-sans)),Inter,Manrope,"Segoe UI",sans-serif !important;
  font-size:calc(16px * var(--mcc-font-scale,1));
}
#mcc-app button,#mcc-app input,#mcc-app select,#mcc-app textarea{
  font-family:inherit;
}
#mcc-app .mcc-settings-modal{font-family:var(--mcc-user-font,Geist,Arial,sans-serif)}
.mcc-setting-control{
  border:1px solid #eedce2;border-radius:18px;background:#fff;padding:15px;
}
.mcc-setting-control-title{display:grid;grid-template-columns:43px 1fr auto;gap:12px;align-items:center}
.mcc-setting-control-title>i{width:43px;height:43px;border-radius:14px;display:grid;place-items:center;font-style:normal;font-weight:750;background:#f2eafb;color:#765496}
.mcc-setting-control-title span{display:flex;flex-direction:column}
.mcc-setting-control-title b{font-size:14px}
.mcc-setting-control-title small{font-size:11px;opacity:.64;margin-top:4px}
.mcc-font-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:13px}
.mcc-font-options button{min-height:39px;border:1px solid #eadde1;border-radius:11px;background:#fffafc;color:#49363e;cursor:pointer;font-size:13px;padding:5px 8px}
.mcc-font-options button:hover{border-color:#dca9b7;background:#fff3f6}
.mcc-font-options button.selected{border:2px solid #c96f84;background:#fbe8ed;color:#864659;font-weight:750}
.mcc-font-size-value{min-width:48px;border-radius:999px;background:#f8e8ed;color:#955265;font-size:12px;font-weight:750;padding:6px 9px;text-align:center}
.mcc-font-size-range{width:100%;margin-top:15px;accent-color:#c96f84}
@media(max-width:640px){
  .mcc-font-options{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mcc-setting-control{padding:13px 12px}
  .mcc-setting-control-title{grid-template-columns:40px 1fr auto;gap:10px}
  .mcc-setting-control-title>i{width:40px;height:40px}
}


/* Versão 2.0.20: ajustes visuais na janela de configurações e paleta de cores */
.mcc-settings-modal{
  width:min(610px,100%);
  max-height:min(760px,calc(100vh - 28px));
}
.mcc-settings-modal header{
  align-items:flex-start;
}
.mcc-settings-close,
#mcc-app .themePicker header>button{
  display:grid;
  place-items:center;
  line-height:1;
  padding:0;
}
.mcc-settings-close{
  width:42px;
  height:42px;
  font-size:26px;
  border:1px solid #edd6de;
  box-shadow:0 4px 12px rgba(98,54,70,.06);
}
#mcc-app .themePicker{
  width:min(620px,100%);
  max-height:calc(100vh - 28px);
  overflow:auto;
  padding:22px 22px 18px;
}
#mcc-app .themePicker>header{
  margin-bottom:16px;
}
#mcc-app .themePicker header>button{
  width:40px;
  height:40px;
  border-radius:14px;
  font-size:28px;
  color:#8a5060;
  border-color:var(--theme-line);
  background:#fff7f9;
  box-shadow:0 4px 12px rgba(98,54,70,.06);
}
#mcc-app .themeOptions{
  gap:12px;
}
#mcc-app .themeDone{
  position:sticky;
  bottom:0;
  margin-top:14px;
}
@media(max-width:620px){
  .mcc-settings-close{
    width:40px;
    height:40px;
    font-size:24px;
  }
  #mcc-app .themePicker{
    width:min(100%, 620px);
    max-height:calc(100vh - 16px);
    padding:18px 14px 14px;
  }
  #mcc-app .themePicker header>button{
    width:38px;
    height:38px;
    font-size:26px;
  }
}


/* Versão 2.0.21: janela de paleta mais compacta e sem faixa superior */
#mcc-app .themePicker{
  width:min(600px,100%);
  max-height:calc(100vh - 22px);
  padding:18px 18px 14px;
}
#mcc-app .themePicker>header{
  margin-bottom:12px;
}
#mcc-app .themePicker header small{
  display:none;
}
#mcc-app .themePicker h2{
  margin:0;
  font-size:24px;
}
#mcc-app .themePicker header p{
  margin-top:4px;
  font-size:11px;
}
#mcc-app .themeOptions{
  gap:8px;
}
#mcc-app .themeOptions>button{
  min-height:68px;
  grid-template-columns:82px 1fr 28px;
  gap:10px;
  padding:10px 12px;
  border-radius:15px;
}
#mcc-app .themeSwatches i{
  width:30px;
  height:30px;
}
#mcc-app .themeOptions b{
  font-size:13px;
}
#mcc-app .themeOptions small{
  margin-top:3px;
  font-size:10px;
}
#mcc-app .themeOptions strong{
  width:24px;
  height:24px;
}
#mcc-app .themeDone{
  min-height:42px;
  margin-top:10px;
  font-size:13px;
}
@media(max-width:620px){
  #mcc-app .themePicker{
    max-height:calc(100vh - 10px);
    padding:16px 12px 12px;
  }
  #mcc-app .themePicker h2{
    font-size:22px;
  }
  #mcc-app .themePicker header p{
    font-size:10.5px;
  }
  #mcc-app .themeOptions{
    gap:7px;
  }
  #mcc-app .themeOptions>button{
    min-height:62px;
    grid-template-columns:74px 1fr 24px;
    gap:9px;
    padding:9px 10px;
  }
  #mcc-app .themeSwatches i{
    width:27px;
    height:27px;
  }
  #mcc-app .themeDone{
    min-height:40px;
    margin-top:8px;
  }
}


/* Versão 2.0.24: título e ícones aplicados diretamente, sem alterar o carregamento */
#mcc-app main > header:not(.sectionBar) h1.mcc-dashboard-title{
  max-width:760px;
  font-size:clamp(22px,2.3vw,34px);
  line-height:1.08;
  letter-spacing:-.03em;
}
#mcc-app .metrics article:nth-child(1) > i,
#mcc-app .metrics article:nth-child(2) > i{
  color:transparent !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
  background-size:28px 28px !important;
}
#mcc-app .metrics article:nth-child(1) > i{
  background-image:url("icon-proximo-vencimento.png") !important;
}
#mcc-app .metrics article:nth-child(2) > i{
  background-image:url("icon-total-aberto.png") !important;
}
@media(max-width:620px){
  #mcc-app main > header:not(.sectionBar) h1.mcc-dashboard-title{
    font-size:20px;
    max-width:100%;
  }
  #mcc-app .metrics article:nth-child(1) > i,
  #mcc-app .metrics article:nth-child(2) > i{
    background-size:22px 22px !important;
  }
}


/* Versão 2.0.25: topo do painel em barra e indicadores mais equilibrados */
#mcc-app main > header:not(.sectionBar){
  min-height:92px;
  margin-bottom:28px;
  border:1px solid var(--theme-line);
  border-radius:22px;
  background:linear-gradient(105deg,var(--white),var(--theme-soft2));
  box-shadow:inset 5px 0 0 var(--theme-accent),0 12px 34px var(--theme-shadow);
  padding:18px 22px 18px 24px;
}
#mcc-app main > header:not(.sectionBar) h1.mcc-dashboard-title{
  max-width:760px;
  font-size:clamp(22px,2.2vw,32px);
  line-height:1.08;
  letter-spacing:-.03em;
}
#mcc-app .metrics article:nth-child(1) > i,
#mcc-app .metrics article:nth-child(2) > i{
  background-size:34px 34px !important;
}
#mcc-app .metrics article:nth-child(1) > b,
#mcc-app .metrics article:nth-child(2) > b{
  font-size:clamp(21px,1.85vw,28px);
  margin:8px 0 6px;
}
@media(max-width:860px){
  #mcc-app main > header:not(.sectionBar){
    min-height:74px;
    padding:12px 14px 12px 16px;
    border-radius:18px;
    margin-bottom:22px;
  }
}
@media(max-width:620px){
  #mcc-app main > header:not(.sectionBar) h1.mcc-dashboard-title{
    font-size:19px;
    max-width:100%;
  }
  #mcc-app .metrics article:nth-child(1) > i,
  #mcc-app .metrics article:nth-child(2) > i{
    background-size:26px 26px !important;
  }
  #mcc-app .metrics article:nth-child(1) > b,
  #mcc-app .metrics article:nth-child(2) > b{
    font-size:18px;
  }
}


/* Versão 2.0.26: controles de título e ícones no menu de personalização */
:root{
  --mcc-dashboard-title-size: 32px;
  --mcc-dashboard-icon-size: 34px;
}
.mcc-settings-grid{
  display:grid;
  gap:12px;
}
#mcc-app main > header:not(.sectionBar) h1.mcc-dashboard-title{
  font-size: var(--mcc-dashboard-title-size) !important;
}
#mcc-app .metrics article:nth-child(1) > i,
#mcc-app .metrics article:nth-child(2) > i{
  background-size: var(--mcc-dashboard-icon-size) var(--mcc-dashboard-icon-size) !important;
}
.mcc-setting-control-title output{
  margin-left:auto;
  padding:6px 10px;
  border-radius:999px;
  background:#f8e7ec;
  color:#8c5563;
  font-size:12px;
  font-weight:700;
}
.mcc-setting-control input[type="range"]{
  width:100%;
}


/* Versão 2.0.27: área do ícone cresce junto com o tamanho escolhido */
#mcc-app .metrics article:nth-child(1) > i,
#mcc-app .metrics article:nth-child(2) > i{
  width: calc(var(--mcc-dashboard-icon-size) + 24px) !important;
  height: calc(var(--mcc-dashboard-icon-size) + 24px) !important;
  min-width: calc(var(--mcc-dashboard-icon-size) + 24px) !important;
  min-height: calc(var(--mcc-dashboard-icon-size) + 24px) !important;
}
@media(max-width:620px){
  #mcc-app .metrics article:nth-child(1) > i,
  #mcc-app .metrics article:nth-child(2) > i{
    width: calc(var(--mcc-dashboard-icon-size) + 18px) !important;
    height: calc(var(--mcc-dashboard-icon-size) + 18px) !important;
    min-width: calc(var(--mcc-dashboard-icon-size) + 18px) !important;
    min-height: calc(var(--mcc-dashboard-icon-size) + 18px) !important;
  }
}


/* Versão 2.0.29: botão de relatório no total em aberto */
#mcc-app .metricReportLink{
  border:0;
  background:transparent;
  color:var(--theme-accent);
  font-size:12px;
  line-height:1.2;
  margin-top:2px;
  padding:0;
  cursor:pointer;
  text-decoration:underline;
}
#mcc-app .metricReportLink:hover{
  opacity:.86;
}


/* Versão 2.0.30: relatório detalhado por pessoa */
#mcc-app .personBreakdown{
  display:grid;
  gap:14px;
}
#mcc-app .personDetail{
  border:1px solid var(--theme-line);
  border-radius:18px;
  background:#fff;
  padding:14px 16px;
}
#mcc-app .personDetailHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
#mcc-app .personDetailHead span{
  display:flex;
  flex-direction:column;
  gap:4px;
}
#mcc-app .personDetailHead b{
  font-size:15px;
}
#mcc-app .personDetailHead small{
  color:var(--muted);
}
#mcc-app .personDetailHead button{
  border:1px solid var(--theme-line);
  background:var(--theme-soft);
  color:var(--theme-accent);
  border-radius:999px;
  padding:9px 14px;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
}
#mcc-app .personDetailBody{
  margin-top:14px;
  display:grid;
  gap:10px;
}
#mcc-app .personPurchaseRow{
  display:grid;
  grid-template-columns: minmax(160px,1.4fr) repeat(4,minmax(110px,1fr));
  gap:10px;
  align-items:start;
  border-top:1px solid var(--theme-line);
  padding-top:12px;
}
#mcc-app .personPurchaseRow span{
  display:flex;
  flex-direction:column;
  gap:3px;
}
#mcc-app .personPurchaseRow small{
  color:var(--muted);
  font-size:11px;
}
#mcc-app .personPurchaseRow b{
  font-size:13px;
  line-height:1.25;
}
@media(max-width:980px){
  #mcc-app .personPurchaseRow{
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
}
@media(max-width:620px){
  #mcc-app .personDetail{
    padding:12px;
  }
  #mcc-app .personDetailHead{
    flex-direction:column;
    align-items:flex-start;
  }
  #mcc-app .personDetailHead button{
    width:100%;
  }
  #mcc-app .personPurchaseRow{
    grid-template-columns: 1fr;
    gap:8px;
  }
}


/* Versão 2.0.31: detalhamento por pessoa em janela flutuante */
#mcc-app .personDetail{
  border:1px solid var(--theme-line);
  border-radius:18px;
  background:#fff;
  padding:14px 16px;
}
#mcc-app .personDetailHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
#mcc-app .personDetailHead span{
  display:flex;
  flex-direction:column;
  gap:4px;
}
#mcc-app .personDetailHead b{font-size:15px;}
#mcc-app .personDetailHead small{color:var(--muted);}
#mcc-app .personDetailHead button{
  border:1px solid var(--theme-line);
  background:var(--theme-soft);
  color:var(--theme-accent);
  border-radius:999px;
  padding:9px 14px;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
}
#mcc-app .personReportModal{
  width:min(980px,100%);
}
#mcc-app .personReportSummary{
  margin:6px 0 0;
  color:var(--muted);
  font-size:13px;
}
#mcc-app .personReportBody{
  display:grid;
  gap:10px;
  margin-top:8px;
}
#mcc-app .personReportBody .personPurchaseRow{
  display:grid;
  grid-template-columns:minmax(180px,1.5fr) repeat(4,minmax(110px,1fr));
  gap:10px;
  align-items:start;
  border:1px solid var(--theme-line);
  border-radius:15px;
  padding:12px 14px;
}
#mcc-app .personReportBody .personPurchaseRow span{
  display:flex;
  flex-direction:column;
  gap:3px;
}
#mcc-app .personReportBody .personPurchaseRow small{
  color:var(--muted);
  font-size:11px;
}
#mcc-app .personReportBody .personPurchaseRow b{
  font-size:13px;
  line-height:1.25;
}
@media(max-width:980px){
  #mcc-app .personReportModal{width:min(720px,100%);}
  #mcc-app .personReportBody .personPurchaseRow{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:620px){
  #mcc-app .personDetail{padding:12px;}
  #mcc-app .personDetailHead{flex-direction:column;align-items:flex-start;}
  #mcc-app .personDetailHead button{width:100%;}
  #mcc-app .personReportModal{width:min(100%,100%);padding:18px 14px;}
  #mcc-app .personReportBody .personPurchaseRow{grid-template-columns:1fr;gap:8px;padding:12px;}
}


/* Versão 2.0.32: relatório sem repetição e botão menor */
#mcc-app .personDetailHead button{
  padding:7px 12px !important;
  font-size:12px;
  min-height:36px;
}
@media(max-width:620px){
  #mcc-app .personDetailHead button{
    min-height:34px;
  }
}


/* Versão 2.0.33: modal de detalhamento mais baixo e com filtro por cartão */
#mcc-app .personReportModal{
  width:min(940px,100%);
  max-height:min(86vh,760px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
#mcc-app .personReportBody{
  display:grid;
  gap:10px;
  margin-top:8px;
  overflow:auto;
  padding-right:4px;
}
#mcc-app .personReportToolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:2px 0 6px;
}
#mcc-app .personReportToolbar label{
  font-size:12px;
  color:var(--muted);
  font-weight:700;
}
#mcc-app .personReportToolbar select{
  min-width:220px;
  max-width:320px;
  min-height:42px;
  border-radius:12px;
}
@media(max-width:980px){
  #mcc-app .personReportModal{width:min(720px,100%);max-height:min(84vh,720px);}
}
@media(max-width:620px){
  #mcc-app .personReportModal{width:min(100%,100%);max-height:min(88vh,700px);padding:18px 14px;}
  #mcc-app .personReportToolbar{flex-direction:column;align-items:stretch;}
  #mcc-app .personReportToolbar select{min-width:0;max-width:none;width:100%;}
}


/* Versão 2.0.34: filtro ao lado do resumo no topo do modal */
#mcc-app .personReportTopline{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin-top:6px;
}
#mcc-app .personReportSummary{
  margin:0;
}
#mcc-app .personReportToolbar.inline{
  display:flex;
  align-items:center;
  gap:10px;
  padding:0;
}
#mcc-app .personReportToolbar.inline label{
  margin:0;
  white-space:nowrap;
}
#mcc-app .personReportToolbar.inline select{
  min-width:220px;
  max-width:300px;
  min-height:40px;
}
@media(max-width:760px){
  #mcc-app .personReportTopline{
    flex-direction:column;
    align-items:stretch;
    gap:10px;
  }
  #mcc-app .personReportToolbar.inline{
    flex-direction:column;
    align-items:stretch;
  }
  #mcc-app .personReportToolbar.inline select{
    min-width:0;
    max-width:none;
    width:100%;
  }
}


/* Versão 2.0.36: reembolso estável sem interferir no botão Editar */
#mcc-app .rowActions .mcc-refund-button{
  border-color:#d6b36b;
  background:#fff9e8;
  color:#8a661d;
}
.mcc-refund-overlay{
  position:fixed;
  inset:0;
  z-index:1000002;
  display:grid;
  place-items:center;
  padding:14px;
  background:rgba(48,33,51,.38);
  backdrop-filter:blur(7px);
}
.mcc-refund-modal{
  width:min(600px,100%);
  max-height:calc(100dvh - 28px);
  overflow:auto;
  border-radius:22px;
  background:#fffdfc;
  padding:22px 24px;
  box-shadow:0 28px 80px rgba(48,33,51,.28);
  font-family:var(--mcc-user-font,Arial,sans-serif);
}
.mcc-refund-modal header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}
.mcc-refund-modal h2{margin:0;font-size:24px;color:#342b35}
.mcc-refund-modal header p{margin:5px 0 0;color:#847984;font-size:12px}
.mcc-refund-close{display:grid;width:40px;height:40px;place-items:center;border:1px solid #edcad3;border-radius:13px;background:#fdebf0;color:#a84f65;cursor:pointer;font-size:26px;line-height:1}
.mcc-refund-modal form{display:grid;gap:14px}
.mcc-refund-modal label{display:flex;flex-direction:column;gap:7px;color:#58485b;font-size:12px;font-weight:650}
.mcc-refund-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mcc-refund-modal input,.mcc-refund-modal select,.mcc-refund-modal textarea{width:100%;box-sizing:border-box;border:1px solid #e2d6dc;border-radius:12px;background:#fff;outline:0;padding:11px 13px;font:inherit}
.mcc-refund-modal input,.mcc-refund-modal select{min-height:44px}
.mcc-refund-modal textarea{resize:vertical}
.mcc-refund-summary{display:flex;align-items:center;justify-content:space-between;border-radius:12px;background:#f7eff2;padding:11px 13px;color:#725d66;font-size:12px}
.mcc-refund-summary b{font-size:14px;color:#403238}
.mcc-refund-actions{display:grid;grid-template-columns:130px 1fr;gap:10px}
.mcc-refund-actions button{min-height:44px;border-radius:13px;cursor:pointer;font-weight:700}
.mcc-refund-cancel{border:1px solid #dbcbd2;background:#fff;color:#6e5862}
.mcc-refund-save{border:0;background:linear-gradient(135deg,var(--theme-action,#8dad98),var(--theme-action2,#719180));color:#fff}
@media(max-width:620px){.mcc-refund-modal{padding:18px 15px}.mcc-refund-fields{grid-template-columns:1fr}.mcc-refund-actions{grid-template-columns:105px 1fr}}


/* Versão 2.0.37: ações compactas e reembolso com abertura imediata */
#mcc-app .record{
  grid-template-columns:minmax(220px,1.8fr) minmax(115px,.8fr) 75px 130px 100px minmax(145px,auto);
}
#mcc-app .rowActions{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:nowrap;
  min-width:0;
}
#mcc-app .rowActions button.iconAction{
  width:34px;
  min-width:34px;
  height:34px;
  min-height:34px;
  padding:0;
  display:grid;
  place-items:center;
  font-size:16px;
  line-height:1;
  border-radius:10px;
}
#mcc-app .rowActions button.deleteIcon{
  font-size:19px;
  font-weight:700;
}
#mcc-app .rowActions .mcc-refund-button{
  white-space:nowrap;
  min-height:34px;
  padding:0 10px;
}
@media(max-width:1180px){
  #mcc-app .record{
    grid-template-columns:minmax(190px,1.6fr) minmax(105px,.8fr) 68px 115px 90px minmax(140px,auto);
    gap:10px;
  }
}


/* Versão 2.0.38: reembolso abre sem alterar a posição da página */
body.mcc-refund-open{
  overflow:hidden !important;
}
.mcc-refund-overlay{
  overscroll-behavior:contain;
}


/* Versão 2.0.39: botão fechar alinhado e campo de valor mais limpo */
.mcc-refund-close{
  display:flex !important;
  align-items:center;
  justify-content:center;
  padding:0;
  line-height:1;
  font-size:24px;
}
.mcc-refund-close span,
.mcc-refund-close::before,
.mcc-refund-close::after{
  line-height:1;
}
.mcc-refund-modal input[name="refundAmount"]{
  appearance:textfield;
  -moz-appearance:textfield;
}
.mcc-refund-modal input[name="refundAmount"]::-webkit-outer-spin-button,
.mcc-refund-modal input[name="refundAmount"]::-webkit-inner-spin-button{
  -webkit-appearance:none;
  margin:0;
}


/* Versão 2.0.42: filtro alinhado à direita e exportação do detalhamento */
#mcc-app .personReportTopline{align-items:center;}
#mcc-app .personReportToolbar.inline{justify-content:flex-end;margin-left:auto;flex-wrap:wrap;}
#mcc-app .personReportFilterGroup{display:flex;align-items:center;gap:10px;}
#mcc-app .personReportFilterGroup label{margin:0;white-space:nowrap;}
#mcc-app .personReportExport{min-height:40px;border:1px solid var(--theme-line);border-radius:12px;background:var(--theme-soft2);color:var(--theme-dark);padding:0 14px;cursor:pointer;font-weight:700;white-space:nowrap;}
#mcc-app .personReportExport:hover{border-color:var(--theme-accent);background:var(--theme-soft);}
@media(max-width:760px){#mcc-app .personReportToolbar.inline{flex-direction:column;align-items:stretch;}#mcc-app .personReportFilterGroup{flex-direction:column;align-items:stretch;}#mcc-app .personReportExport{width:100%;}}


/* Versão 2.0.43: botão de exportação compacto com ícone e tooltip */
#mcc-app .personReportExport.iconOnly{
  position:relative;
  width:42px;
  min-width:42px;
  height:42px;
  min-height:42px;
  padding:0;
  border:1px solid var(--theme-line);
  border-radius:12px;
  background-color:var(--theme-soft2);
  background-image:var(--export-icon);
  background-repeat:no-repeat;
  background-position:center;
  background-size:22px 22px;
  cursor:pointer;
}
#mcc-app .personReportExport.iconOnly:hover{
  border-color:var(--theme-accent);
  background-color:var(--theme-soft);
}
#mcc-app .personReportExport.iconOnly::after{
  content:attr(data-tooltip);
  position:absolute;
  right:0;
  top:calc(100% + 8px);
  background:rgba(45,38,47,.92);
  color:#fff;
  padding:6px 9px;
  border-radius:8px;
  font-size:12px;
  font-weight:600;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transform:translateY(-4px);
  transition:opacity .18s ease, transform .18s ease;
  z-index:5;
}
#mcc-app .personReportExport.iconOnly:hover::after,
#mcc-app .personReportExport.iconOnly:focus-visible::after{
  opacity:1;
  transform:translateY(0);
}
#mcc-app .srOnly{
  position:absolute !important;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}


/* Versão 2.0.44: ícone visível no botão de exportação */
#mcc-app .personReportExport.iconOnly{
  display:flex;
  align-items:center;
  justify-content:center;
  background-image:none;
}
#mcc-app .personReportExport .exportIconVisual{
  width:22px;
  height:22px;
  display:block;
  object-fit:contain;
}


/* Versão 2.0.45: exportação mais limpa e alinhamento à direita */
#mcc-app .personReportTopline{
  align-items:center;
}
#mcc-app .personReportToolbar.inline{
  margin-left:auto;
  justify-content:flex-end;
  align-items:center;
  gap:12px;
}
#mcc-app .personReportFilterGroup{
  margin-left:auto;
}
#mcc-app .personReportExport.iconOnly{
  width:34px;
  min-width:34px;
  height:34px;
  min-height:34px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
#mcc-app .personReportExport.iconOnly:hover,
#mcc-app .personReportExport.iconOnly:focus-visible{
  border:0;
  background:transparent;
  box-shadow:none;
  outline:none;
  opacity:.88;
}
#mcc-app .personReportExport .exportIconVisual{
  width:28px;
  height:28px;
}
@media(max-width:760px){
  #mcc-app .personReportToolbar.inline,
  #mcc-app .personReportFilterGroup{
    margin-left:0;
  }
}


/* Versão 2.0.46: cabeçalho do detalhamento mais organizado */
#mcc-app .personReportModal > header{
  display:flex;
  align-items:flex-start;
  gap:18px;
  margin-bottom:14px;
}
#mcc-app .personReportModal > header > span{
  flex:1;
  min-width:0;
  display:block;
}
#mcc-app .personReportModal > header h2{
  margin-top:4px;
}
#mcc-app .personReportTopline{
  display:grid;
  grid-template-columns:minmax(190px,1fr) auto;
  align-items:center;
  gap:24px;
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid var(--theme-line);
}
#mcc-app .personReportSummary{
  margin:0;
  font-size:13px;
  line-height:1.35;
  white-space:nowrap;
}
#mcc-app .personReportToolbar.inline{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  margin:0;
  flex-wrap:nowrap;
}
#mcc-app .personReportFilterGroup{
  display:flex;
  align-items:center;
  gap:9px;
  margin:0;
}
#mcc-app .personReportFilterGroup label{
  font-size:11px;
  white-space:nowrap;
}
#mcc-app .personReportFilterGroup select{
  width:220px;
  min-width:220px;
  max-width:220px;
}
#mcc-app .personReportExport.iconOnly{
  flex:0 0 auto;
}
@media(max-width:820px){
  #mcc-app .personReportTopline{
    grid-template-columns:1fr;
    gap:12px;
  }
  #mcc-app .personReportSummary{
    white-space:normal;
  }
  #mcc-app .personReportToolbar.inline{
    justify-content:flex-start;
    align-items:flex-end;
  }
}
@media(max-width:620px){
  #mcc-app .personReportModal > header{
    gap:10px;
  }
  #mcc-app .personReportToolbar.inline{
    flex-direction:row;
    align-items:flex-end;
  }
  #mcc-app .personReportFilterGroup{
    flex:1;
    flex-direction:column;
    align-items:stretch;
    gap:5px;
  }
  #mcc-app .personReportFilterGroup select{
    width:100%;
    min-width:0;
    max-width:none;
  }
}


/* Versão 2.0.47: topo do detalhamento mais limpo e com faixa suave */
#mcc-app .personReportTitleLine{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:10px;
  margin:6px 0 0;
}
#mcc-app .personReportTitleLine b{
  font-size:18px;
  line-height:1.2;
}
#mcc-app .personReportTitleMeta{
  font-size:13px;
  font-weight:500;
  color:var(--muted);
}
#mcc-app .personReportControlsStrip{
  margin-top:14px;
  background:var(--theme-soft2);
  border:1px solid var(--theme-line);
  border-radius:16px;
  padding:10px 12px;
}
#mcc-app .personReportToolbar.strip{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:12px;
  flex-wrap:wrap;
}
#mcc-app .personReportToolbar.strip .personReportFilterGroup{
  display:flex;
  align-items:center;
  gap:10px;
}
#mcc-app .personReportToolbar.strip label{
  margin:0;
  white-space:nowrap;
  font-size:12px;
  color:var(--muted);
  font-weight:700;
}
#mcc-app .personReportToolbar.strip select{
  min-width:220px;
  max-width:300px;
  min-height:40px;
}
#mcc-app .personReportExport.iconOnly{
  width:34px;
  min-width:34px;
  height:34px;
  min-height:34px;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
  border-radius:0;
}
#mcc-app .personReportExport .exportIconVisual{
  width:28px;
  height:28px;
  display:block;
}
@media(max-width:760px){
  #mcc-app .personReportTitleLine{
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
  }
  #mcc-app .personReportControlsStrip{
    padding:10px;
  }
  #mcc-app .personReportToolbar.strip,
  #mcc-app .personReportToolbar.strip .personReportFilterGroup{
    flex-direction:column;
    align-items:stretch;
  }
  #mcc-app .personReportToolbar.strip select{
    min-width:0;
    max-width:none;
    width:100%;
  }
}


/* Versão 2.0.48: bloco de informação à esquerda e faixa de controles à direita */
#mcc-app .personReportHero{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:22px;
  width:100%;
}
#mcc-app .personReportInfoBlock{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width:0;
  flex:1 1 auto;
  padding-top:2px;
}
#mcc-app .personReportInfoBlock small{
  margin:0;
}
#mcc-app .personReportControlsStrip{
  margin-top:28px;
  margin-left:auto;
  min-width:360px;
  flex:0 0 auto;
}
#mcc-app .personReportTitleLine{
  margin:0;
}
#mcc-app .personReportToolbar.strip{
  justify-content:flex-start;
  gap:12px;
}
#mcc-app .personReportToolbar.strip .personReportFilterGroup{
  flex:1 1 auto;
}
#mcc-app .personReportToolbar.strip select{
  min-width:220px;
  width:220px;
}
@media(max-width:900px){
  #mcc-app .personReportHero{
    flex-direction:column;
    gap:12px;
  }
  #mcc-app .personReportControlsStrip{
    margin-top:0;
    margin-left:0;
    min-width:0;
    width:100%;
  }
}


/* Versão 2.0.49: alinhamento mais baixo da faixa de filtros no detalhamento */
@media(min-width:901px){
  #mcc-app .personReportInfoBlock{
    padding-top:4px;
  }
  #mcc-app .personReportControlsStrip{
    margin-top:30px;
  }
}


/* Versão 2.0.50: topo do detalhamento realmente alinhado */
#mcc-app .personReportModal header{
  position:relative;
  display:block;
  margin-bottom:18px;
  padding-right:58px;
}
#mcc-app .personReportModal header > span{
  display:block;
  width:100%;
}
#mcc-app .personReportModal header > button{
  position:absolute;
  top:-4px;
  right:0;
  z-index:2;
}
#mcc-app .personReportHero{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:22px;
  width:100%;
  margin-top:16px;
}
#mcc-app .personReportInfoBlock{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
  min-width:0;
  padding-top:14px;
}
#mcc-app .personReportInfoBlock small{
  margin:0;
}
#mcc-app .personReportTitleLine{
  margin:0;
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:10px;
}
#mcc-app .personReportControlsStrip{
  margin:14px 0 0 auto;
  min-width:380px;
  max-width:100%;
  flex:0 0 auto;
}
#mcc-app .personReportToolbar.strip{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:12px;
  flex-wrap:nowrap;
}
#mcc-app .personReportToolbar.strip .personReportFilterGroup{
  display:flex;
  align-items:center;
  gap:10px;
  flex:1 1 auto;
}
#mcc-app .personReportToolbar.strip label{
  white-space:nowrap;
}
#mcc-app .personReportToolbar.strip select{
  width:220px;
  min-width:220px;
}
@media(max-width:900px){
  #mcc-app .personReportModal header{
    padding-right:0;
  }
  #mcc-app .personReportModal header > button{
    top:0;
    right:0;
  }
  #mcc-app .personReportHero{
    grid-template-columns:1fr;
    gap:12px;
    margin-top:12px;
  }
  #mcc-app .personReportInfoBlock{
    padding-top:0;
  }
  #mcc-app .personReportControlsStrip{
    margin:0;
    min-width:0;
    width:100%;
  }
  #mcc-app .personReportToolbar.strip{
    flex-wrap:wrap;
  }
}


/* Versão 2.0.51: bloco de detalhamento com fundo suave e melhor alinhamento visual */
#mcc-app .personReportHero{
  align-items:stretch;
}
#mcc-app .personReportInfoBlock{
  background:var(--theme-soft2);
  border:1px solid var(--theme-line);
  border-radius:16px;
  padding:16px 18px;
  min-height:88px;
  box-sizing:border-box;
}
#mcc-app .personReportControlsStrip{
  min-height:88px;
  display:flex;
  align-items:center;
  box-sizing:border-box;
}
#mcc-app .personReportControlsStrip .personReportToolbar.strip{
  width:100%;
}
@media(max-width:900px){
  #mcc-app .personReportInfoBlock,
  #mcc-app .personReportControlsStrip{
    min-height:auto;
  }
}


/* Versão 2.0.52: cabeçalho do detalhamento em uma faixa única */
#mcc-app .personReportModal header{
  position:relative;
  display:block;
  margin-bottom:12px;
  padding-right:70px;
}
#mcc-app .personReportModal header > button{
  position:absolute;
  top:-6px;
  right:0;
  z-index:3;
}
#mcc-app .personReportHero{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:24px;
  width:100%;
  margin-top:22px;
  padding:18px 22px;
  background:var(--theme-soft2);
  border:1px solid var(--theme-line);
  border-radius:18px;
  box-sizing:border-box;
}
#mcc-app .personReportInfoBlock{
  background:transparent;
  border:0;
  border-radius:0;
  padding:0;
  min-height:auto;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
  min-width:0;
}
#mcc-app .personReportInfoBlock small{
  margin:0;
}
#mcc-app .personReportTitleLine{
  margin:0;
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:10px;
}
#mcc-app .personReportTitleMeta{
  font-size:13px;
}
#mcc-app .personReportControlsStrip{
  margin:0;
  min-width:360px;
  max-width:100%;
  flex:0 0 auto;
  min-height:auto;
  display:flex;
  align-items:center;
  background:transparent;
  border:0;
  border-radius:0;
  padding:0;
}
#mcc-app .personReportControlsStrip .personReportToolbar.strip{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  flex-wrap:nowrap;
}
#mcc-app .personReportToolbar.strip .personReportFilterGroup{
  display:flex;
  align-items:center;
  gap:10px;
  flex:0 0 auto;
}
#mcc-app .personReportToolbar.strip label{
  margin:0;
  white-space:nowrap;
  font-size:12px;
  color:var(--muted);
  font-weight:700;
}
#mcc-app .personReportToolbar.strip select{
  width:220px;
  min-width:220px;
  max-width:220px;
  min-height:40px;
}
#mcc-app .personReportExport.iconOnly{
  width:34px;
  min-width:34px;
  height:34px;
  min-height:34px;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
  border-radius:0;
}
#mcc-app .personReportExport .exportIconVisual{
  width:28px;
  height:28px;
  display:block;
}
@media(max-width:900px){
  #mcc-app .personReportModal header{
    padding-right:0;
  }
  #mcc-app .personReportModal header > button{
    top:0;
    right:0;
  }
  #mcc-app .personReportHero{
    grid-template-columns:1fr;
    gap:14px;
    margin-top:14px;
    padding:14px;
  }
  #mcc-app .personReportControlsStrip{
    min-width:0;
    width:100%;
  }
  #mcc-app .personReportControlsStrip .personReportToolbar.strip,
  #mcc-app .personReportToolbar.strip .personReportFilterGroup{
    flex-wrap:wrap;
    justify-content:flex-start;
  }
}


/* Versão 2.0.53: botão fechar dentro da faixa única do topo */
#mcc-app .personReportModal header{
  padding-right:0;
}
#mcc-app .personReportHero{
  position:relative;
  padding-right:92px;
}
#mcc-app .personReportModal header > button{
  position:absolute;
  top:36px;
  right:22px;
  z-index:3;
}
@media(max-width:900px){
  #mcc-app .personReportHero{
    padding-right:14px;
  }
  #mcc-app .personReportModal header > button{
    top:10px;
    right:10px;
  }
}


/* Versão 2.0.54: faixa única realmente contínua até o botão fechar */
#mcc-app .personReportModal header{
  position:relative;
  padding-right:0;
  margin-bottom:12px;
}
#mcc-app .personReportHero{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:22px;
  width:100%;
  margin-top:18px;
  padding:18px 84px 18px 22px;
  background:var(--theme-soft2);
  border:1px solid var(--theme-line);
  border-radius:18px;
  box-sizing:border-box;
}
#mcc-app .personReportInfoBlock{
  background:transparent;
  border:0;
  border-radius:0;
  padding:0;
  min-height:auto;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
  min-width:0;
}
#mcc-app .personReportControlsStrip{
  margin:0;
  min-width:0;
  max-width:100%;
  width:auto;
  background:transparent;
  border:0;
  border-radius:0;
  padding:0;
  display:flex;
  align-items:center;
}
#mcc-app .personReportControlsStrip .personReportToolbar.strip{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  flex-wrap:nowrap;
}
#mcc-app .personReportToolbar.strip .personReportFilterGroup{
  display:flex;
  align-items:center;
  gap:10px;
}
#mcc-app .personReportToolbar.strip select{
  width:220px;
  min-width:220px;
  max-width:220px;
}
#mcc-app .personReportModal header > button{
  position:absolute;
  top:50%;
  right:18px;
  transform:translateY(-50%);
  z-index:4;
}
/* aproxima o X do botão verde e mantém tudo dentro da mesma faixa */
#mcc-app .personReportExport.iconOnly{
  margin-right:4px;
}
@media(max-width:900px){
  #mcc-app .personReportHero{
    grid-template-columns:1fr;
    gap:14px;
    margin-top:14px;
    padding:16px 14px;
  }
  #mcc-app .personReportModal header > button{
    top:12px;
    right:12px;
    transform:none;
  }
  #mcc-app .personReportControlsStrip .personReportToolbar.strip,
  #mcc-app .personReportToolbar.strip .personReportFilterGroup{
    flex-wrap:wrap;
    justify-content:flex-start;
  }
}


/* Versão 2.0.55: fechar com ícone personalizado e alinhamento da faixa */
#mcc-app .personReportModal header > button{
  display:none !important;
}
#mcc-app .personReportHero{
  width:calc(100% - 14px);
  margin-right:14px;
  padding:18px 22px;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
}
#mcc-app .personReportControlsStrip .personReportToolbar.strip{
  justify-content:flex-end;
  gap:10px;
}
#mcc-app .personReportToolbar.strip .personReportFilterGroup{
  gap:10px;
}
#mcc-app .personReportToolbar.strip select{
  width:220px;
  min-width:220px;
  max-width:220px;
}
#mcc-app .personReportExport.iconOnly,
#mcc-app .personReportClose.iconOnly{
  width:34px;
  min-width:34px;
  height:34px;
  min-height:34px;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
  border-radius:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
#mcc-app .personReportClose.iconOnly{
  margin-left:2px;
}
#mcc-app .personReportClose .closeIconVisual{
  width:40px;
  height:40px;
  display:block;
}
#mcc-app .personReportExport .exportIconVisual{
  width:30px;
  height:30px;
}
@media(max-width:900px){
  #mcc-app .personReportHero{
    width:100%;
    margin-right:0;
    padding:16px 14px;
  }
  #mcc-app .personReportControlsStrip .personReportToolbar.strip,
  #mcc-app .personReportToolbar.strip .personReportFilterGroup{
    flex-wrap:wrap;
    justify-content:flex-start;
  }
}


/* Versão 2.0.56: remover bordas dos ícones de download e fechar */
#mcc-app .personReportExport.iconOnly,
#mcc-app .personReportClose.iconOnly{
  border:none !important;
  outline:none !important;
  box-shadow:none !important;
  background:transparent !important;
  appearance:none;
  -webkit-appearance:none;
}
#mcc-app .personReportExport.iconOnly:hover,
#mcc-app .personReportExport.iconOnly:focus,
#mcc-app .personReportExport.iconOnly:active,
#mcc-app .personReportClose.iconOnly:hover,
#mcc-app .personReportClose.iconOnly:focus,
#mcc-app .personReportClose.iconOnly:active{
  border:none !important;
  outline:none !important;
  box-shadow:none !important;
  background:transparent !important;
}


/* Versão 2.0.57: aproximar botões de download e fechar */
#mcc-app .personReportControlsStrip .personReportToolbar.strip{
  gap:6px !important;
}
#mcc-app .personReportClose.iconOnly{
  margin-left:-2px !important;
}


/* Versão 2.0.60: remove o bloco "Meu Controle de Cartões" acima do menu */
#mcc-app .brand{
  display:none !important;
}
#mcc-app .sidebar{
  padding-top:24px;
}


/* Versão 2.0.61: alinhamento do menu, títulos personalizáveis e responsividade extra */
:root{
  --mcc-section-title-size: 34px;
}
#mcc-app .sidebar{
  padding-top:42px !important;
}
#mcc-app main>header.sectionBar h1,
#mcc-app .sectionHeading h1{
  font-size:var(--mcc-section-title-size) !important;
  line-height:1.08;
}
#mcc-app .mcc-dashboard-title{
  font-size:var(--mcc-dashboard-title-size) !important;
}
#mcc-app .mcc-settings-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
#mcc-app .mcc-setting-control.page-title-control .mcc-setting-control-title>i{
  letter-spacing:-.04em;
  font-size:13px;
}
@media(max-width:920px){
  #mcc-app .mcc-settings-grid{grid-template-columns:1fr;}
}
@media(max-width:860px){
  #mcc-app .sidebar{padding-top:18px !important;}
  #mcc-app main{padding:20px 16px 42px;}
  #mcc-app main>header,
  #mcc-app main>header.sectionBar,
  #mcc-app main>header:not(.sectionBar){
    gap:14px;
  }
  #mcc-app main>header h1,
  #mcc-app main>header.sectionBar h1{font-size:min(var(--mcc-section-title-size),28px) !important;}
  #mcc-app .mcc-dashboard-title{font-size:min(var(--mcc-dashboard-title-size),26px) !important;}
}
@media(max-width:620px){
  #mcc-app .metrics{grid-template-columns:1fr !important;}
  #mcc-app main{padding:16px 12px 36px;}
  #mcc-app main>header,
  #mcc-app main>header.sectionBar,
  #mcc-app main>header:not(.sectionBar){
    min-height:auto;
    padding:14px 15px !important;
    border-radius:18px;
    flex-wrap:wrap;
    align-items:center;
    margin-bottom:18px;
  }
  #mcc-app main>header .new{min-height:44px;}
  #mcc-app main>header h1,
  #mcc-app main>header.sectionBar h1{font-size:min(var(--mcc-section-title-size),24px) !important;}
  #mcc-app .mcc-dashboard-title{font-size:min(var(--mcc-dashboard-title-size),22px) !important;}
  #mcc-app .panel,
  #mcc-app .invoiceCard,
  #mcc-app .credit,
  #mcc-app .metric,
  #mcc-app .modal,
  #mcc-app .personReportModal{border-radius:18px;}
}
@media(max-width:480px){
  #mcc-app .filters{grid-template-columns:1fr !important;}
  #mcc-app .records{padding-left:14px !important;padding-right:14px !important;}
  #mcc-app .record{grid-template-columns:1fr !important;gap:10px !important;}
  #mcc-app .rowActions{justify-content:flex-start;flex-wrap:wrap;}
  #mcc-app .rowActions .mcc-refund-button{padding:0 12px;}
  #mcc-app .listActions{gap:10px;}
}


/* Versão 2.0.64: experiência móvel reorganizada e relatório por cartão */
@media(max-width:620px){
  #mcc-app{
    overflow-x:hidden;
  }
  #mcc-app main{
    width:100%;
    max-width:100%;
    padding:12px 10px 34px !important;
    overflow:hidden;
  }
  #mcc-app main>header,
  #mcc-app main>header.sectionBar,
  #mcc-app main>header:not(.sectionBar){
    display:grid !important;
    grid-template-columns:44px minmax(0,1fr) 44px;
    align-items:center;
    gap:10px !important;
    width:100%;
    min-height:72px !important;
    padding:10px 12px !important;
    margin-bottom:14px !important;
    box-sizing:border-box;
  }
  #mcc-app main>header>div,
  #mcc-app main>header .sectionHeading{
    min-width:0;
    text-align:left;
  }
  #mcc-app main>header h1,
  #mcc-app main>header.sectionBar h1,
  #mcc-app main>header h1.mcc-dashboard-title{
    max-width:100%;
    margin:0 !important;
    font-size:clamp(19px,6.2vw,25px) !important;
    line-height:1.05 !important;
    overflow-wrap:anywhere;
  }
  #mcc-app main>header small{
    display:block;
    margin-bottom:4px;
    font-size:9px !important;
  }
  #mcc-app .hamb,
  #mcc-app .new{
    width:44px !important;
    min-width:44px;
    height:44px;
    min-height:44px !important;
    padding:0 !important;
    border-radius:13px !important;
  }
  #mcc-app .new b{font-size:25px;}

  #mcc-app .panel{
    width:100%;
    min-width:0;
    box-sizing:border-box;
  }
  #mcc-app .panelHead{
    padding:18px 15px 12px !important;
  }
  #mcc-app .panelHead h2{
    font-size:21px !important;
    line-height:1.1;
  }
  #mcc-app .panelHead p{
    margin-top:5px;
    font-size:12px;
  }
  #mcc-app .listHead{
    display:grid !important;
    grid-template-columns:1fr;
    gap:14px;
  }
  #mcc-app .listActions{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:stretch !important;
    gap:9px;
    width:100%;
  }
  #mcc-app .search{
    grid-column:1 / -1;
    width:100% !important;
    min-height:48px;
    box-sizing:border-box;
  }
  #mcc-app .excelBtn{
    grid-column:1 / -1;
    width:100% !important;
    min-height:46px;
    padding:0 14px;
  }
  #mcc-app .filters{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:9px !important;
    padding:0 15px 16px !important;
  }
  #mcc-app .filters select,
  #mcc-app .filters .dueSelect,
  #mcc-app .filters .mcc-sort-select{
    width:100% !important;
    min-width:0 !important;
    min-height:46px;
    padding:0 10px !important;
    font-size:12.5px !important;
    text-overflow:ellipsis;
  }
  #mcc-app .filters select:nth-child(4),
  #mcc-app .filters .mcc-sort-select{
    grid-column:span 1;
  }

  #mcc-app .records{
    display:grid !important;
    gap:10px;
    width:100%;
    min-width:0 !important;
    padding:0 15px 18px !important;
    overflow:visible !important;
    box-sizing:border-box;
  }
  #mcc-app .record.rhead{
    display:none !important;
  }
  #mcc-app article.record{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:12px 14px !important;
    min-width:0 !important;
    width:100%;
    padding:14px !important;
    border:1px solid var(--theme-line);
    border-radius:16px;
    background:#fffdfd;
    box-sizing:border-box;
  }
  #mcc-app article.record>span,
  #mcc-app article.record>b,
  #mcc-app article.record>button{
    min-width:0;
    margin:0;
  }
  #mcc-app article.record>span:nth-child(1){
    grid-column:1 / -1;
  }
  #mcc-app article.record>span:nth-child(2)::before{content:"Cartão";}
  #mcc-app article.record>span:nth-child(3)::before{content:"Parcela";}
  #mcc-app article.record>span:nth-child(4)::before{content:"Vencimento";}
  #mcc-app article.record>b:nth-child(5)::before{content:"Valor";}
  #mcc-app article.record>span:nth-child(6)::before,
  #mcc-app article.record>button:nth-child(6)::before{content:"Ações";}
  #mcc-app article.record>span:nth-child(n+2):nth-child(-n+6)::before,
  #mcc-app article.record>b:nth-child(5)::before,
  #mcc-app article.record>button:nth-child(6)::before{
    display:block;
    margin-bottom:4px;
    color:var(--muted);
    font-size:9px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
  }
  #mcc-app article.record .desc{
    align-items:center;
    gap:10px;
  }
  #mcc-app article.record .desc>i{
    width:42px;
    min-width:42px;
    height:42px;
  }
  #mcc-app article.record .desc>b{
    font-size:14px;
    overflow-wrap:anywhere;
  }
  #mcc-app .rowActions{
    grid-column:1 / -1;
    display:flex !important;
    justify-content:flex-start;
    gap:7px;
    flex-wrap:wrap !important;
  }
  #mcc-app .rowActions::before{
    width:100%;
  }
  #mcc-app .rowActions .mcc-refund-button{
    min-height:36px;
  }

  #mcc-app .personReportModal{
    width:calc(100vw - 16px) !important;
    max-width:calc(100vw - 16px) !important;
    max-height:calc(100dvh - 16px) !important;
    padding:12px !important;
    border-radius:20px !important;
  }
  #mcc-app .personReportHero{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
    width:100% !important;
    margin:0 !important;
    padding:14px !important;
    border-radius:16px !important;
  }
  #mcc-app .personReportInfoBlock{
    gap:5px !important;
  }
  #mcc-app .personReportInfoBlock small{
    font-size:10px !important;
    line-height:1.2;
  }
  #mcc-app .personReportTitleLine{
    display:flex !important;
    flex-direction:row !important;
    align-items:baseline !important;
    gap:8px !important;
  }
  #mcc-app .personReportTitleLine b{
    font-size:20px !important;
  }
  #mcc-app .personReportTitleMeta{
    font-size:11.5px !important;
    line-height:1.3;
  }
  #mcc-app .personReportControlsStrip{
    width:100% !important;
    min-width:0 !important;
  }
  #mcc-app .personReportControlsStrip .personReportToolbar.strip{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 34px 40px !important;
    align-items:end !important;
    gap:6px !important;
    width:100%;
  }
  #mcc-app .personReportFilterGroup{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:4px !important;
    min-width:0;
  }
  #mcc-app .personReportFilterGroup label{
    font-size:10px !important;
  }
  #mcc-app .personReportFilterGroup select{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    min-height:42px !important;
    font-size:13px !important;
  }
  #mcc-app .personReportExport.iconOnly,
  #mcc-app .personReportClose.iconOnly{
    align-self:end;
  }
  #mcc-app .personReportExport .exportIconVisual{width:28px;height:28px;}
  #mcc-app .personReportClose .closeIconVisual{width:36px;height:36px;}
  #mcc-app .personReportBody{
    gap:9px !important;
    margin-top:10px !important;
    padding-right:2px !important;
  }
  #mcc-app .personReportBody .personPurchaseRow{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:12px !important;
    padding:13px !important;
  }
  #mcc-app .personReportBody .personPurchaseRow>span:first-child{
    grid-column:1 / -1;
  }
}
@media(max-width:390px){
  #mcc-app .filters{
    grid-template-columns:1fr !important;
  }
  #mcc-app article.record{
    grid-template-columns:1fr !important;
  }
  #mcc-app article.record>span:nth-child(1),
  #mcc-app .rowActions{
    grid-column:1;
  }
  #mcc-app .personReportControlsStrip .personReportToolbar.strip{
    grid-template-columns:minmax(0,1fr) 32px 36px !important;
  }
}


/* Versão 2.0.65: cartões móveis em grade e fontes separadas por dispositivo */
:root{
  --mcc-font-desktop-main:32px;
  --mcc-font-desktop-screen:34px;
  --mcc-font-desktop-subtitle:23px;
  --mcc-font-desktop-body:16px;
  --mcc-font-desktop-small:12px;
  --mcc-font-mobile-main:22px;
  --mcc-font-mobile-screen:24px;
  --mcc-font-mobile-subtitle:20px;
  --mcc-font-mobile-body:14px;
  --mcc-font-mobile-small:11px;
}
#mcc-app{font-size:var(--mcc-font-desktop-body) !important;}
#mcc-app main>header:not(.sectionBar) h1.mcc-dashboard-title{font-size:var(--mcc-font-desktop-main) !important;}
#mcc-app main>header.sectionBar h1,#mcc-app .sectionHeading h1{font-size:var(--mcc-font-desktop-screen) !important;}
#mcc-app .panelHead h2,#mcc-app .intro h2,#mcc-app .reports h2,#mcc-app .listHead h2{font-size:var(--mcc-font-desktop-subtitle) !important;}
#mcc-app .sidebar nav button,#mcc-app input,#mcc-app select,#mcc-app textarea,#mcc-app button{font-size:var(--mcc-font-desktop-body);}
#mcc-app small,#mcc-app .record small,#mcc-app .personPurchaseRow small,#mcc-app label{font-size:var(--mcc-font-desktop-small);}

.mcc-font-size-list{display:grid;gap:12px;margin-top:15px;}
.mcc-font-size-list label{display:grid;grid-template-columns:130px minmax(120px,1fr) 54px;align-items:center;gap:12px;font-size:12px;font-weight:650;}
.mcc-font-size-list input[type="range"]{width:100%;accent-color:#c96f84;}
.mcc-font-size-list output{border-radius:999px;background:#f8e8ed;color:#955265;padding:6px 8px;text-align:center;font-size:11px;font-weight:750;}
.mcc-setting-control.typography-device{grid-column:1 / -1;}
.mcc-setting-control.typography-device .mcc-setting-control-title>i{font-size:12px;}

@media(max-width:620px){
  #mcc-app{font-size:var(--mcc-font-mobile-body) !important;}
  #mcc-app main>header:not(.sectionBar) h1.mcc-dashboard-title{font-size:var(--mcc-font-mobile-main) !important;}
  #mcc-app main>header.sectionBar h1,#mcc-app .sectionHeading h1{font-size:var(--mcc-font-mobile-screen) !important;}
  #mcc-app .panelHead h2,#mcc-app .intro h2,#mcc-app .reports h2,#mcc-app .listHead h2{font-size:var(--mcc-font-mobile-subtitle) !important;}
  #mcc-app .sidebar nav button,#mcc-app input,#mcc-app select,#mcc-app textarea,#mcc-app button{font-size:var(--mcc-font-mobile-body);}
  #mcc-app small,#mcc-app .record small,#mcc-app .personPurchaseRow small,#mcc-app label{font-size:var(--mcc-font-mobile-small);}

  /* Compras e Faturas: quatro dados em grade 2x2 e ações embaixo */
  #mcc-app article.record{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:14px 12px !important;
    padding:15px !important;
  }
  #mcc-app article.record>span:nth-child(1){grid-column:1 / -1 !important;}
  #mcc-app article.record>span:nth-child(2),
  #mcc-app article.record>span:nth-child(3),
  #mcc-app article.record>span:nth-child(4),
  #mcc-app article.record>b:nth-child(5){
    grid-column:auto !important;
    display:block !important;
    min-width:0 !important;
  }
  #mcc-app article.record .rowActions,
  #mcc-app article.record>button:nth-child(6){
    grid-column:1 / -1 !important;
    width:100% !important;
    justify-self:stretch !important;
  }
  #mcc-app article.record>button:nth-child(6){
    min-height:42px !important;
    display:flex !important;
    align-items:center;
    justify-content:center;
    padding:0 14px !important;
  }
  #mcc-app .rowActions{
    display:grid !important;
    grid-template-columns:42px minmax(120px,1fr) 42px !important;
    gap:8px !important;
    align-items:center !important;
  }
  #mcc-app .rowActions button.iconAction{
    width:42px !important;
    min-width:42px !important;
    height:42px !important;
  }
  #mcc-app .rowActions .mcc-refund-button{
    width:100% !important;
    min-height:42px !important;
    padding:0 10px !important;
  }
  #mcc-app article.record>span:nth-child(n+2):nth-child(-n+4),
  #mcc-app article.record>b:nth-child(5){
    padding:9px 10px;
    border-radius:12px;
    background:var(--theme-soft2);
  }
  .mcc-font-size-list label{grid-template-columns:1fr 52px;gap:7px 10px;}
  .mcc-font-size-list label span{grid-column:1 / -1;}
  .mcc-font-size-list input[type="range"]{grid-column:1;}
  .mcc-font-size-list output{grid-column:2;}
}
@media(max-width:390px){
  /* mantém a grade 2x2 mesmo nos celulares mais estreitos */
  #mcc-app article.record{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  #mcc-app article.record>span:nth-child(1),
  #mcc-app article.record .rowActions,
  #mcc-app article.record>button:nth-child(6){grid-column:1 / -1 !important;}
}


/* Versão 2.0.66: ações móveis alinhadas e fechar das configurações visível */
@media(max-width:620px){
  /* Área de ações limpa e compacta nas telas Compras e Faturas */
  #mcc-app article.record .rowActions{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:12px !important;
    width:100% !important;
    padding-top:4px;
  }
  #mcc-app article.record .rowActions::before{
    content:"Ações";
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
  }
  #mcc-app article.record .rowActions button,
  #mcc-app article.record .rowActions button.iconAction,
  #mcc-app article.record .rowActions .mcc-refund-button{
    width:46px !important;
    min-width:46px !important;
    height:46px !important;
    min-height:46px !important;
    padding:0 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:14px !important;
    font-size:20px !important;
    line-height:1 !important;
    flex:0 0 46px !important;
  }
  #mcc-app article.record .rowActions .mcc-refund-button{
    color:#8a661d !important;
    background:#fff9e8 !important;
    border:1px solid #d6b36b !important;
  }
  #mcc-app article.record .rowActions .editIcon{
    color:#765496 !important;
    background:#f7effb !important;
    border:1px solid #d9c7e6 !important;
  }
  #mcc-app article.record .rowActions .deleteIcon{
    color:#a84f65 !important;
    background:#fff3f5 !important;
    border:1px solid #edcad3 !important;
  }

  /* Faturas: botão de situação somente com ícone, centralizado */
  #mcc-app article.record>button:nth-child(6){
    width:52px !important;
    min-width:52px !important;
    height:46px !important;
    min-height:46px !important;
    justify-self:center !important;
    padding:0 !important;
    border-radius:14px !important;
    font-size:0 !important;
    line-height:1 !important;
  }
  #mcc-app article.record>button:nth-child(6)::before{
    content:"✓";
    font-size:22px;
    font-weight:800;
    line-height:1;
  }

  /* Configurações sempre dentro da área visível do celular */
  .mcc-settings-overlay{
    display:flex !important;
    align-items:flex-start !important;
    justify-content:center !important;
    padding:calc(12px + env(safe-area-inset-top)) 10px calc(12px + env(safe-area-inset-bottom)) !important;
    overflow:auto !important;
    box-sizing:border-box !important;
  }
  .mcc-settings-modal{
    width:100% !important;
    max-width:610px !important;
    max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
    margin:0 auto !important;
    padding:16px 14px 18px !important;
    border-radius:22px !important;
    overflow:auto !important;
    box-sizing:border-box !important;
  }
  .mcc-settings-modal>header{
    position:sticky !important;
    top:-16px !important;
    z-index:20 !important;
    background:#fffafc !important;
    padding:16px 0 10px !important;
    margin-top:-16px !important;
    margin-bottom:14px !important;
  }
  .mcc-settings-close{
    width:44px !important;
    min-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    margin:0 !important;
    padding:0 !important;
    border-radius:14px !important;
    font-size:25px !important;
    line-height:1 !important;
    flex:0 0 44px !important;
  }
}


/* Versão 2.0.68: personagem decorativa na parte inferior do menu lateral */
@media (min-width:861px) and (min-height:760px){
  #mcc-app .sidebar{
    position:fixed;
    overflow:hidden;
  }
  #mcc-app .sidebar nav{
    position:relative;
    z-index:2;
  }
  #mcc-app .sidebar::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:18px;
    width:150px;
    height:225px;
    transform:translateX(-50%);
    background:url("menu-personagem.png") center bottom/contain no-repeat;
    pointer-events:none;
    z-index:1;
  }
}
@media (max-width:860px), (max-height:759px){
  #mcc-app .sidebar::after{
    display:none !important;
  }
}


/* Versão 2.0.69: personagem visível em qualquer altura de tela no computador */
@media (min-width:861px){
  #mcc-app .sidebar{
    position:fixed !important;
    overflow:hidden !important;
  }
  #mcc-app .sidebar nav{
    position:relative;
    z-index:2;
  }
  #mcc-app .sidebar::after{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    left:50% !important;
    bottom:12px !important;
    width:132px !important;
    height:198px !important;
    transform:translateX(-50%) !important;
    background-image:url("menu-personagem.png") !important;
    background-position:center bottom !important;
    background-repeat:no-repeat !important;
    background-size:contain !important;
    opacity:1 !important;
    pointer-events:none !important;
    z-index:1 !important;
  }
}
@media (min-width:861px) and (max-height:680px){
  #mcc-app .sidebar::after{
    width:105px !important;
    height:155px !important;
    bottom:6px !important;
  }
}
@media (max-width:860px){
  #mcc-app .sidebar::after{
    display:none !important;
  }
}

/* Versão 2.0.70: imagem do menu escolhida nas configurações */
#mcc-app .sidebar::after{
  background-image:var(--mcc-menu-image-url, url("menu-personagem.png")) !important;
  width:var(--mcc-menu-image-size,132px) !important;
  height:calc(var(--mcc-menu-image-size,132px) * 1.5) !important;
}
#mcc-app .sidebar.mcc-menu-image-empty::after{
  display:none !important;
}
.mcc-menu-image-control{
  grid-column:1/-1;
}
.mcc-menu-image-editor{
  display:grid;
  grid-template-columns:130px minmax(0,1fr);
  gap:14px 18px;
  align-items:center;
  margin-top:14px;
}
.mcc-menu-image-preview{
  grid-row:1/5;
  width:130px;
  height:170px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px dashed #decbd3;
  border-radius:16px;
  background:linear-gradient(145deg,#fff,#fbeff3);
}
.mcc-menu-image-preview img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}
.mcc-menu-image-preview.empty::before{
  content:"Sem imagem";
  color:#9b8890;
  font-size:12px;
}
.mcc-menu-image-preview.empty img{display:none;}
.mcc-menu-image-actions{
  display:flex;
  gap:9px;
  flex-wrap:wrap;
}
.mcc-menu-image-choose,
.mcc-menu-image-remove{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:11px;
  padding:0 13px;
  cursor:pointer;
  font-size:12px;
  font-weight:750;
}
.mcc-menu-image-choose{
  border:0;
  background:linear-gradient(135deg,var(--theme-action,#c96f84),var(--theme-action2,#a34f64));
  color:#fff;
}
.mcc-menu-image-remove{
  border:1px solid #ead7de;
  background:#fff;
  color:#8d5362;
}
.mcc-menu-image-choose.disabled,
.mcc-menu-image-remove:disabled{opacity:.5;cursor:not-allowed;}
.mcc-menu-image-size{
  display:grid;
  grid-template-columns:auto minmax(120px,1fr) 55px;
  gap:10px;
  align-items:center;
  color:#57444d;
  font-size:12px;
  font-weight:650;
}
.mcc-menu-image-size input{width:100%;accent-color:#c96f84;}
.mcc-menu-image-size output{
  border-radius:999px;
  background:#f8e8ed;
  color:#955265;
  padding:6px 8px;
  text-align:center;
  font-size:11px;
  font-weight:750;
}
.mcc-menu-image-mobile-option{
  display:flex;
  align-items:center;
  gap:8px;
  color:#57444d;
  font-size:12px;
  cursor:pointer;
}
.mcc-menu-image-mobile-option input{accent-color:#c96f84;}
.mcc-menu-image-note{color:#927d86;font-size:10.5px;}
@media(max-width:860px){
  #mcc-app .sidebar.mcc-menu-image-mobile::after{
    display:block !important;
    width:min(var(--mcc-menu-image-size,110px),110px) !important;
    height:min(calc(var(--mcc-menu-image-size,110px) * 1.5),165px) !important;
    bottom:10px !important;
  }
}
@media(max-width:620px){
  .mcc-menu-image-editor{
    grid-template-columns:96px minmax(0,1fr);
    gap:12px;
  }
  .mcc-menu-image-preview{
    width:96px;
    height:126px;
  }
  .mcc-menu-image-size{
    grid-template-columns:1fr 50px;
  }
  .mcc-menu-image-size>span{grid-column:1/-1;}
}


/* Versão 2.0.71: retorno visual ao marcar pagamento */
#mcc-app .record button:disabled{opacity:.62;cursor:wait!important;pointer-events:none;}
#mcc-app .record .paidBtn{background:var(--theme-soft)!important;color:var(--theme-dark)!important;}


/* Versão 2.0.72: botão de pagamento com clique direto */
#mcc-app .mcc-payment-button[data-saving="1"],
#mcc-app .mcc-payment-button:disabled{opacity:.68;cursor:wait;}


/* MCC 2.0.87 - Tela privada de acesso */
.mcc-login-page{min-height:min(82vh,760px);display:flex;align-items:center;justify-content:center;padding:36px 18px;background:linear-gradient(145deg,#fff9f8 0%,#fff3f3 45%,#f8f1ff 100%);box-sizing:border-box;font-family:var(--mcc-font,Arial,sans-serif)}
.mcc-login-card{width:min(430px,100%);background:rgba(255,255,255,.92);border:1px solid rgba(171,65,82,.18);border-radius:28px;padding:34px 34px 30px;box-shadow:0 22px 65px rgba(89,49,63,.13);box-sizing:border-box;color:#3d2530}
.mcc-login-lock{width:58px;height:58px;border-radius:18px;background:#fff0f1;display:grid;place-items:center;font-size:27px;margin:0 auto 16px;box-shadow:inset 0 0 0 1px rgba(185,58,78,.10)}
.mcc-login-kicker{text-align:center;font-size:12px;font-weight:800;letter-spacing:.18em;color:#ad4c5b;margin-bottom:7px}
.mcc-login-card h1{margin:0;text-align:center;font-size:29px;line-height:1.15;color:#3b2530;font-weight:800}
.mcc-login-intro{text-align:center;margin:10px auto 24px;color:#856873;font-size:14px;line-height:1.55;max-width:330px}
.mcc-login-error{margin:0 0 18px;padding:11px 13px;border-radius:13px;background:#fff0f0;border:1px solid #f2c8cc;color:#a33344;font-size:13px;font-weight:650;text-align:center}
.mcc-login-form{display:grid;gap:9px}
.mcc-login-form label:not(.mcc-remember){font-size:13px;font-weight:750;color:#513641;margin-top:5px}
.mcc-login-form input[type=text],.mcc-login-form input[type=password]{width:100%;height:48px;padding:0 14px;border:1px solid #e6d5da;border-radius:13px;background:#fff;box-sizing:border-box;font:inherit;color:#3b2530;outline:none;transition:border-color .15s,box-shadow .15s}
.mcc-login-form input[type=text]:focus,.mcc-login-form input[type=password]:focus{border-color:#c55b6b;box-shadow:0 0 0 3px rgba(197,91,107,.11)}
.mcc-password-wrap{position:relative}.mcc-password-wrap input{padding-right:82px!important}.mcc-password-toggle{position:absolute;right:7px;top:7px;height:34px;padding:0 10px;border:0;border-radius:9px;background:#fff0f1;color:#a63f50;font-size:12px;font-weight:750;cursor:pointer}
.mcc-remember{display:flex;align-items:center;gap:7px;margin:7px 0 5px;color:#765964;font-size:13px;cursor:pointer}.mcc-remember input{width:16px;height:16px;accent-color:#b83f52}
.mcc-login-submit{display:flex;align-items:center;justify-content:center;width:100%;min-height:49px;border:0;border-radius:14px;background:#b83f52;color:#fff;font-size:15px;font-weight:800;cursor:pointer;text-decoration:none!important;box-shadow:0 9px 20px rgba(184,63,82,.20);transition:transform .12s,filter .12s}
.mcc-login-submit:hover{filter:brightness(.97);transform:translateY(-1px);color:#fff}.mcc-login-link{margin-top:18px;box-sizing:border-box}
.mcc-login-foot{text-align:center;margin-top:18px;font-size:11px;color:#a98d96;line-height:1.45}
@media(max-width:520px){.mcc-login-page{min-height:72vh;padding:20px 12px}.mcc-login-card{padding:28px 20px 24px;border-radius:22px}.mcc-login-card h1{font-size:25px}}


/* Versão 2.0.92: segunda ideia - símbolos minimalistas e leves */
#mcc-app .invoiceCard header .minicard.mcc-card-brand-icon{
  display:grid;
  place-items:center;
  width:52px;
  height:38px;
  min-width:52px;
  padding:0;
  box-sizing:border-box;
  overflow:hidden;
  border:1px solid var(--theme-line);
  box-shadow:0 4px 12px rgba(88,61,96,.08);
}
#mcc-app .invoiceCard header .minicard.mcc-card-brand-porto,
#mcc-app .invoiceCard header .minicard.mcc-card-brand-nu{
  background:#f2edff;
}
#mcc-app .invoiceCard header .minicard.mcc-card-brand-mercado{
  background:#fff0f1;
}
#mcc-app .mcc-brand-mark{
  display:block;
  width:23px;
  height:23px;
}
#mcc-app .mcc-brand-mark-porto{
  width:22px;
  height:22px;
  color:#8074c8;
}
#mcc-app .mcc-brand-mark-mercado{
  width:23px;
  height:23px;
  color:#e45f73;
}
#mcc-app .mcc-brand-mark-nu{
  width:auto;
  height:auto;
  color:#7d2cc7;
  font-family:Inter,Arial,sans-serif;
  font-size:23px;
  font-weight:800;
  line-height:1;
  letter-spacing:-2px;
  transform:translateY(-1px);
}
@media (min-width:641px){
  .mcc-settings-modal{will-change:transform;}
  .mcc-settings-modal>header.mcc-settings-drag-handle{
    cursor:grab;
    user-select:none;
    touch-action:none;
  }
  .mcc-settings-modal>header.mcc-settings-drag-handle.dragging{cursor:grabbing;}
}


/* Versão 2.0.93: identificação dos cartões por cor e controles de fonte do painel */
:root{
  --mcc-font-desktop-next-due:28px;
  --mcc-font-desktop-open-total:28px;
  --mcc-font-desktop-invoice-amount:22px;
  --mcc-font-desktop-card-title:13px;
  --mcc-font-desktop-card-small:11px;
  --mcc-font-mobile-next-due:18px;
  --mcc-font-mobile-open-total:18px;
  --mcc-font-mobile-invoice-amount:20px;
  --mcc-font-mobile-card-title:13px;
  --mcc-font-mobile-card-small:10px;
}
/* Destaques numéricos do início */
#mcc-app .metrics article:nth-child(1)>b{font-size:var(--mcc-font-desktop-next-due) !important;}
#mcc-app .metrics article:nth-child(2)>b{font-size:var(--mcc-font-desktop-open-total) !important;}
/* Próximas faturas */
#mcc-app .invoiceCard>header span>b{font-size:var(--mcc-font-desktop-card-title) !important;}
#mcc-app .invoiceCard .invoiceValue>b{font-size:var(--mcc-font-desktop-invoice-amount) !important;}
#mcc-app .invoiceCard small,
#mcc-app .invoiceCard .invoiceMeta em{font-size:var(--mcc-font-desktop-card-small) !important;}
/* Identificação por cor, sem logos */
#mcc-app .invoiceCard header .minicard.mcc-card-color-chip{
  display:block !important;
  width:52px !important;
  height:38px !important;
  min-width:52px !important;
  padding:0 !important;
  border-radius:10px !important;
  border:1px solid rgba(47,41,55,.08) !important;
  box-shadow:0 4px 12px rgba(47,41,55,.08) !important;
  background-image:none !important;
  overflow:hidden !important;
}
#mcc-app .invoiceCard header .minicard.mcc-card-color-porto{background:#72A7E8 !important;}
#mcc-app .invoiceCard header .minicard.mcc-card-color-mercado{background:#F2CF58 !important;}
#mcc-app .invoiceCard header .minicard.mcc-card-color-elson{background:#79BF8A !important;}
#mcc-app .invoiceCard header .minicard.mcc-card-color-nu{background:#9B72D8 !important;}
#mcc-app .invoiceCard header .minicard.mcc-card-color-default{background:#D8D0DC !important;}
/* Neutraliza classes antigas de logos, caso ainda estejam no DOM após atualização */
#mcc-app .invoiceCard header .minicard.mcc-card-color-chip .mcc-brand-mark{display:none !important;}

@media(max-width:620px){
  #mcc-app .metrics article:nth-child(1)>b{font-size:var(--mcc-font-mobile-next-due) !important;}
  #mcc-app .metrics article:nth-child(2)>b{font-size:var(--mcc-font-mobile-open-total) !important;}
  #mcc-app .invoiceCard>header span>b{font-size:var(--mcc-font-mobile-card-title) !important;}
  #mcc-app .invoiceCard .invoiceValue>b{font-size:var(--mcc-font-mobile-invoice-amount) !important;}
  #mcc-app .invoiceCard small,
  #mcc-app .invoiceCard .invoiceMeta em{font-size:var(--mcc-font-mobile-card-small) !important;}
}

/* Versão 2.0.94: janela de configurações mais ampla, cantos consistentes e arraste suave */
@media (min-width:641px){
  .mcc-settings-overlay{
    padding:18px 24px !important;
  }
  .mcc-settings-modal{
    width:min(760px,calc(100vw - 48px)) !important;
    max-height:min(820px,calc(100dvh - 36px)) !important;
    display:flex !important;
    flex-direction:column !important;
    overflow:hidden !important;
    border-radius:28px !important;
    box-sizing:border-box !important;
    padding:22px 22px 20px !important;
    transform:translate3d(var(--mcc-settings-x,0),var(--mcc-settings-y,0),0);
    backface-visibility:hidden;
    contain:layout paint;
  }
  .mcc-settings-modal>header{
    flex:0 0 auto !important;
    margin:0 0 16px !important;
    padding:2px 4px 2px 2px !important;
    border-radius:20px 20px 12px 12px;
  }
  .mcc-settings-modal .mcc-settings-grid{
    flex:1 1 auto !important;
    min-height:0 !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    padding:2px 10px 8px 2px !important;
    margin-right:-4px !important;
    scrollbar-gutter:stable;
    overscroll-behavior:contain;
  }
  .mcc-settings-modal .mcc-settings-grid::-webkit-scrollbar{width:10px;}
  .mcc-settings-modal .mcc-settings-grid::-webkit-scrollbar-track{background:transparent;}
  .mcc-settings-modal .mcc-settings-grid::-webkit-scrollbar-thumb{
    background:#d9c8d0;
    border:3px solid transparent;
    border-radius:999px;
    background-clip:padding-box;
  }
  .mcc-settings-modal .mcc-settings-grid::-webkit-scrollbar-thumb:hover{background:#c8aeb8;background-clip:padding-box;}
  .mcc-settings-modal>header.mcc-settings-drag-handle{
    cursor:grab;
    user-select:none;
    -webkit-user-select:none;
    touch-action:none;
  }
  .mcc-settings-modal>header.mcc-settings-drag-handle.dragging{cursor:grabbing;}
  .mcc-settings-modal.mcc-settings-dragging{
    transition:none !important;
    box-shadow:0 34px 90px rgba(58,31,42,.28) !important;
  }
}

/* 2.0.95 — próximas faturas mais claras */
#mcc-app .invoiceCard .invoiceSummary{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(120px,.85fr);align-items:start;gap:18px;margin:18px 0 14px;}
#mcc-app .invoiceCard .invoiceSummary .invoiceValue{margin:0;display:flex;flex-direction:column;min-width:0;}
#mcc-app .invoiceCard .invoiceSummary .invoiceDue{display:flex;flex-direction:column;align-items:flex-start;min-width:0;}
#mcc-app .invoiceCard .invoiceSummary small,#mcc-app .invoiceCard>header small{font-size:var(--mcc-font-desktop-card-small) !important;}
#mcc-app .invoiceCard .invoiceSummary .invoiceValue>b{margin-top:5px;color:var(--theme-dark);font-size:var(--mcc-font-desktop-invoice-amount) !important;}
#mcc-app .invoiceCard .invoiceSummary .invoiceDue>b{margin-top:5px;font-size:13px;font-weight:750;white-space:nowrap;}
#mcc-app .invoiceCard .invoiceSummary .invoiceDue>em{display:inline-flex;width:max-content;max-width:100%;margin-top:6px;border-radius:999px;background:var(--theme-soft2);color:var(--theme-dark);font-size:var(--mcc-font-desktop-card-small) !important;font-style:normal;font-weight:700;line-height:1.1;padding:5px 8px;white-space:nowrap;}
#mcc-app .invoiceCard .invoiceMeta{display:none !important;}
@media(max-width:620px){
  #mcc-app .invoiceCard .invoiceSummary{grid-template-columns:1fr 1fr;gap:12px;margin:15px 0 12px;}
  #mcc-app .invoiceCard .invoiceSummary small,#mcc-app .invoiceCard>header small{font-size:var(--mcc-font-mobile-card-small) !important;}
  #mcc-app .invoiceCard .invoiceSummary .invoiceValue>b{font-size:var(--mcc-font-mobile-invoice-amount) !important;}
  #mcc-app .invoiceCard .invoiceSummary .invoiceDue>b{font-size:12px;}
  #mcc-app .invoiceCard .invoiceSummary .invoiceDue>em{font-size:var(--mcc-font-mobile-card-small) !important;padding:4px 7px;}
}

/* v2.0.96 — alinhamento dos cards de próximas faturas */
#mcc-app .invoiceCard>header{
  position:relative;
  min-height:52px;
  align-items:flex-start;
  padding-right:76px;
}
#mcc-app .invoiceCard>header span{
  justify-content:flex-start;
}
#mcc-app .invoiceCard>header .invoiceCountdown{
  position:absolute;
  top:2px;
  right:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:max-content;
  max-width:72px;
  border-radius:999px;
  background:var(--theme-soft2);
  color:var(--theme-dark);
  font-family:inherit !important;
  font-size:calc(var(--mcc-font-desktop-card-small) - 1px) !important;
  font-style:normal;
  font-weight:700;
  line-height:1.15;
  padding:5px 7px;
  white-space:nowrap;
}
#mcc-app .invoiceCard .invoiceSummary{
  align-items:end;
  margin-top:14px;
}
#mcc-app .invoiceCard .invoiceSummary .invoiceValue,
#mcc-app .invoiceCard .invoiceSummary .invoiceDue{
  min-height:54px;
  justify-content:flex-end;
}
#mcc-app .invoiceCard .invoiceSummary .invoiceValue>b,
#mcc-app .invoiceCard .invoiceSummary .invoiceDue>b{
  font-family:inherit !important;
  line-height:1.15;
}
#mcc-app .invoiceCard .invoiceSummary .invoiceDue>b{
  font-size:var(--mcc-font-desktop-invoice-amount) !important;
  color:var(--theme-dark);
  font-weight:750;
}
@media(max-width:620px){
  #mcc-app .invoiceCard>header{padding-right:66px;min-height:48px;}
  #mcc-app .invoiceCard>header .invoiceCountdown{
    max-width:64px;
    font-size:calc(var(--mcc-font-mobile-card-small) - 1px) !important;
    padding:4px 6px;
  }
  #mcc-app .invoiceCard .invoiceSummary .invoiceDue>b{
    font-size:var(--mcc-font-mobile-invoice-amount) !important;
  }
}


/* v2.0.97 — vencimento alinhado à direita nos cards de próximas faturas */
#mcc-app .invoiceCard .invoiceSummary{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  column-gap:18px;
}
#mcc-app .invoiceCard .invoiceSummary .invoiceDue{
  align-items:flex-end !important;
  text-align:right;
}
#mcc-app .invoiceCard .invoiceSummary .invoiceDue small,
#mcc-app .invoiceCard .invoiceSummary .invoiceDue>b{
  width:100%;
  text-align:right;
}
@media(max-width:620px){
  #mcc-app .invoiceCard .invoiceSummary{column-gap:12px;}
  #mcc-app .invoiceCard .invoiceSummary .invoiceDue{
    align-items:flex-end !important;
    text-align:right;
  }
}


/* v2.0.98 — tamanho do menu e cor personalizada por cartão */
:root{--mcc-font-desktop-menu:14px;--mcc-font-mobile-menu:14px;}
#mcc-app .sidebar nav button{font-size:var(--mcc-font-desktop-menu) !important;}
#mcc-app .mcc-card-color-field{display:flex !important;flex-direction:column !important;gap:8px !important;}
#mcc-app .mcc-card-color-input{display:flex;align-items:center;gap:12px;min-height:54px;border:1px solid var(--theme-line);border-radius:14px;background:#fff;padding:9px 12px;}
#mcc-app .mcc-card-color-input input[type="color"]{width:58px !important;height:38px !important;min-width:58px !important;border:1px solid var(--theme-line) !important;border-radius:10px !important;background:#fff !important;padding:3px !important;cursor:pointer;}
#mcc-app .mcc-card-color-input small{color:var(--muted);font-size:11px;line-height:1.35;}
@media(max-width:620px){#mcc-app .sidebar nav button{font-size:var(--mcc-font-mobile-menu) !important;}}


/* v2.0.99 — Configurações acompanha a fonte do menu e seleção com fundo suave */
#mcc-app .sidebar nav .mcc-settings-button{
  font-size:var(--mcc-font-desktop-menu) !important;
}
#mcc-app .sidebar nav button.active,
#mcc-app .sidebar nav .mcc-settings-button.active{
  background:var(--theme-soft2) !important;
  border-color:var(--theme-line) !important;
  color:var(--theme-dark) !important;
  box-shadow:none !important;
  transform:none !important;
}
#mcc-app .sidebar nav button.active:hover,
#mcc-app .sidebar nav .mcc-settings-button.active:hover{
  background:var(--theme-soft) !important;
  transform:none !important;
}
@media(max-width:620px){
  #mcc-app .sidebar nav .mcc-settings-button{
    font-size:var(--mcc-font-mobile-menu) !important;
  }
}

/* v2.0.100 — tipografia consistente nas telas e configurações sem escurecer o fundo */
/* A janela de Configurações continua acima do app, mas o conteúdo atrás permanece visível normalmente. */
.mcc-settings-overlay{
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

/* Textos comuns e botões: Compras, Faturas, Cartões, Pessoas, Relatórios e modais. */
#mcc-app .new,
#mcc-app .submit,
#mcc-app .closeAction,
#mcc-app .excelBtn,
#mcc-app .filters select,
#mcc-app .filters input,
#mcc-app .search input,
#mcc-app .record,
#mcc-app .record button,
#mcc-app .rowActions button,
#mcc-app .creditActions button,
#mcc-app .registryRow,
#mcc-app .registryRow button,
#mcc-app .personDetail,
#mcc-app .personDetail button,
#mcc-app .personPurchaseRow,
#mcc-app .personReportToolbar button,
#mcc-app .modal input,
#mcc-app .modal select,
#mcc-app .modal textarea,
#mcc-app .modal button,
#mcc-app .cards .credit,
#mcc-app .emptyRegistry,
#mcc-app .note,
#mcc-app .invoiceCard>button{
  font-size:var(--mcc-font-desktop-body) !important;
}

/* Textos menores: cabeçalhos das listas, rótulos, observações e metadados. */
#mcc-app .invhead,
#mcc-app .record small,
#mcc-app .record label,
#mcc-app .registryRow small,
#mcc-app .personPurchaseRow small,
#mcc-app .personReportInfoBlock small,
#mcc-app .modal label,
#mcc-app .modal small,
#mcc-app .filters label,
#mcc-app .credit small,
#mcc-app .emptyRegistry small,
#mcc-app .note small{
  font-size:var(--mcc-font-desktop-small) !important;
}

/* Subtítulos internos das telas. */
#mcc-app .panelHead h2,
#mcc-app .intro h2,
#mcc-app .reports h2,
#mcc-app .listHead h2,
#mcc-app .personReportHero h2{
  font-size:var(--mcc-font-desktop-subtitle) !important;
}

/* Títulos das telas principais. */
#mcc-app main>header.sectionBar h1,
#mcc-app .sectionHeading h1{
  font-size:var(--mcc-font-desktop-screen) !important;
}

@media(max-width:620px){
  #mcc-app .new,
  #mcc-app .submit,
  #mcc-app .closeAction,
  #mcc-app .excelBtn,
  #mcc-app .filters select,
  #mcc-app .filters input,
  #mcc-app .search input,
  #mcc-app .record,
  #mcc-app .record button,
  #mcc-app .rowActions button,
  #mcc-app .creditActions button,
  #mcc-app .registryRow,
  #mcc-app .registryRow button,
  #mcc-app .personDetail,
  #mcc-app .personDetail button,
  #mcc-app .personPurchaseRow,
  #mcc-app .personReportToolbar button,
  #mcc-app .modal input,
  #mcc-app .modal select,
  #mcc-app .modal textarea,
  #mcc-app .modal button,
  #mcc-app .cards .credit,
  #mcc-app .emptyRegistry,
  #mcc-app .note,
  #mcc-app .invoiceCard>button{
    font-size:var(--mcc-font-mobile-body) !important;
  }
  #mcc-app .invhead,
  #mcc-app .record small,
  #mcc-app .record label,
  #mcc-app .registryRow small,
  #mcc-app .personPurchaseRow small,
  #mcc-app .personReportInfoBlock small,
  #mcc-app .modal label,
  #mcc-app .modal small,
  #mcc-app .filters label,
  #mcc-app .credit small,
  #mcc-app .emptyRegistry small,
  #mcc-app .note small{
    font-size:var(--mcc-font-mobile-small) !important;
  }
  #mcc-app .panelHead h2,
  #mcc-app .intro h2,
  #mcc-app .reports h2,
  #mcc-app .listHead h2,
  #mcc-app .personReportHero h2{
    font-size:var(--mcc-font-mobile-subtitle) !important;
  }
  #mcc-app main>header.sectionBar h1,
  #mcc-app .sectionHeading h1{
    font-size:var(--mcc-font-mobile-screen) !important;
  }
}


/* Versão 2.0.108: exportar e importar com layout padronizado */
.mcc-backup-actions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  width:100%;
  align-items:stretch;
}
.mcc-backup-actions .mcc-setting-card{
  appearance:none;
  -webkit-appearance:none;
  margin:0;
  width:100%;
  min-width:0;
  min-height:126px;
  height:100%;
  padding:16px 17px;
  border-radius:20px;
  border:1px solid #eedce2;
  background:#fff;
  display:grid;
  grid-template-columns:48px minmax(0,1fr) 20px;
  gap:12px;
  align-items:start;
  box-sizing:border-box;
  overflow:hidden;
}
.mcc-backup-actions .mcc-setting-card > i{
  width:48px;
  height:48px;
  border-radius:15px;
  align-self:start;
}
.mcc-backup-actions .mcc-setting-card span{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-self:center;
  gap:4px;
  overflow:hidden;
}
.mcc-backup-actions .mcc-setting-card b{
  display:block;
  line-height:1.25;
}
.mcc-backup-actions .mcc-setting-card small{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  overflow:hidden;
  white-space:normal;
  overflow-wrap:anywhere;
  line-height:1.35;
  margin-top:0;
}
.mcc-backup-actions .mcc-setting-card strong{
  width:20px;
  margin-left:0;
  justify-self:end;
  align-self:center;
  display:grid;
  place-items:center;
}
@media (max-width:760px){
  .mcc-backup-actions{grid-template-columns:1fr;gap:12px;}
  .mcc-backup-actions .mcc-setting-card{min-height:0;}
}


/* Versão 2.0.116: pagamentos automáticos e reabertura */
#mcc-app .record.mcc-row-auto-paid .mcc-payment-button{white-space:nowrap;}
#mcc-app .record.mcc-row-reopened .mcc-payment-button{border-style:dashed;}
.mcc-payment-origin{display:inline-flex;align-items:center;min-height:24px;padding:3px 9px;border-radius:999px;font-size:10.5px;font-weight:750;white-space:nowrap;background:#f3eef0;color:#725d65;}
.mcc-payment-origin.auto{background:#fff3dc;color:#8a6327;}
.mcc-payment-origin.manual{background:#eaf4ed;color:#4d7359;}


/* Versão 2.0.117: tamanhos de fonte por valor digitado, PC e celular lado a lado */
.mcc-setting-control.typography-paired{grid-column:1/-1;}
.mcc-setting-control.typography-paired .mcc-setting-control-title>i{font-size:12px;}
.mcc-font-pair-grid{display:grid;gap:0;margin-top:16px;border:1px solid #f0e3e7;border-radius:15px;overflow:hidden;background:#fff;}
.mcc-font-pair-head,.mcc-font-pair-row{display:grid;grid-template-columns:minmax(210px,1fr) 118px 118px;gap:12px;align-items:center;min-width:0;}
.mcc-font-pair-head{padding:10px 13px;background:#fbf6f8;color:#765d67;font-size:11px;letter-spacing:.02em;}
.mcc-font-pair-head b{text-align:center;font-size:11px;}
.mcc-font-pair-row{padding:10px 13px;border-top:1px solid #f2e7ea;}
.mcc-font-pair-row>span{min-width:0;font-size:12px;font-weight:650;line-height:1.25;color:#57444d;}
.mcc-font-pair-row>span small{display:block;margin-top:3px;font-size:9.5px;font-weight:500;opacity:.58;}
.mcc-font-number{height:38px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;border:1px solid #eadde1;border-radius:11px;background:#fffafc;overflow:hidden;transition:.16s ease;}
.mcc-font-number:focus-within{border-color:#c96f84;box-shadow:0 0 0 3px rgba(201,111,132,.10);}
.mcc-font-number input[type="number"]{width:100%;min-width:0;height:36px;border:0 !important;outline:0 !important;background:transparent !important;padding:0 4px 0 11px !important;text-align:center;font-family:inherit;font-size:13px;font-weight:750;line-height:1;color:#6f4350;box-shadow:none !important;}
.mcc-font-number em{padding:0 10px 0 3px;font-size:10.5px;font-style:normal;font-weight:700;color:#9b7a84;pointer-events:none;}
.mcc-font-number input[type="number"]::-webkit-inner-spin-button,.mcc-font-number input[type="number"]::-webkit-outer-spin-button{opacity:.55;}
@media(max-width:640px){
  .mcc-font-pair-head{display:none;}
  .mcc-font-pair-grid{gap:0;}
  .mcc-font-pair-row{grid-template-columns:1fr 86px 86px;gap:8px;padding:11px 10px;}
  .mcc-font-pair-row>span{grid-column:1/-1;font-size:12px;}
  .mcc-font-pair-row .mcc-font-number:nth-of-type(1)::before{content:"PC";}
  .mcc-font-pair-row .mcc-font-number:nth-of-type(2)::before{content:"Cel";}
  .mcc-font-pair-row .mcc-font-number{grid-template-columns:auto minmax(0,1fr) auto;}
  .mcc-font-pair-row .mcc-font-number::before{padding-left:8px;font-size:9px;font-weight:800;color:#a17f8a;}
  .mcc-font-number input[type="number"]{padding-left:4px !important;padding-right:1px !important;}
  .mcc-font-number em{padding-right:7px;}
}


/* Versão 2.0.118: configurações compactas e ícones personalizados */
.mcc-settings-modal{width:min(720px,100%);}
.mcc-settings-quick-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:100%;}
.mcc-settings-quick-grid .mcc-quick-card{min-width:0;min-height:92px;height:100%;box-sizing:border-box;}
.mcc-settings-quick-grid .mcc-setting-card{grid-template-columns:54px minmax(0,1fr) 18px;padding:14px 15px;gap:12px;align-items:center;}
.mcc-settings-quick-grid .mcc-setting-control{padding:14px 15px;}
.mcc-settings-quick-grid .mcc-setting-control-title{grid-template-columns:54px minmax(0,1fr);gap:12px;}
.mcc-setting-icon{width:48px;height:48px;display:grid;place-items:center;flex:0 0 auto;overflow:hidden;border-radius:13px;background:#fff;}
.mcc-setting-icon img{display:block;width:43px;height:43px;object-fit:contain;}
.mcc-setting-card>.mcc-setting-icon{width:48px;height:48px;}
.mcc-setting-card>.mcc-setting-icon img{width:43px;height:43px;}
.mcc-setting-control-title>.mcc-setting-icon{width:48px;height:48px;}
.mcc-setting-control-title>.mcc-setting-icon img{width:43px;height:43px;}
.mcc-font-quick{display:grid;grid-template-rows:auto auto;gap:10px;align-content:center;}
.mcc-font-select-wrap{display:block;margin-left:66px;min-width:0;}
.mcc-font-select{width:100%;height:38px;border:1px solid #eadde1;border-radius:11px;background:#fffafc;color:#49363e;padding:0 34px 0 11px;font-family:inherit;font-size:12.5px;font-weight:700;outline:0;}
.mcc-font-select:focus{border-color:#c96f84;box-shadow:0 0 0 3px rgba(201,111,132,.10);}
.mcc-setting-control.typography-paired .mcc-setting-control-title{grid-template-columns:54px minmax(0,1fr);}
.mcc-setting-control.menu-image-control .mcc-setting-control-title{grid-template-columns:54px minmax(0,1fr);}
.mcc-setting-control.metric-icon-control .mcc-setting-control-title{grid-template-columns:54px minmax(0,1fr) auto;}
.mcc-backup-actions .mcc-setting-card{grid-template-columns:56px minmax(0,1fr) 20px;}
.mcc-backup-actions .mcc-setting-icon{width:52px;height:52px;border-radius:14px;background:#fff;}
.mcc-backup-actions .mcc-setting-icon img{width:48px;height:48px;object-fit:contain;}
@media(max-width:640px){
  .mcc-settings-quick-grid{grid-template-columns:1fr;}
  .mcc-settings-quick-grid .mcc-quick-card{min-height:0;}
  .mcc-font-select-wrap{margin-left:0;margin-top:2px;}
  .mcc-setting-icon,.mcc-setting-card>.mcc-setting-icon,.mcc-setting-control-title>.mcc-setting-icon{width:44px;height:44px;}
  .mcc-setting-icon img,.mcc-setting-card>.mcc-setting-icon img,.mcc-setting-control-title>.mcc-setting-icon img{width:40px;height:40px;}
  .mcc-settings-quick-grid .mcc-setting-card{grid-template-columns:48px minmax(0,1fr) 16px;}
  .mcc-settings-quick-grid .mcc-setting-control-title,.mcc-setting-control.typography-paired .mcc-setting-control-title,.mcc-setting-control.menu-image-control .mcc-setting-control-title{grid-template-columns:48px minmax(0,1fr);}
  .mcc-setting-control.metric-icon-control .mcc-setting-control-title{grid-template-columns:48px minmax(0,1fr) auto;}
}


/* Versão 2.0.119: topo das configurações mais compacto e ícone de tamanhos sem corte */
.mcc-settings-quick-grid .mcc-palette-quick{
  min-height:82px;
  padding:12px 15px;
  grid-template-columns:48px auto;
  justify-content:center;
  align-content:center;
  gap:12px;
}
.mcc-palette-quick .mcc-setting-icon{
  width:46px;
  height:46px;
}
.mcc-palette-quick .mcc-setting-icon img{
  width:42px;
  height:42px;
}
.mcc-palette-title{
  min-width:0;
  display:inline-flex !important;
  flex-direction:row !important;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:0 !important;
  white-space:nowrap;
}
.mcc-palette-title b{line-height:1.2;}
.mcc-palette-title strong{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:auto;
  margin:0;
  font-size:21px;
  line-height:1;
  opacity:.42;
}
.mcc-settings-quick-grid .mcc-font-quick{
  min-height:82px;
  padding:11px 14px;
  gap:6px;
}
.mcc-settings-quick-grid .mcc-font-quick .mcc-setting-control-title{
  grid-template-columns:46px minmax(0,1fr);
  gap:10px;
}
.mcc-settings-quick-grid .mcc-font-quick .mcc-setting-icon{
  width:44px;
  height:44px;
}
.mcc-settings-quick-grid .mcc-font-quick .mcc-setting-icon img{
  width:40px;
  height:40px;
}
.mcc-settings-quick-grid .mcc-font-quick .mcc-font-select-wrap{
  margin-left:56px;
}
.mcc-setting-control.typography-paired .mcc-setting-control-title{
  grid-template-columns:62px minmax(0,1fr);
  gap:12px;
}
.mcc-setting-control.typography-paired .mcc-setting-control-title>.mcc-setting-icon{
  width:58px;
  height:58px;
  overflow:visible;
  border-radius:14px;
  padding:4px;
  box-sizing:border-box;
}
.mcc-setting-control.typography-paired .mcc-setting-control-title>.mcc-setting-icon img{
  width:48px;
  height:48px;
  object-fit:contain;
}
@media(max-width:640px){
  .mcc-settings-quick-grid .mcc-palette-quick{min-height:70px;grid-template-columns:44px auto;}
  .mcc-settings-quick-grid .mcc-font-quick{min-height:76px;}
  .mcc-settings-quick-grid .mcc-font-quick .mcc-font-select-wrap{margin-left:0;}
  .mcc-setting-control.typography-paired .mcc-setting-control-title{grid-template-columns:56px minmax(0,1fr);}
  .mcc-setting-control.typography-paired .mcc-setting-control-title>.mcc-setting-icon{width:52px;height:52px;padding:4px;}
  .mcc-setting-control.typography-paired .mcc-setting-control-title>.mcc-setting-icon img{width:44px;height:44px;}
}


/* Versão 2.0.120: atalhos compactos de aparência, fonte e indicadores */
.mcc-settings-modal{position:relative;}
.mcc-settings-tools-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  align-items:stretch;
}
.mcc-settings-tools-grid .mcc-tool-button{
  width:100%;
  min-width:0;
  min-height:82px;
  margin:0;
  padding:10px 12px;
  border:1px solid #eedce2;
  border-radius:17px;
  background:#fff;
  color:inherit;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  text-align:left;
  font-family:inherit;
  cursor:pointer;
  transition:border-color .15s ease;
}
.mcc-settings-tools-grid button.mcc-tool-button:hover{
  transform:none !important;
  box-shadow:none !important;
  background:#fff !important;
  color:inherit !important;
  border-color:#e4cdd5;
}
.mcc-settings-tools-grid .mcc-tool-button:focus-visible{
  outline:2px solid #c96f84;
  outline-offset:2px;
}
.mcc-settings-tools-grid .mcc-tool-button>.mcc-setting-icon{
  width:48px;
  height:48px;
  flex:0 0 48px;
  border-radius:12px;
  overflow:visible;
  background:transparent;
}
.mcc-settings-tools-grid .mcc-tool-button>.mcc-setting-icon img{
  width:44px;
  height:44px;
  object-fit:contain;
}
.mcc-settings-tools-grid .mcc-tool-button>b,
.mcc-indicator-tool-body>b{
  font-size:12px;
  line-height:1.2;
  font-weight:800;
  min-width:0;
}
.mcc-indicator-tool{
  cursor:default !important;
  justify-content:flex-start !important;
}
.mcc-indicator-tool-body{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:7px;
}
.mcc-inline-number{
  width:86px;
  height:34px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  border:1px solid #eadde1;
  border-radius:10px;
  background:#fffafc;
  overflow:hidden;
  box-sizing:border-box;
}
.mcc-inline-number input[type="number"]{
  width:100%;
  min-width:0;
  height:32px;
  border:0 !important;
  outline:0 !important;
  background:transparent !important;
  padding:0 2px 0 9px !important;
  text-align:center;
  font-family:inherit;
  font-size:12.5px;
  font-weight:800;
  color:#6f4350;
  box-shadow:none !important;
}
.mcc-inline-number em{
  padding-right:8px;
  font-size:10px;
  font-style:normal;
  font-weight:700;
  color:#9b7a84;
}
.mcc-font-picker-layer{
  position:absolute;
  inset:0;
  z-index:20;
  padding:92px 18px 18px;
  box-sizing:border-box;
  border-radius:26px;
  background:rgba(255,250,252,.78);
  backdrop-filter:blur(2px);
}
.mcc-font-picker-layer[hidden]{display:none !important;}
.mcc-font-picker-card{
  width:min(430px,100%);
  margin:0 auto;
  padding:18px;
  border:1px solid #ead9df;
  border-radius:19px;
  background:#fff;
  box-shadow:0 16px 42px rgba(72,46,57,.14);
  box-sizing:border-box;
}
.mcc-font-picker-card header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin:0 0 14px;
}
.mcc-font-picker-card h3{margin:0;font-size:18px;line-height:1.2;}
.mcc-font-picker-card p{margin:4px 0 0;font-size:11px;opacity:.62;}
.mcc-font-picker-close{
  width:40px;
  height:40px;
  flex:0 0 40px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid #ead7de;
  border-radius:12px;
  background:#fff7f9;
  color:#8a5060;
  font-size:25px;
  line-height:1;
  font-family:Arial,sans-serif;
  cursor:pointer;
  box-sizing:border-box;
}
.mcc-font-picker-close:hover{background:#fff7f9;border-color:#d9bcc6;transform:none;}
.mcc-font-picker-options{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
}
.mcc-font-picker-options button{
  min-height:44px;
  border:1px solid #eadde1;
  border-radius:11px;
  background:#fffafc;
  color:#49363e;
  font-size:14px;
  cursor:pointer;
}
.mcc-font-picker-options button.selected{
  border-color:#c96f84;
  background:#fcedf1;
  box-shadow:inset 0 0 0 1px rgba(201,111,132,.18);
}
@media(max-width:700px){
  .mcc-settings-tools-grid{grid-template-columns:1fr 1fr;}
  .mcc-settings-tools-grid .mcc-indicator-tool{grid-column:1/-1;}
}
@media(max-width:430px){
  .mcc-settings-tools-grid{grid-template-columns:1fr;}
  .mcc-settings-tools-grid .mcc-indicator-tool{grid-column:auto;}
  .mcc-settings-tools-grid .mcc-tool-button{min-height:70px;justify-content:flex-start;}
  .mcc-font-picker-options{grid-template-columns:1fr;}
  .mcc-font-picker-layer{padding:75px 10px 10px;}
}


/* Versão 2.0.121: paleta compacta em duas colunas e botão fechar da fonte refinado */
#mcc-app .themePicker{
  width:min(520px,100%);
  padding:20px;
}
#mcc-app .themePicker>header{margin-bottom:14px;}
#mcc-app .themePicker h2{font-size:24px;}
#mcc-app .themeOptions{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
#mcc-app .themeOptions>button{
  min-height:72px;
  grid-template-columns:72px minmax(0,1fr) 28px;
  gap:10px;
  padding:10px 11px;
  border-radius:15px;
}
#mcc-app .themeSwatches i{width:28px;height:28px;}
#mcc-app .themeOptions b{font-size:13px;}
#mcc-app .themeOptions small{font-size:9.5px;line-height:1.2;}
#mcc-app .themeDone{margin-top:13px;min-height:42px;}
@media(max-width:560px){
  #mcc-app .themeOptions{grid-template-columns:1fr;}
  #mcc-app .themePicker{width:min(460px,100%);}
}


/* Versão 2.0.122: paleta mais larga e seleção sem sobrepor textos */
#mcc-app .themePicker{
  width:min(650px,100%);
  padding:20px 22px 18px;
}
#mcc-app .themeOptions{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:11px 12px;
}
#mcc-app .themeOptions>button{
  min-width:0;
  min-height:72px;
  grid-template-columns:66px minmax(0,1fr) 24px;
  gap:9px;
  padding:10px 11px;
  overflow:hidden;
}
#mcc-app .themeOptions>button>span:nth-child(2){
  min-width:0;
  padding-right:2px;
}
#mcc-app .themeOptions b{
  display:block;
  min-width:0;
  font-size:12.5px;
  line-height:1.2;
  white-space:normal;
  overflow-wrap:anywhere;
}
#mcc-app .themeOptions small{
  display:block;
  min-width:0;
  font-size:9px;
  line-height:1.2;
  white-space:normal;
  overflow-wrap:anywhere;
}
#mcc-app .themeOptions strong{
  width:22px;
  height:22px;
  min-width:22px;
  justify-self:end;
  align-self:center;
  font-size:12px;
}
#mcc-app .themeSwatches{
  min-width:0;
}
#mcc-app .themeSwatches i{
  width:27px;
  height:27px;
}
@media(max-width:640px){
  #mcc-app .themePicker{
    width:min(600px,100%);
    padding:18px 14px 14px;
  }
  #mcc-app .themeOptions>button{
    grid-template-columns:62px minmax(0,1fr) 22px;
    gap:8px;
    padding:9px 10px;
  }
}
@media(max-width:560px){
  #mcc-app .themeOptions{grid-template-columns:1fr;}
  #mcc-app .themePicker{width:min(460px,100%);}
}