@font-face{font-family:Degular;src:url('/?piprod_gate_asset=DegularDisplay-Regular.woff') format('woff');font-weight:400;font-display:swap}@font-face{font-family:Degular;src:url('/?piprod_gate_asset=DegularDisplay-Medium.woff') format('woff');font-weight:500;font-display:swap}@font-face{font-family:Degular;src:url('/?piprod_gate_asset=DegularDisplay-Semibold.woff') format('woff');font-weight:600;font-display:swap}
:root{color-scheme:light}*{box-sizing:border-box}html{min-height:100%;background:#d5d6d3}body{margin:0;min-height:100svh;display:flex;align-items:center;justify-content:flex-end;padding:24px 13vw;color:#333;font:18px/1.25 Degular,sans-serif;isolation:isolate;overflow-x:hidden}button,input,textarea{font:inherit}.gate-background{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.gate-position{position:relative;width:380.6px;max-width:100%;z-index:1}.gate{min-height:0;display:flex;flex-direction:column;padding:38px 20px 16px;background:rgba(255,255,255,.3);backdrop-filter:blur(14px) saturate(120%);-webkit-backdrop-filter:blur(14px) saturate(120%);border:1px solid rgba(255,255,255,.2);border-radius:5px;box-shadow:0 10px 30px #0003;transition:box-shadow .2s}.gate-inner{width:76%;margin:0 auto;flex:0}.gate-heading{margin:0 0 20px}.gate-drag{cursor:grab;touch-action:none;user-select:none}.gate-logo{display:block;width:144px;max-width:90%;height:auto;margin:0 auto 25px;opacity:1;pointer-events:none}.gate-heading h1{margin:0;color:#333;font-size:24px;font-weight:400;line-height:1.1;letter-spacing:.2px;white-space:nowrap}.gate-drag:focus-visible{outline:2px solid #555;outline-offset:7px;border-radius:3px}.is-dragging .gate-drag{cursor:grabbing}.is-dragging .gate{box-shadow:0 24px 60px #0005}.gate form{display:flex;flex-direction:column;gap:14px}.gate-password{position:relative}.gate .gate-entry{width:100%;height:54px;padding:13px 48px 13px 16px;border:0;border-radius:5px;background:rgba(255,255,255,.28);color:#333;outline:none;box-shadow:inset 0 0 0 1px rgba(35,40,45,.10404),0 2px 6px #0000000a;font-size:18px;font-weight:600;letter-spacing:.5px;transition:background .2s,box-shadow .2s}.gate .gate-entry::placeholder{color:#333;opacity:1;font-weight:400}.gate .gate-entry:hover,.gate .gate-entry:focus{background:rgba(255,255,255,.38);box-shadow:inset 0 0 0 1px rgba(35,40,45,.1625625),0 3px 10px #0000000d}.gate .gate-entry[aria-invalid=true]{box-shadow:inset 0 0 0 1px rgba(35,40,45,.10404),0 2px 6px #0000000a}.gate-eye{position:absolute;right:13px;top:50%;transform:translateY(-50%);width:28px;height:32px;display:grid;place-items:center;padding:0;border:0;background:transparent;cursor:pointer;opacity:.65}.gate-eye:hover{opacity:1}.gate-eye img{width:23px;height:23px;object-fit:contain;filter:invert(1);pointer-events:none}.gate-eye .eye-on{display:none}.gate-eye[aria-pressed=true] .eye-on{display:block}.gate-eye[aria-pressed=true] .eye-off{display:none}.gate-submit{align-self:flex-start;padding:10px 19px;border:0;border-radius:999px;background:rgba(230,230,230,.85);box-shadow:0 10px 30px #0003;color:#253247;font-size:16px;font-weight:500;cursor:pointer;transition:background .2s,box-shadow .2s}.gate-submit:hover{background:#fafafa;box-shadow:0 6px 18px #0004}.gate-submit:disabled{opacity:.65;cursor:wait}.gate .error{margin:0;color:#a71f1f;font-size:16px}.gate .gate-caps{margin:0;font-size:14px;color:#59420b}.gate-credit{margin-top:26px;padding:0 2px;text-align:center;color:#4a4c52;font-size:12px;line-height:1.4}.gate-credit a{color:inherit;text-decoration:none}.gate-credit a:hover{text-decoration:underline}.gate-error{animation:gate-shake .6s ease both}@keyframes gate-shake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-14px)}40%,80%{transform:translateX(14px)}}button:focus-visible,a:focus-visible{outline:2px solid #555;outline-offset:4px}[hidden]{display:none!important}@media(max-width:768px){body{justify-content:center;padding:20px}.gate{padding:34px 20px 16px;min-height:0}.gate-inner{width:82%}}@media(max-width:380px){body{padding:16px}.gate-inner{width:90%}.gate{padding:30px 18px 14px;min-height:0}.gate-heading h1{font-size:24px}.gate .gate-entry{font-size:21px}.gate-credit{font-size:13px}}@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.gate{background:rgba(235,235,235,.9)}}

@media(max-width:768px){body{width:100%;min-height:100svh;padding:20px;justify-content:center}.gate-position{margin-inline:auto;transform:none}.gate-drag{cursor:grab;touch-action:none}}

.gate-logo{color:#333;transition:color .25s ease}.gate-heading h1{transition:color .25s ease}.gate-logo g{stroke:currentColor}.gate .error{color:#ff3b30}.gate .gate-entry[aria-invalid=true]{box-shadow:inset 0 0 0 1px rgba(35,40,45,.10404),0 2px 6px #0000000a}.gate-success{height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#23894e;font-size:16px}.gate-success-dots{display:flex;gap:6px}.gate-success-dots i{width:6px;height:6px;border-radius:50%;background:#999;animation:gate-blink 1s infinite}.gate-success-dots i:nth-child(2){animation-delay:.2s}.gate-success-dots i:nth-child(3){animation-delay:.4s}@keyframes gate-blink{0%,80%,100%{opacity:.3}40%{opacity:1}}

.gate-position{zoom:var(--gate-scale,1.124125)}.gate .error{transition:opacity .25s ease}

@media(max-width:768px){.gate-position{zoom:var(--gate-scale,.830875)}}

/* Light motion is intentionally retained for this Gate. */
.gate{transition:background-color .3s ease,box-shadow .3s ease}.gate:hover{background-color:rgba(255,255,255,.48)}.gate .gate-entry{transition:background-color .3s ease,box-shadow .35s ease}.gate-submit{transition:background-color .25s ease,box-shadow .3s ease,color .25s ease,transform .25s ease,opacity .2s ease}.gate-submit:hover:not(:disabled){transform:translateY(-1.5px)}.gate-eye{transition:opacity .25s ease}.gate-credit a{transition:color .25s ease}.gate-credit a:hover{color:#222}.gate>.gate-inner,.gate>.gate-credit{filter:blur(0);transition:filter .18s ease}.is-dragging.is-moving .gate>.gate-inner,.is-dragging.is-moving .gate>.gate-credit{filter:blur(1.5px)}

.gate{cursor:grab}.is-dragging .gate{cursor:grabbing}.gate .gate-entry{cursor:text}.gate form,.gate-credit{cursor:auto}

/* JavaScript controls the entrance; the form remains visible without JS. */
.gate-intro-pending .gate{opacity:0}
.gate-background{pointer-events:none;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}

/* Consistent spacing across the visitor form, including placeholders. */
.gate,.gate *,.gate .gate-heading h1,.gate .gate-entry{letter-spacing:1px}.gate .gate-entry::placeholder{letter-spacing:1px}

/* Keep the full credit on one line; JS only reduces its font size when needed. */
.gate-credit{white-space:nowrap;--gate-credit-size:12px}@media(max-width:380px){.gate-credit{--gate-credit-size:13px}}

.gate .gate-entry[aria-invalid=true]:hover,.gate .gate-entry[aria-invalid=true]:focus{box-shadow:inset 0 0 0 1px rgba(35,40,45,.1625625),0 3px 10px #0000000d}

/* Credits: 30% tighter than the form’s 1px letter spacing. */
.gate .gate-credit,.gate .gate-credit *{letter-spacing:.7px}

/* Compact visitor controls; native password remains a password input. */
@font-face{font-family:PiprodPasswordMarks;src:url('/?piprod_gate_asset=password-marks.woff') format('woff');font-weight:100 900;font-display:swap;unicode-range:U+2022,U+25CF,U+25A0,U+25AA}
.gate .gate-entry[type=password]{font-family:PiprodPasswordMarks,Degular,sans-serif;letter-spacing:1.3px}
.gate .gate-entry::placeholder{font-family:Degular,sans-serif;letter-spacing:1px}
.gate-eye{width:28px;height:28px;border-radius:50%;opacity:1;background:rgba(7,26,58,.06);transition:background-color .3s ease,transform .3s cubic-bezier(.22,1,.36,1)}
.gate-eye:hover{background:rgba(7,26,58,.10);transform:translateY(-50%) rotate(8deg)}
.gate-eye:active{transform:translateY(-50%) rotate(8deg) scale(.94)}
.gate-eye img{width:16.62px;height:16.62px;opacity:.65;transition:opacity .25s ease}
.gate-eye:hover img{opacity:1}
html[data-theme=dark] .gate-eye{background:rgba(255,255,255,.09)}
html[data-theme=dark] .gate-eye:hover{background:rgba(255,255,255,.06)}
.gate-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-inline:0;text-align:left}
.gate-title-row h1{flex:0 1 auto}
.gate-title-copy{min-width:0}
.gate-site-target{display:flex;align-items:baseline;justify-content:space-between;gap:8px;width:100%;margin:8px 0 0;font-family:inherit;font-size:14.4px;font-weight:400;line-height:1.3;color:inherit;overflow-wrap:anywhere}
.gate-site-target>span{flex:0 1 auto}.gate-site-target strong{font-weight:600;min-width:0;text-align:right}



/* Access toggle symbols and proportions, with translucent visitor colors. */
.gate{--pa-muted:#656862;--pa-text:#333}
html[data-theme=dark]{color-scheme:dark;background:#181918}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:#000;opacity:0;transition:opacity .55s cubic-bezier(.22,1,.36,1) .18s}
html[data-theme=dark] body::before{opacity:.42}
html[data-theme=dark] .gate{background:rgba(24,27,30,.52);border-color:#ffffff18;--pa-muted:#b5b8b2;--pa-text:#f1f1ed;color:#f1f1ed}
html[data-theme=dark] .gate:hover{background:rgba(24,27,30,.64)}
html[data-theme=dark] .gate-logo,html[data-theme=dark] .gate-heading h1{color:#f1f1ed}
html[data-theme=dark] .gate .gate-entry{color:#f1f1ed;background:rgba(5,8,11,.22);box-shadow:inset 0 0 0 1px #ffffff1b,0 2px 6px #0000000a}
html[data-theme=dark] .gate .gate-entry:hover,html[data-theme=dark] .gate .gate-entry:focus{background:rgba(5,8,11,.34);box-shadow:inset 0 0 0 1px #ffffff29,0 3px 10px #0000000d}
html[data-theme=dark] .gate .gate-entry::placeholder{color:#e5e7e2}
html[data-theme=dark] .gate-eye img{filter:none}
html[data-theme=dark] .gate-submit{background:rgba(230,234,229,.16);color:#f1f1ed;box-shadow:0 6px 20px #0002}
html[data-theme=dark] .gate-submit:hover{background:rgba(230,234,229,.24)}
html[data-theme=dark] .gate-credit{color:#bfc2bc}
html[data-theme=dark] .gate-credit a:hover{color:#fff}
html[data-theme=dark] .gate-caps{color:#e7c787}
.gate,.gate .gate-entry,.gate-credit{transition:background-color .3s ease,box-shadow .3s ease,color .3s ease}

/* Same fixed theme control position as the Access login screen. */
.access-login-theme{position:relative;flex:0 0 28px;margin-left:auto;display:flex;--pa-muted:#656862;--pa-text:#333}
.access-login-theme .theme-toggle{cursor:pointer}
html[data-theme=dark] .access-login-theme{--pa-muted:#b5b8b2;--pa-text:#f1f1ed}

/* Shared push-button: exact PB Trucks icon geometry and transitions. */
.access-login-theme{--gate-switch-color:#555}
.access-login-theme[data-contrast=light],html[data-theme=dark] .access-login-theme{--gate-switch-color:#f1f1ed}
.access-login-theme .theme-toggle{position:relative;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;flex:0 0 28px;padding:0;border:0;border-radius:50%;background:rgba(7,26,58,.06);color:var(--gate-switch-color);cursor:pointer;box-shadow:none;transition:color .3s ease,background-color .3s ease,transform .3s cubic-bezier(.22,1,.36,1)}
.access-login-theme .theme-toggle:hover{color:var(--gate-switch-color);background:rgba(7,26,58,.10);transform:rotate(8deg)}
html[data-theme=dark] .access-login-theme .theme-toggle,.access-login-theme[data-contrast=light] .theme-toggle{background:rgba(255,255,255,.09)}
html[data-theme=dark] .access-login-theme .theme-toggle:hover,.access-login-theme[data-contrast=light] .theme-toggle:hover{background:rgba(255,255,255,.06)}
.access-login-theme .theme-toggle:active{transform:rotate(8deg) scale(.94)}
.access-login-theme .theme-toggle:focus-visible{outline:1px solid currentColor;outline-offset:4px}
.gate-theme-icon{position:relative;display:block;width:12px;height:12px}
.access-login-theme .theme-toggle svg{position:absolute;inset:0;display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;transition:opacity .35s ease,transform .45s cubic-bezier(.22,1,.36,1)}
.gate-theme-moon{opacity:1;transform:rotate(0) scale(1)}
.gate-theme-sun{opacity:0;transform:rotate(-70deg) scale(.45)}
html[data-theme=dark] .gate-theme-moon{opacity:0;transform:rotate(70deg) scale(.45)}
html[data-theme=dark] .gate-theme-sun{opacity:1;transform:rotate(0) scale(1)}

/* Local logo response: original geometry and thickness are retained at rest. */
.gate-logo{pointer-events:auto;overflow:visible}
.gate-logo path{stroke-width:1.3px;transform-box:fill-box;transform-origin:center;transform:scaleY(1);transition:stroke-width .5s cubic-bezier(.42,0,.2,1),transform .55s cubic-bezier(.42,0,.2,1)}
.gate-logo path.is-hovered{stroke-width:calc(1.3px + 2pt);transform:scaleY(1.3)}

/* Centered stage; on phones it follows the visible area above the keyboard. */
body{padding:0;justify-content:center}
.gate-viewport{display:flex;align-items:center;justify-content:center;width:100%;min-height:100svh;padding:24px}
.gate .gate-entry.gate-secret-masked{-webkit-text-security:square;font-family:PiprodPasswordMarks,Degular,sans-serif;letter-spacing:1.3px}
@media(max-width:768px){
 body{padding:0}
 .gate-viewport{position:fixed;top:var(--gate-visible-top,0px);left:var(--gate-visible-left,0px);width:var(--gate-visible-width,100%);height:var(--gate-visible-height,100svh);min-height:0;padding:16px;overflow-y:auto;overscroll-behavior:contain;align-items:safe center}
 .gate .gate-entry{font-size:20px}
 .gate-keyboard .gate{padding-top:20px;padding-bottom:12px}
 .gate-keyboard .gate-logo{width:112px;margin-bottom:16px}
 .gate-keyboard .gate-heading{margin-bottom:14px}
 .gate-keyboard .gate-credit{margin-top:16px}
}

/* Single-line textarea: no native login input is exposed to credential suggestions. */
.gate textarea.gate-entry{display:block;resize:none;overflow:hidden;white-space:pre;line-height:24px;padding-top:15px;padding-bottom:15px}

.gate-logo-row{position:relative;display:flow-root}
.access-login-theme{position:fixed;top:auto;right:calc(24px + env(safe-area-inset-right,0px));bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:50;margin:0}
.access-login-theme .theme-toggle{width:39.2px;height:39.2px;flex-basis:39.2px}
.access-login-theme .gate-theme-icon{width:16.8px;height:16.8px}

/* More opaque contrast plate over the visitor background. */
.access-login-theme .theme-toggle{background:rgba(235,237,232,.82)}
.access-login-theme .theme-toggle:hover{background:rgba(220,223,216,.90)}
html[data-theme=dark] .access-login-theme .theme-toggle,.access-login-theme[data-contrast=light] .theme-toggle{background:rgba(28,32,30,.78)}
html[data-theme=dark] .access-login-theme .theme-toggle:hover,.access-login-theme[data-contrast=light] .theme-toggle:hover{background:rgba(20,24,22,.88)}

.gate .gate-site-target,.gate .gate-site-target span,.gate .gate-site-target strong{letter-spacing:.5px}
.gate .gate-success>span{font-weight:600;letter-spacing:.3px}

/* Password assistance: no value changes, no additional resources. */
.gate-password .gate-caps{position:absolute;left:13px;top:50%;z-index:2;transform:translateY(-50%);display:grid;place-items:center;width:17px;height:20px;margin:0;color:#626262;pointer-events:none}
.gate-caps svg{display:block;width:14px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.gate .gate-password.has-caps .gate-entry{padding-left:38px}
.gate-space-marks{position:absolute;z-index:1;inset:0;overflow:hidden;pointer-events:none;border-radius:5px}
.gate-space-marks i{position:absolute;bottom:8px;height:2px;border-radius:1px;background:#777;opacity:.6}
.gate-space-probe{position:absolute;left:0;top:0;white-space:pre;visibility:hidden;pointer-events:none;width:max-content}
.gate .gate-space-warning{margin:-5px 0 0;font-size:12px;line-height:1.25;letter-spacing:.2px;color:#626262}
html[data-theme=dark] .gate-password .gate-caps,html[data-theme=dark] .gate .gate-space-warning{color:#deded8}
html[data-theme=dark] .gate-space-marks i{background:#d0d0ca}

.gate-space-marks i.is-space{background:#626262;opacity:1}
.gate-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.gate .gate-attempts{flex:none;margin-left:auto;font-size:11px;letter-spacing:.2px;color:#626262}
html[data-theme=dark] .gate .gate-attempts{color:#deded8}
html[data-theme=dark] .gate-space-marks i.is-space{background:#f1f1ed}

/* Visible passwords use equal character cells to keep all 6px markers evenly spaced. */
.gate .gate-entry:not(.gate-secret-masked):not([type="password"]){font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:1.3px}
.gate-space-marks i.is-space,html[data-theme=dark] .gate-space-marks i.is-space{background:#d58220;opacity:1}
