/* t767u PREVIEW (capone): capacitor one-screen picker (Use › MFD › Shape + breadcrumb + WhatsApp photo help). Only rendered on capacitor
   lists (#cp inside the existing .nf filter); colours come from the existing --nf* tokens so ATC / YQ-neutral themes both apply. */
.nf .cp{margin:4px 0 6px;display:flex;flex-direction:column;gap:10px}
.nf .cpbc{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;padding:8px 10px;border:1px solid var(--nfbd);border-radius:12px;background:var(--nfbg);font-size:15px}
.nf .cpbs{min-height:36px;padding:4px 10px;border:1px solid var(--nfbd);border-radius:999px;background:var(--nfch);color:var(--nftx);font:inherit;font-weight:800;cursor:pointer}
.nf .cpbs.on{border-color:var(--nfp);color:var(--nfp);background:var(--nfbg)}
.nf .cpbs[aria-current]{background:var(--nfp);border-color:var(--nfp);color:#fff}
.nf .cpsep{color:var(--nfmu);font-weight:800}
.nf .cpnx{color:var(--nfmu);font-style:italic;font-weight:600}
.nf .cphn{margin:0;font-size:14px;color:var(--nfmu)}
.nf .cprw{border-radius:12px;transition:box-shadow .3s}
.nf .cprw.cpfl{box-shadow:0 0 0 3px var(--nfp)}
@media (prefers-reduced-motion:reduce){.nf .cprw{transition:none}}
.nf .cpl{margin:0 0 6px;font-size:15px;font-weight:800;color:var(--nftx)}.nf .cpl small{font-weight:600;color:var(--nfmu)}
.nf .cpug{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px}
.nf .cpu{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:84px;padding:8px 6px;border:2px solid var(--nfbd);border-radius:14px;background:var(--nfbg);color:var(--nftx);font:inherit;cursor:pointer;text-align:center}
.nf .cpu b{font-size:16px;line-height:1.15}
.nf .cpu em,.nf .cph em{font-style:normal;font-size:12px;font-weight:700;color:var(--nfmu);background:rgba(0,0,0,.07);border-radius:999px;padding:0 7px}
.nf .cpu .cpic{width:30px;height:30px;color:var(--nfp)}
.nf .cpu.on{border-color:var(--nfp);background:var(--nfp);color:#fff}.nf .cpu.on .cpic{color:#fff}.nf .cpu.on em,.nf .cph.on em{color:#fff;background:rgba(255,255,255,.22)}
.nf .cpm{position:relative;flex:0 0 auto;scroll-snap-align:center;display:inline-flex;align-items:baseline;gap:3px;min-width:72px;min-height:56px;justify-content:center;align-items:center;padding:6px 14px;border:2px solid var(--nfbd);border-radius:12px;background:var(--nfch);color:var(--nftx);font:inherit;cursor:pointer}
.nf .cpm b{font-size:18px}.nf .cpm small{font-size:11px;font-weight:700;color:var(--nfmu)}
.nf .cpm.on{background:var(--nfp);border-color:var(--nfp);color:#fff}.nf .cpm.on small{color:#fff}
.nf .cphg{display:flex;flex-wrap:wrap;gap:8px}
.nf .cph{display:inline-flex;align-items:center;gap:6px;min-height:46px;padding:4px 12px 4px 8px;border:2px solid var(--nfbd);border-radius:999px;background:var(--nfbg);color:var(--nftx);font:inherit;font-size:15px;font-weight:800;cursor:pointer}
.nf .cph .cpic{width:24px;height:24px;color:var(--nfp)}
.nf .cph.on{background:var(--nfp);border-color:var(--nfp);color:#fff}.nf .cph.on .cpic{color:#fff}
.nf .cph:disabled{opacity:.45;cursor:default}
.nf .cpe{margin:0;color:var(--nfmu);font-size:14px}
.nf .cpwa{margin:0}
.nf .cpwa a{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px dashed var(--nfbd);border-radius:12px;color:var(--nftx);font-size:15px;font-weight:700;text-decoration:none;background:var(--nfch)}
.nf .cpwa a svg{flex:0 0 auto;color:#128C4A}
.nf .cpu:focus-visible,.nf .cpm:focus-visible,.nf .cph:focus-visible,.nf .cpbs:focus-visible,.nf .cpwa a:focus-visible{outline:3px solid var(--nfp);outline-offset:2px}
@media (min-width:900px){.nf .cpug{grid-template-columns:repeat(5,minmax(0,1fr))}}
/* t769u scroller + pick panel + added list; t770u MCB/RCCB (same classes, .cpmb) */
.nf .cpms{display:flex;flex-wrap:nowrap;gap:8px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:4px 2px 10px;scrollbar-width:thin;scroll-padding:0 24px}
.nf .cpm b{font-size:20px}
.nf .cpck{position:absolute;top:-7px;right:-4px;min-width:20px;padding:0 5px;border-radius:999px;background:#128C4A;color:#fff;font-size:11px;font-weight:800;line-height:18px}
.nf .cpu i{font-style:normal;font-size:12px;font-weight:700;color:var(--nfmu)}.nf .cpu.on i{color:#fff}
.nf .cpug.sm{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:6px;padding-bottom:4px;scrollbar-width:thin}
.nf .cpug.sm .cpu{flex:0 0 auto;flex-direction:row;min-height:48px;padding:4px 12px;gap:6px;border-radius:999px}
.nf .cpug.sm .cpu .cpic{width:22px;height:22px}.nf .cpug.sm .cpu b{font-size:14px;white-space:nowrap}.nf .cpug.sm .cpu i{font-size:11px;white-space:nowrap}
.nf .cpa{display:flex;flex-wrap:nowrap;align-items:center;gap:6px;overflow-x:auto;overscroll-behavior-x:contain;padding-bottom:4px;scrollbar-width:thin}
.nf .cpa>*{flex:0 0 auto;white-space:nowrap}
.nf .cpah{font-size:13px;font-weight:800;color:var(--nfmu)}
.nf .cpai{display:inline-flex;align-items:center;gap:5px;min-height:36px;padding:3px 10px;border:1.5px solid #128C4A;border-radius:999px;background:var(--nfbg);color:var(--nftx);font:inherit;font-size:13px;cursor:pointer}
.nf .cpai small{color:var(--nfmu);font-size:11px}
.nf .cpp{margin-top:2px;display:flex;flex-direction:column;gap:8px;padding:10px;border:2px solid var(--nfp);border-radius:14px;background:var(--nfbg)}
.nf .cpr{display:grid;grid-template-columns:76px 1fr;gap:4px 10px;align-items:center;padding:6px 0;border-top:1px solid var(--nfbd)}
.nf .cpp .cpl+.cpr{border-top:0}
.nf .cpim{grid-row:span 2;display:block;width:76px;height:76px;border-radius:10px;overflow:hidden;background:#fff;border:1px solid var(--nfbd)}
.nf .cpim img{width:100%;height:100%;object-fit:contain}.nf .cpim .ph0{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.nf .cpri{display:flex;flex-direction:column;gap:2px;min-width:0}.nf .cpri small{font-size:12px;font-weight:700;color:var(--nfmu)}.nf .cpri b{font-size:15px;line-height:1.2;color:var(--nftx)}
.nf .cpri .rate{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px}.nf .cpri .gl{font-size:12px}
.nf .cpq{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.nf .cpst{display:inline-flex;align-items:center;border:2px solid var(--nfbd);border-radius:12px;overflow:hidden;background:var(--nfbg)}
.nf .cpst button{width:44px;height:44px;border:0;background:var(--nfch);color:var(--nftx);font:inherit;font-size:22px;font-weight:800;cursor:pointer}
.nf .cpst input{width:56px;height:44px;border:0;text-align:center;font:inherit;font-size:18px;font-weight:800;color:var(--nftx);background:var(--nfbg);-moz-appearance:textfield}
.nf .cpst input::-webkit-inner-spin-button,.nf .cpst input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.nf .cpadd{min-height:44px}
.nf .cpok{font-size:13px;font-weight:800;color:#128C4A}
.nf .cpmore{align-self:flex-start;min-height:40px;padding:4px 14px;border:1px dashed var(--nfbd);border-radius:999px;background:var(--nfch);color:var(--nftx);font:inherit;font-weight:700;cursor:pointer}
.nf .cpms:focus-visible,.nf .cpai:focus-visible,.nf .cpst button:focus-visible,.nf .cpmore:focus-visible{outline:3px solid var(--nfp);outline-offset:2px}
@media (min-width:700px){.nf .cpr{grid-template-columns:76px 1fr auto}.nf .cpim{grid-row:auto}.nf .cpq{justify-content:flex-end}}
.nf .cpri .st{align-self:flex-start;width:auto;background:transparent;border:0;padding:0;margin:0}
