/* "Post a problem" / Reach-an-Expert form (js/reach-expert.js), shared by
   my-cases.html and troubleshooting.html (2026-10-05). Same look as the
   original modal in troubleshooting.css; every rule is scoped to
   #dx-expert-overlay so it never changes a host page's own .form-* /
   .cm-overlay styles. troubleshooting.html keeps its identical copies in
   troubleshooting.css, so loading this file there too is harmless. */
#dx-expert-overlay{display:none;position:fixed;inset:0;z-index:2100;background:rgba(0,0,0,0.72);align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(4px);}
#dx-expert-overlay.open{display:flex;}
#dx-expert-overlay .dx-expert-modal{position:relative;background:var(--navy);border:1px solid var(--border);border-radius:16px;width:min(520px,calc(100% - 32px));max-height:calc(100vh - 60px);display:flex;flex-direction:column;animation:rxpop .2s ease;overflow:hidden;}
@keyframes rxpop{from{opacity:0;transform:scale(.96);}to{opacity:1;transform:scale(1);}}
#dx-expert-overlay #dx-expert-step-form,#dx-expert-overlay #dx-expert-step-confirm,#dx-expert-overlay #dx-expert-step-success,#dx-expert-overlay #dx-expert-step-signin{flex-direction:column;min-height:0;flex:1 1 auto;}
#dx-expert-overlay .dx-expert-head{display:flex;align-items:flex-start;gap:12px;padding:20px 22px;border-bottom:1px solid var(--border);flex-shrink:0;}
#dx-expert-overlay .dx-expert-icon{width:40px;height:40px;border-radius:10px;flex-shrink:0;background:var(--cyan-dim);display:flex;align-items:center;justify-content:center;color:var(--cyan);font-size:16px;}
#dx-expert-overlay .dx-expert-title{font-family:var(--font-display);font-size:17px;font-weight:700;color:var(--white);}
#dx-expert-overlay .dx-expert-sub{font-size:12px;color:var(--steel);margin-top:2px;line-height:1.4;}
#dx-expert-overlay .dx-expert-body{padding:18px 22px;overflow-y:auto;flex:1 1 auto;min-height:0;scrollbar-width:thin;scrollbar-color:rgba(0,212,255,0.18) transparent;}
#dx-expert-overlay .dx-expert-foot{display:flex;gap:9px;justify-content:flex-end;padding:14px 22px;border-top:1px solid var(--border);flex-shrink:0;background:var(--navy-deep);}
#dx-expert-overlay .dx-tiers{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;}
@media(max-width:420px){ #dx-expert-overlay .dx-tiers{grid-template-columns:1fr;} #dx-expert-overlay .form-row{grid-template-columns:1fr;} }
#dx-expert-overlay .dx-tier{display:flex;align-items:flex-start;gap:10px;background:var(--navy-deep);border:1.5px solid var(--border);border-radius:10px;padding:11px 13px;cursor:pointer;transition:all .15s;}
#dx-expert-overlay .dx-tier:hover{border-color:rgba(0,212,255,0.4);}
#dx-expert-overlay .dx-tier input{margin-top:3px;accent-color:var(--cyan);width:15px;height:15px;flex-shrink:0;}
#dx-expert-overlay .dx-tier:has(input:checked){border-color:var(--cyan);background:var(--cyan-dim);}
#dx-expert-overlay .dx-tier-body{flex:1;min-width:0;}
#dx-expert-overlay .dx-tier-top{display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap;}
#dx-expert-overlay .dx-tier-name{font-size:13px;font-weight:600;color:var(--white);}
#dx-expert-overlay .dx-tier-cost{font-family:var(--font-display);font-size:15px;font-weight:800;color:var(--cyan);}
#dx-expert-overlay .dx-tier-cost.free{color:var(--green);}
#dx-expert-overlay .dx-tier-time{display:block;font-size:11.5px;color:var(--steel);margin-top:3px;}
#dx-expert-overlay .dx-tier-time i{color:#4A6080;margin-right:4px;}
#dx-expert-overlay .dx-tier-hint{font-size:12px;color:var(--amber);margin-top:9px;min-height:15px;}
#dx-expert-overlay .dx-sum{background:var(--navy-mid);border:1px solid var(--border);border-radius:11px;overflow:hidden;}
#dx-expert-overlay .dx-sum-head{background:var(--navy-deep);padding:12px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:9px;}
#dx-expert-overlay .dx-sum-logo{font-family:var(--font-display);font-weight:700;font-size:13px;color:var(--white);}
#dx-expert-overlay .dx-sum-badge{margin-left:auto;font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;padding:3px 8px;border-radius:9px;}
#dx-expert-overlay .dx-sum-badge.urgent{background:rgba(248,113,113,0.12);color:#F87171;}
#dx-expert-overlay .dx-sum-badge.prod{background:var(--amber-dim);color:var(--amber);}
#dx-expert-overlay .dx-sum-badge.gen{background:rgba(140,160,184,0.1);color:var(--steel);}
#dx-expert-overlay .dx-sum-rows{padding:4px 16px 12px;}
#dx-expert-overlay .dx-sum-row{display:grid;grid-template-columns:120px 1fr;gap:10px;padding:8px 0;border-bottom:1px solid rgba(140,160,184,0.07);font-size:12.5px;}
#dx-expert-overlay .dx-sum-row:last-child{border-bottom:none;}
#dx-expert-overlay .dx-sum-label{color:var(--steel);font-weight:600;}
#dx-expert-overlay .dx-sum-val{color:var(--white);}
#dx-expert-overlay .dx-sum-val.muted{color:#4A6080;font-style:italic;}
#dx-expert-overlay .dx-sum-note{font-size:11.5px;color:var(--steel);padding:10px 16px;background:var(--navy-deep);border-top:1px solid var(--border);line-height:1.5;}
#dx-expert-overlay .form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:0;}
#dx-expert-overlay .form-group{display:flex;flex-direction:column;gap:4px;margin-bottom:12px;}
#dx-expert-overlay .form-label{font-size:11px;font-weight:600;color:var(--steel);letter-spacing:.3px;margin:0;}
#dx-expert-overlay .form-input{width:100%;box-sizing:border-box;background:#0D1E36;border:1px solid rgba(140,160,184,0.2);border-radius:8px;padding:9px 11px;color:var(--white);font-size:12.5px;font-family:var(--font-body);outline:none;transition:border-color .2s;}
#dx-expert-overlay .form-input::placeholder{color:#4A6080;}
#dx-expert-overlay .form-input:focus{border-color:rgba(0,212,255,0.4);}
#dx-expert-overlay .form-input[readonly]{opacity:.7;cursor:not-allowed;}
#dx-expert-overlay .form-select{appearance:none;cursor:pointer;}
#dx-expert-overlay textarea.form-input{resize:vertical;}
#dx-expert-overlay .icon-btn{background:none;border:none;color:#4A6080;cursor:pointer;font-size:14px;padding:4px 5px;border-radius:6px;}
#dx-expert-overlay .icon-btn:hover{color:var(--white);background:rgba(255,255,255,0.06);}
#dx-expert-overlay a.rx-link{color:var(--cyan);text-decoration:none;font-weight:600;}
#dx-expert-overlay a.rx-link:hover{text-decoration:underline;}
/* Guest posting a problem (2026-10-08, js/reach-expert.js). */
.dx-guest-note{margin:0 0 14px;padding:10px 12px;border-radius:8px;font-size:12.5px;line-height:1.55;color:var(--steel);background:rgba(0,212,255,0.07);border:1px solid rgba(0,212,255,0.22);}
.dx-guest-note b{color:var(--white);} .dx-guest-note i{color:var(--cyan);margin-right:4px;}