.pen-type-switch{display:flex;padding:5px;background:#20251b;border:1px solid #caff002b;border-radius:18px;margin:0 38px 22px 0;gap:5px}.pen-type-switch button{flex:1;border:0;border-radius:13px;padding:13px 10px;background:transparent;color:#b8bda9;font-weight:750}.pen-type-switch button.selected{background:linear-gradient(120deg,#dcff79,#b9e800);color:#172000}.pen-page{max-width:1080px}.pen-page>.panel{margin-bottom:18px}.pen-treatment{display:flex;align-items:center;justify-content:space-between;gap:14px;background:linear-gradient(120deg,#232b1c,#171b13)}.pen-treatment h2{margin:8px 0;font-size:26px}.pen-treatment small{color:#cad3b5;letter-spacing:.08em;font-size:11px}.pen-treatment p{margin:0}.pen-hero{background:radial-gradient(ellipse at 55% 66%,color-mix(in srgb,var(--pen-color) 18%,transparent),transparent 70%),linear-gradient(145deg,#20251a,#141710);text-align:center;overflow:hidden}.pen-hero .eyebrow{display:block;text-align:left;font-size:12px}.pen-art{width:100%;height:auto;display:block;max-width:760px;margin:18px auto 8px;filter:drop-shadow(0 8px 14px #0004)}.pen-dose{margin:8px 0 12px;font-size:16px}.pen-dose strong{font-size:26px;color:#f6f8ed;margin-left:6px}.pen-counts{display:grid;grid-template-columns:1fr 1fr;margin:24px 0;gap:16px}.pen-counts>div{display:flex;justify-content:center;align-items:center;gap:12px}.pen-counts>div+div{border-left:1px solid #ffffff26}.pen-counts b{font-size:42px;line-height:1.1;color:#f6f8ee}.pen-counts span{font-size:14px;max-width:125px;color:#d0d4c5}.pen-segments{display:flex;gap:7px;margin:18px 0}.pen-segments i{height:16px;flex:1;border:1px solid #d5ff6370;border-radius:12px;background:#caff0012}.pen-segments .filled{background:linear-gradient(110deg,#d9ff62,#b6de00);box-shadow:0 0 15px #caff001b}.pen-steps summary,.pen-history summary{cursor:pointer;font-weight:750;list-style-position:inside}.pen-steps ol{padding-left:24px;color:#c1c6b6}.pen-steps li{padding:10px 0 10px 6px;line-height:1.55}.pen-steps li::marker{color:#caff00;font-weight:800}.pen-stock-row{border:1px solid #caff0028;background:linear-gradient(120deg,#28301c66,#191c16);border-left:3px solid var(--pen-color,#caff00);border-radius:18px;padding:18px;margin:14px 0;display:flex;align-items:center;justify-content:space-between;gap:12px}.pen-stock-row small{display:block;color:#aeb6a0;margin-top:6px;line-height:1.5}.pen-stock-row .actions{margin:0;flex-shrink:0}.pen-history{margin-top:22px}.pen-entry small{line-height:1.4}.pen-collection .panel-heading{gap:12px}.brand-mark.tp-logo{background:transparent!important;box-shadow:none!important;border-radius:0!important}.tp-logo img{display:block;width:100%;height:100%;object-fit:contain}.auth-brand .brand-mark.tp-logo{width:58px;height:58px}#pen-form-preview .pen-art{max-width:500px}#pen-form-preview p{margin-bottom:0}#pen-form-error{margin:18px 0}#modal select[name^="pen"]{min-height:52px}#modal .pen-collection{padding:0;border:0;box-shadow:none;background:none}
@media(max-width:600px){.pen-treatment h2{font-size:22px}.pen-stock-row{align-items:flex-start;flex-direction:column}.pen-stock-row .actions{width:100%;justify-content:flex-end}.pen-counts{gap:8px}.pen-counts b{font-size:36px}.pen-counts span{font-size:12px;max-width:98px}.pen-page .pen-dose strong{font-size:24px}.pen-page .panel{padding:20px}.pen-type-switch{margin-right:26px}.pen-type-switch button{font-size:13px;padding:12px 8px}.pen-hero .small-text{font-size:11px}.pen-entry{gap:8px}.pen-entry .outline{padding:10px 12px}}
@media(prefers-reduced-motion:reduce){.pen-page .attention{animation:none}}

.auth-mobile-brand{display:none}@media(max-width:900px){.auth-mobile-brand{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:20px;color:#f3f6e9;font-size:22px}.auth-mobile-brand img{display:block}}

.pen-delete-button{background:#ff61780c;border:1px solid #ff718640;color:#ffb8c0;border-radius:999px;padding:9px 14px;font-weight:650;font-size:12px;white-space:nowrap}.pen-delete-button:hover{background:#ff617820;border-color:#ff718680}.pen-stock-row .actions{flex-wrap:wrap}.pen-history .pen-stock-row{flex-wrap:wrap}
