/* The PARTNER program's office screens (runtime/go/office-partner.js; comps c05 to c12, approved 30 Oct 2026), inside
   lane office's shell: its panels (.qo-panel), keys (.qo-key), fields, type and resets. These rules add only the
   partner screens' own parts; each starts at the office root (.qo) so it outranks the office's element rules. */

.qo .qpn input[type="radio"]{position:absolute;width:1px;height:1px;margin:0;padding:0;border:0;opacity:0}
.qo .qpn-panel{margin-top:12px}
.qo .qpn-panel>h2{margin-bottom:14px}
.qo .qpn-line{color:var(--o-ink);font-size:17px;line-height:1.45}
.qo .qpn-green{color:var(--o-green);font:700 20px/1.3 var(--o-display);letter-spacing:.02em}
.qo .qpn-small{margin-top:10px;color:var(--o-ink);font-size:15px;text-align:center}
.qo .qpn-hint{margin-top:6px;color:var(--o-dim);font-size:14px;line-height:1.4}
.qo .qpn-hint--bad,.qo .qpn-say{color:var(--o-red)}
.qo .qpn-say{margin-top:12px;font-size:16px;line-height:1.4}

/* 1 SIGN IN, 2 YOUR CODE, 3 YOUR LINKS: three framed chips, the current one orange, the done ones green with a tick */
.qo .qpn-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 4px}
.qo .qpn-step{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:8px 10px;border:3px solid var(--o-line);background:#000d07;
 color:var(--o-dim);font:700 15px/1.15 var(--o-display);letter-spacing:.03em;text-align:center}
.qo .qpn-step[data-state="now"]{border-color:var(--o-orange);color:var(--o-orange)}
.qo .qpn-step[data-state="done"]{border-color:var(--o-green);color:var(--o-green)}
.qo .qpn-step[data-state="done"] .qpn-step__n::after{content:"";display:inline-block;width:6px;height:11px;margin-left:8px;border:solid currentColor;border-width:0 3px 3px 0;transform:translateY(-2px) rotate(45deg)}

/* who invited: a slim strip with an orange edge */
.qo .qpn-invited{margin-bottom:14px;padding:9px 14px;border:3px solid var(--o-orange);color:var(--o-orange);font:700 17px/1.25 var(--o-display);letter-spacing:.04em;text-transform:uppercase;overflow-wrap:anywhere}
.qo .qpn-invited b{font-weight:700}
.qo .qpn-title{margin-bottom:18px;font-size:clamp(26px,3vw,44px)}

/* the sign-up's fields */
.qo .qpn-form{display:grid;gap:4px}
.qo .qpn-field{margin-top:12px}
.qo .qpn-code{display:flex;align-items:stretch;border:solid transparent;border-width:6px;border-image:url(/runtime/quit/deck-art/key-dark.webp) 40 46 50 fill/6px stretch;background:#000d07;background-clip:padding-box}
.qo .qpn-code__prefix{display:flex;align-items:center;padding-left:12px;color:var(--o-dim);font-size:15px;white-space:nowrap}
.qo .qpn-code input:not([type="checkbox"]){flex:1 1 auto;min-width:0;padding-left:0;border:0;border-image:none;background:none}
.qo .qpn-tag{display:inline-flex;align-items:center;align-self:center;margin:0 10px;padding:3px 8px;border:2px solid var(--o-green);color:var(--o-green);font:700 13px/1.1 var(--o-display);letter-spacing:.05em;white-space:nowrap}
.qo .qpn-tag--taken{border-color:var(--o-red);color:var(--o-red)}
.qo .qpn-langs{display:flex;flex-wrap:wrap;gap:10px}
.qo .qpn-langs legend{width:100%}
.qo .qpn-seg{display:inline-flex;margin:0;cursor:pointer}
.qo .qpn-seg .qo-key{min-height:48px;font-size:15px}
.qo .qpn-rules{display:flex;align-items:flex-start;gap:12px;margin:16px 0 0;color:var(--o-ink);font-size:16px;line-height:1.4;cursor:pointer}
.qo .qpn-rules input{flex:none;width:24px;height:24px;margin:1px 0 0;accent-color:var(--o-green)}
.qo .qpn-big{width:100%;margin-top:14px;font-size:20px}

/* the signed-out frame: the office's sign-in panel inside the partner title; it leaves once the office is signed in
   (office-setup.css hides the QUIT FACTORY's .qf-out the same way) */
.qo[data-session] [data-partner-out]{display:none}
.qo .qpn-out{max-width:760px;margin:0 auto}
.qo .qpn-login{margin-top:6px}

/* OVERVIEW: the welcome, then OPEN MY LINKS */
.qo .qpn-welcome h2{margin:14px 0 10px;font-size:clamp(34px,4.6vw,64px)}
.qo .qpn-welcome .qpn-line{margin-top:8px}
.qo .qpn-open{margin-top:12px}

/* MY LINKS: the lead line, then three cards side by side on a wide desk, stacked below 1150 px */
.qo .qpn-lead{margin:0 0 12px;color:var(--o-ink);font-size:17px;line-height:1.45}
.qo .qpn-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.qo .qpn-link{display:flex;flex-direction:column;gap:12px}
.qo .qpn-link h3{color:var(--o-orange);font-size:clamp(20px,1.8vw,26px)}
.qo .qpn-link input:not([type="checkbox"]){font-size:14px;padding:10px 12px}
.qo .qpn-keys{display:flex;flex-wrap:wrap;gap:8px}
.qo .qpn-keys .qo-key{flex:1 1 0;min-width:84px;min-height:48px;padding-inline:10px;font-size:15px}
.qo .qpn-stats{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:auto;color:var(--o-dim);font:700 14px/1.3 var(--o-display);letter-spacing:.04em}
.qo .qpn-stats b{color:var(--o-green);font-weight:700}
.qo .qpn-week{color:var(--o-dim)}
.qo .qpn-send{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:12px;align-items:start}
.qo .qpn-scan{text-align:center}
.qo .qpn-qr{display:block;width:min(200px,100%);height:auto;margin:0 auto 10px;image-rendering:pixelated;background:#fff}

/* READY TO SEND and READY MESSAGES: ENGLISH and РУССКИЙ switch the messages with no script */
.qo .qpn-bilingual{display:flex;flex-wrap:wrap;gap:10px}
.qo .qpn-msgs{flex:1 1 100%;display:grid;gap:12px}
.qo .qpn-msg-lang--ru:checked~.qpn-msgs--en,.qo .qpn-msg-lang--en:checked~.qpn-msgs--ru{display:none}
.qo .qpn-msg-lang:checked+.qpn-seg .qo-key{border-image:url(/runtime/quit/deck-art/key-green.webp) 22 24 34 fill/10px 12px 13px stretch;color:#002411}
.qo .qpn-msg-lang:checked+.qpn-seg .qo-key::before{content:none}
.qo .qpn-msg-lang:focus-visible+.qpn-seg .qo-key{outline:3px solid #fff0ad;outline-offset:3px}
.qo .qpn-msg{display:grid;gap:10px}
.qo .qpn-message{padding:14px 16px;border:2px solid var(--o-line);background:#000d07;color:var(--o-ink);font-size:16px;line-height:1.5;overflow-wrap:anywhere}
.qo .qpn-msg .qo-key{justify-self:start;min-height:48px;font-size:15px}

/* MATERIALS */
.qo .qpn-q{border-bottom:2px solid var(--o-line)}
.qo .qpn-q summary{min-height:44px;padding:10px 0;color:var(--o-green);cursor:pointer;font:700 17px/1.3 var(--o-display)}
.qo .qpn-q p{padding:0 0 14px;color:var(--o-ink);font-size:16px;line-height:1.45}

/* WHAT YOU EARN: a label and its rate line, the figure in big green at the right */
.qo .qpn-earn>div{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 0;border-bottom:2px solid var(--o-line)}
.qo .qpn-earn dt{display:grid;gap:4px;color:var(--o-ink);font-size:17px}
.qo .qpn-earn dt span{color:var(--o-dim);font-size:14px}
.qo .qpn-earn dd{margin:0;color:var(--o-green);font:700 clamp(18px,1.8vw,26px)/1.1 var(--o-display);text-align:right;white-space:nowrap}

/* TEAM's role tags (c09b, c10b) and INVITE's rows */
.qo .qpn-role{display:inline-block;padding:2px 7px;border:2px solid;font:700 12px/1.2 var(--o-display);letter-spacing:.05em}
.qo .qpn-role--partner{border-color:var(--o-orange);color:var(--o-orange)}
.qo .qpn-role--influencer{border-color:var(--o-green);color:var(--o-green)}
/* the shell's role tag on TEAM's plates, rows and member page (lane office: <span class="qo-node-role ROLE">) */
.qo .qo-node-role{display:inline-block;padding:2px 7px;border:2px solid var(--o-green);color:var(--o-green);font:700 12px/1.2 var(--o-display);letter-spacing:.05em}
.qo .qo-node-role.qpn-role--partner{border-color:var(--o-orange);color:var(--o-orange)}
.qo .qpn-invite+.qpn-invite{margin-top:12px}
.qo .qpn-label{margin-bottom:6px;color:var(--o-green);font:700 15px/1.2 var(--o-display)}

@media (max-width:1150px){
 .qo .qpn-cards{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
 .qo .qpn-code{flex-wrap:wrap}
 .qo .qpn-code__prefix{flex:1 1 100%;padding:8px 12px 0}
 .qo .qpn-code input:not([type="checkbox"]){padding-left:12px}
}
@media (max-width:440px){
 .qo .qpn-steps{gap:6px}
 .qo .qpn-step{gap:5px;padding:6px 4px;font-size:12px;letter-spacing:0}
 .qo .qpn-step[data-state="done"] .qpn-step__n::after{margin-left:5px}
}
@media (max-width:760px){
 .qo .qpn-send{grid-template-columns:minmax(0,1fr)}
 .qo .qpn-scan{display:none}
 .qo .qpn-step{min-height:42px;padding:6px;font-size:13px}
 .qo .qpn-code__prefix{font-size:13px;padding-left:10px}
 .qo .qpn-title{font-size:clamp(22px,7vw,30px)}
}
