/* Interactive Black, scoped to the reseller page. Existing tools retain their contracts. */
:root{--bg:#04070b;--panel:#0b111b;--panel2:#15212e;--line:#7d9bb32c;--text:#edf4fb;--muted:#99aec3;--red:#e03853;--green:#86d6ad;--amber:#ecc477;color-scheme:dark}
html{scrollbar-gutter:stable}body{background:#04070b;font-family:'Segoe UI',Arial,sans-serif;font-size:16px;line-height:1.45;isolation:isolate}
.top{background:#09111bed;border-color:var(--line)}body:has(#app:not(.hidden))>.top{display:none}
main.portal{width:calc(100% - 48px);max-width:1960px;margin:24px auto 50px}.appShell{grid-template-columns:238px minmax(0,1fr);gap:30px}
.sideNav{top:24px;min-height:calc(100vh - 48px);display:flex;flex-direction:column;padding:26px 18px;border-radius:18px;background:linear-gradient(145deg,#142131eb,#080d15f5);border-color:var(--line);box-shadow:0 14px 45px #0006,inset 0 1px #d7eaff0d}
.portalBrand{font-size:25px;font-weight:850;letter-spacing:-.6px;margin:0 6px 23px;white-space:nowrap}.portalBrand span{color:#ec4260}
.sideProfile{padding:18px 7px;border-top:1px solid var(--line);border-bottom:0}.sideProfile small{font-size:12px;font-weight:500}.sideProfile strong{font-size:15px;font-weight:600;margin-top:9px}.sideBalance{padding:13px;border-color:#ad8b492f;background:#423b251f}.sideBalance span{font-size:12px;letter-spacing:.5px}.sideBalance b{font-size:22px}
.sideMenu{gap:6px;margin:7px 0 22px}.navItem{font-size:14px;font-weight:550;letter-spacing:0;min-height:49px;padding:11px;text-transform:none;color:#a8bdcf}.navItem:hover{background:#97b6d310}.navItem.active{background:linear-gradient(120deg,#76223aa6,#230e1b6b);border-color:#c2536b50;box-shadow:inset 2px 0 #ec647e}.navIcon{background:transparent;font-size:18px;color:#99b3ca}.navItem.active .navIcon{background:transparent;box-shadow:none;color:#f291a5}.navCount{font-size:12px;background:#9ab3ce14;color:#a5bdd3}.sideLogout{margin-top:auto!important;font-size:14px}
.contentHead{align-items:flex-start;border:0;padding:14px 0 27px;min-height:130px}.contentHead .eyebrow{color:#90a8be;font-size:12px;font-weight:500;letter-spacing:1px}.contentHead h1{font-size:40px;line-height:1.2;letter-spacing:-1px;margin:10px 0 8px}.contentHead p{max-width:none;font-size:16px;color:#a4b5c9;line-height:1.5;margin:0}.motion-toggle{flex-shrink:0;min-height:36px!important;padding:7px 10px!important;color:#abc5d9!important;font-size:12px!important}.motion-toggle[hidden]{display:none!important}
.panel,.featureCard,.statusCard,.appCard,.resultCard,.quickGuide,.login,.diffShowcase,.diffStrip,.materialsArea .materialCard{background:linear-gradient(125deg,#13202ded,#090f18f5 70%);border-color:var(--line);box-shadow:0 12px 40px #0003,inset 0 1px #b7d9ff0b}
.panel{border-radius:17px;padding:24px}.panelHead{margin-bottom:18px;gap:18px}.panel h2,.panelHead h2{font-size:23px;font-weight:650;letter-spacing:-.5px}.panelHead p{font-size:14px;margin-top:5px;line-height:1.5}.featureCard>p,.statusCard p{font-size:14px}.statusLabel{font-size:12px;font-weight:550}
.stats{gap:0;border:1px solid var(--line);border-radius:16px;background:linear-gradient(125deg,#152335e0,#090f19f5);padding:21px 12px;box-shadow:inset 0 1px #d2e9ff0c}.stat{padding:0 25px;background:none;border:0;border-radius:0;border-right:1px solid var(--line)}.stat:last-child{border:0}.stat span{font-size:14px;text-transform:none;letter-spacing:0}.stat strong{font-size:29px;font-weight:650;margin-top:8px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:11px 16px;font-weight:600;font-size:14px;line-height:1.35;border:1px solid #f0859945;background:linear-gradient(145deg,#e84860,#ac263e);box-shadow:inset 0 1px #ffffff18,0 3px 8px #0004;transition:filter .15s,transform .15s;white-space:normal}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(1px)}.btn.ghost{color:#cbdeee;background:linear-gradient(145deg,#253548b0,#111b28);border-color:#7c9bb538}.btn.danger{background:linear-gradient(145deg,#33141e,#140c14);border-color:#b04e683f;color:#ed96a9}.btn.warning{border-color:#9b87583d;background:#302b201c;color:#d4c092}.btn.small{font-size:13px;padding:8px 11px;min-height:36px}.btn:disabled{cursor:not-allowed;transform:none}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #abd8f1;outline-offset:3px}input:focus,select:focus{outline:2px solid #87b5d2;outline-offset:2px;border-color:#87b5d2}
input,select,textarea{background:#060c14;border:1px solid #708aa239;border-radius:10px;color:#e6eff9;font-size:15px;padding:12px 14px;min-width:0}input::placeholder{color:#7f97af;opacity:1}.create{gap:14px}.create input,.create select{min-height:48px}.field label{font-size:13px;font-weight:500;letter-spacing:.3px;text-transform:none}
.tableWrap,th,td{border-color:var(--line)}th{background:#090f19;color:#9bb0c5;font-size:12px;font-weight:550}td{font-size:14px}.sub{font-size:12px}.accessBox{background:#0a131e;border-color:#69839d30}.accessField{background:#040a11}.pill{font-size:12px;font-weight:650}.quickTrial span,.statusChecked{font-size:13px}.trialNote{background:radial-gradient(circle at 90% 10%,#89224422,transparent 45%),#0c1420}
.appsPremium{--apps-card:#0c1521;--apps-line:#718da631;--apps-muted:#9cb1c5}.appsPremium .appsDevice{box-shadow:0 10px 30px #0004}.appsPremium .appsCodeRow .btn{font-size:13px}.appsPremium .appsDeviceBody>p,.appsPremium .appsTutorial summary{font-size:14px}.appsPremium .appsDns{background:#0e1c2a;border-color:#628bab42}.appsPremium .appsPin{background:#201623;border-color:#a0617540}
.materialsArea .materialsPreview{background:#0a1420;border-color:var(--line)}.tqTreeWorkspace{background:#070c13}.tqTreePanel{background:#0b141f}
/* The geometric background never receives pointer events or contains account data. */
.tqAtmosphere{position:fixed;inset:0;overflow:hidden;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 65% 2%,#1c324943,transparent 65%),#04070b}
.ambient-light{position:absolute;width:65vw;height:75vh;filter:blur(65px);transform:translate(var(--drift-x,0),var(--drift-y,0));will-change:transform}.ambient-light.cool{top:-28%;left:27%;background:radial-gradient(ellipse,#26486655,transparent 66%)}.ambient-light.warm{right:-35%;bottom:-22%;background:radial-gradient(ellipse,#6c223029,transparent 65%)}
#tech-field{position:absolute;inset:0;width:100%;height:100%;opacity:.8}.ambient-vignette{position:absolute;inset:0;background:radial-gradient(ellipse at 65% 30%,transparent 20%,#01040977 95%)}
.tqSurface{position:relative;isolation:isolate}.panel,.stat{position:relative}.tqSurface:after,.sideNav:after,.panel:after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(360px circle at var(--light-x,-700px) var(--light-y,-700px),#99dfff0b,transparent 65%)}
/* Client gallery and seven-day renewals. */
.appShell>*{min-width:0}
@media(max-width:1250px){.create{grid-template-columns:minmax(0,1fr)}}
@media(max-width:980px){.appShell{grid-template-columns:minmax(0,1fr)}}
.tqClients{container-type:inline-size;margin-top:28px}.tqClients .panelHead{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}.tqClients h2{margin:0;font-size:25px;letter-spacing:-.7px}.tqSearchForm{display:flex;gap:9px;width:min(100%,430px)}.tqSearchForm .search{max-width:none;flex:1;width:0}.tqSearchForm .btn{padding:10px 18px}
.tqGalleryMeta{display:flex;justify-content:space-between;gap:14px;font-size:12px;color:#8da6be;margin:0 0 14px}.tqClientGallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:start}
.tqClientCard{display:grid;gap:17px;min-width:0;padding:22px;border:1px solid #7694ae2d;border-radius:16px;background:linear-gradient(130deg,#101a25f5,#070c13f5 78%);box-shadow:inset 0 1px #cce5ff0a,0 12px 28px #0004}
.tqClientIdentity{display:flex;align-items:center;gap:12px;min-width:0}.tqClientIdentity>div{min-width:0}.tqClientIdentity strong{display:block;font-size:15px;line-height:1.4;font-weight:600;overflow-wrap:anywhere}.tqClientIdentity>div>span{display:flex;align-items:center;gap:5px;font-size:12px;color:#91a9bf;margin-top:5px}.tqClientAvatar{width:44px;height:44px;flex:0 0 44px;border-radius:14px;display:grid;place-items:center;font-size:19px;font-weight:650;color:#f7dae5;background:linear-gradient(140deg,#ad3457,#551b35);border:1px solid #ed9bb630;box-shadow:inset 0 1px #f8b9cf20,0 4px 10px #0005}
.tqClientCard svg,.tqUpcoming svg,.tqClientDialog svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.tqClientIdentity svg{width:14px;height:14px}
.tqClientBadges{display:flex;flex-wrap:wrap;gap:7px}.tqBadge{display:inline-flex;align-items:center;gap:6px;border:1px solid #40987835;border-radius:7px;background:#1d49352e;color:#85d5ae;font-size:12px;padding:5px 8px;line-height:1.4;white-space:nowrap}.tqBadge:before{content:'';width:6px;height:6px;background:currentColor;border-radius:50%}.tqBadge.blue{color:#98caf0;border-color:#568bb43d;background:#213f6126}.tqBadge.warn{color:#e69bad;border-color:#a5536a3d;background:#76273f1c}
.tqClientPlan{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:15px 0}.tqClientPlan strong{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:550;color:#d0deec}.tqClientPlan span{display:block;font-size:14px;color:#98aec5;margin-top:6px;overflow-wrap:anywhere}.tqDetailsButton{justify-content:space-between;min-height:41px;font-size:14px}
.tqUpcoming .panelHead{border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:0}.tqCount{font-size:13px;color:#b4d2e8;border:1px solid #769fbc30;padding:6px 10px;border-radius:7px;background:#23425e2b;white-space:nowrap}.tqDueList{list-style:none;padding:0;margin:0}.tqDueRow{display:grid;grid-template-columns:minmax(160px,1.5fr) minmax(150px,1fr) 114px 110px;gap:18px;align-items:center;padding:17px 0;border-bottom:1px solid #97adc615}.tqDueRow strong{display:block;font-size:14px;overflow-wrap:anywhere;font-weight:600}.tqDueRow small{display:block;font-size:12px;color:var(--muted);margin-top:3px}.tqDueRow time{font-size:14px}.tqDueRow .btn{font-size:13px;min-height:39px;padding:9px}.tqDueStatus{font-size:14px;color:#b7d9ef;background:#355a7b23;border:1px solid #7497b32c;border-radius:7px;padding:6px 8px;text-align:center}.tqSmall{font-size:12px;color:#8199af;margin:12px 0 0}.tqDueEmpty{padding:26px 0;color:var(--muted);font-size:14px}
/* Native modal dialogs, kept separate from Apps/material/tree dialogs. */
html:has(.tqClientDialog[open],.tqActionDialog[open]){overflow:hidden}
.tqClientDialog,.tqActionDialog{inset:0;margin:auto;padding:0;max-height:calc(100dvh - 40px);color:var(--text);border:1px solid #81abc650;border-radius:20px;background:radial-gradient(ellipse at 10% 0,#223d5166,transparent 60%),linear-gradient(130deg,#0d1620,#070b11 75%);box-shadow:0 30px 100px #000d,inset 0 1px #badfff16;overflow:hidden}.tqClientDialog{width:min(980px,calc(100vw - 40px))}.tqClientDialog[open]{display:flex;flex-direction:column}.tqActionDialog{width:min(510px,calc(100vw - 32px));overflow:auto}.tqClientDialog::backdrop,.tqActionDialog::backdrop{background:#02060cbb;backdrop-filter:blur(9px)}
.tqDialogHeader{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 28px;border-bottom:1px solid var(--line);flex-shrink:0;background:#0b121a99}.tqDialogHeader .tqSmall{letter-spacing:1.5px}.tqDialogHeader h2{font-size:24px;font-weight:650;letter-spacing:-.5px;margin:5px 0 0}.tqDialogClose{height:40px;width:40px;display:grid;place-items:center;flex-shrink:0;padding:0;font-size:27px;color:#cee1ef;background:#1b2a394f;border:1px solid #8ba6be38;border-radius:10px;cursor:pointer}
.tqClientBody{padding:24px 28px;overflow:auto;overscroll-behavior:contain;min-height:0}.tqClientProfile{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:23px;border-bottom:1px solid var(--line)}.tqClientProfile .tqClientIdentity strong{font-size:18px}.tqClientProfile .tqClientAvatar{height:50px;width:50px;flex-basis:50px;font-size:23px}.tqClientProfile .tqClientBadges{flex-shrink:0}
.tqClientDetails{display:grid;grid-template-columns:minmax(220px,.7fr) minmax(0,1.2fr);gap:26px;padding:25px 0}.tqClientDetails h3{font-size:12px;letter-spacing:1.4px;font-weight:500;color:#8da7bf;margin:0 0 19px}.tqPlanDetails{border-right:1px solid var(--line);padding-right:24px}.tqPlanDetails>strong{display:flex;align-items:center;gap:11px;font-size:21px;line-height:1.3}.tqPlanDetails>strong svg{width:25px;height:25px;color:#91aec5}.tqPlanDetails p{margin:7px 0 22px;color:#9db2c7;font-size:14px}.tqPlanDetails>span,.tqPlanDetails time,.tqPlanDetails small{display:block;font-size:14px;color:#a7bdd0}.tqPlanDetails time{color:#d6e1ec;margin-top:5px}.tqPlanDetails small{font-size:12px;color:#7e99b2;margin-top:20px}
.tqCredentialFields{display:grid;grid-template-columns:1fr 1fr;gap:14px}.tqCredentialFields label,.tqActionBody label{min-width:0;font-size:14px;letter-spacing:0;text-transform:none;font-weight:550;color:#b3c7d8}.tqCredentialFields input{height:45px;font-size:15px;margin-top:7px}.tqPasswordField{display:flex;align-items:center;margin-top:7px;border:1px solid #708aa239;border-radius:10px;background:#060c14}.tqPasswordField input{background:none;margin:0;border:0;flex:1;width:0}.tqReveal{border:0;background:none;color:#c8dce9;display:grid;place-items:center;padding:9px;cursor:pointer}.tqCopyActions{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:10px;margin-top:15px}.tqCopyActions .btn{padding:10px 8px;font-size:14px;min-width:0}.tqPending{font-size:14px;color:#d69dae;margin-top:15px}
.tqClientActions{display:flex;align-items:center;flex-wrap:wrap;gap:10px;border-top:1px solid var(--line);padding-top:23px}.tqClientActions>span{flex:1}.tqClientFeedback:empty{display:none}.tqClientFeedback{font-size:14px;color:#c0e4f5;margin-top:18px;padding:12px;border:1px solid var(--line);border-radius:9px;background:#25425c25}.tqClientFeedback.error{color:#f0a0b2}.tqActionBody{padding:24px}.tqActionBody p{font-size:15px;color:#aec3d7;line-height:1.6;margin:0 0 18px;overflow-wrap:anywhere}.tqActionBody input,.tqActionBody select{margin-top:8px}.tqFormActions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;margin-top:23px}.tqPortalNotice{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:99999;max-width:calc(100vw - 32px);padding:14px 20px;border:1px solid #82aece50;border-radius:12px;background:#0d1929;color:#c7e3f5;box-shadow:0 15px 45px #000b;font-size:14px}.tqPortalNotice.error{color:#f0a0b2}
@container(max-width:980px){.tqClientGallery{grid-template-columns:repeat(2,minmax(0,1fr))}.tqSearchForm{width:100%}}
@container(max-width:620px){.tqClientGallery{grid-template-columns:1fr}.tqClientCard{padding:20px}.tqGalleryMeta{gap:12px}}
@media(max-width:1250px){.appShell{grid-template-columns:210px minmax(0,1fr);gap:22px}.sideNav{padding:23px 13px}.portalBrand{font-size:22px}.stat{padding:0 14px}.stat strong{font-size:25px}.tqDueRow{grid-template-columns:minmax(0,1fr) auto;gap:12px}.tqDueRow time{grid-row:2;grid-column:1}.tqDueStatus{grid-column:2;grid-row:1}.tqDueRow .btn{grid-column:2;grid-row:2}}
@media(max-width:980px){main.portal{width:calc(100% - 36px);max-width:none}.appShell{grid-template-columns:1fr}.sideNav{position:relative;top:0;min-height:0;padding:20px;z-index:auto;border-radius:17px}.portalBrand{margin:0 0 14px;font-size:25px}.sideProfile{display:none}.sideMenu{display:flex;overflow:auto;margin:0;gap:7px;scrollbar-width:thin}.navItem{flex-shrink:0;width:auto;font-size:14px}.navIcon{display:block;background:none;width:20px;flex-basis:20px}.sideLogout{display:flex;align-self:flex-start;width:auto;margin-top:15px!important}.contentHead{min-height:120px;padding-top:0}.contentHead p{max-width:580px}}
@media(max-width:760px){.contentHead{flex-direction:row;gap:14px}.contentHead h1{font-size:34px}.contentHead p{font-size:14px;margin:0}.motion-toggle{max-width:140px}.panel{padding:20px}.stats{padding:10px}.stat{padding:15px;border:0}.stat:nth-child(odd){border-right:1px solid var(--line)}.stat:nth-child(-n+2){border-bottom:1px solid var(--line)}.panelHead{align-items:flex-start}.tqUpcoming .panelHead{flex-direction:row}.tqClientDialog{width:calc(100vw - 28px);max-height:calc(100dvh - 28px);border-radius:16px}.tqDialogHeader{padding:18px 20px}.tqDialogHeader h2{font-size:22px}.tqClientBody{padding:20px}.tqClientProfile{flex-direction:column;align-items:flex-start;gap:17px}.tqClientProfile .tqClientIdentity strong{font-size:16px}.tqClientDetails{grid-template-columns:1fr;gap:24px}.tqPlanDetails{padding:0;border:0}.tqClientActions{display:grid;grid-template-columns:1fr 1fr}.tqClientActions>span{display:none}}
@media(max-width:480px){main.portal{width:calc(100% - 26px);margin-top:13px}.sideNav{padding:18px 14px}.contentHead .eyebrow{font-size:12px}.contentHead h1{font-size:31px}.contentHead .motion-toggle{max-width:108px;padding:7px!important}.stat span{font-size:13px}.stat strong{font-size:23px}.panel h2,.tqClients h2{font-size:22px}.tqDueRow{gap:10px}.tqDueStatus{font-size:13px}.tqCredentialFields{grid-template-columns:1fr}.tqCopyActions{grid-template-columns:1fr 1fr}.tqCopyActions .btn:first-child{grid-column:1/-1}.tqClientActions .btn{padding:11px 8px}.tqGalleryMeta>span:last-child{max-width:140px;text-align:right}.tqSearchForm{gap:8px}.tqSearchForm .btn{padding:10px 12px}}
@media(prefers-reduced-motion:reduce){.ambient-light{transform:none!important;will-change:auto}.btn,.viewPage.active{animation:none;transition:none}.btn:hover,.btn:active{transform:none}}
