.hpu-shell { --ink:#183a36; --muted:#6a7971; --paper:#f4f4ed; --line:#e1e6da; --green:#c2e394; display:grid; grid-template-columns:238px minmax(0,1fr); min-height:100vh; background:var(--paper); color:var(--ink); font:15px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; margin:0; box-sizing:border-box }
.hpu-shell * { box-sizing:border-box }.hpu-shell a { text-decoration:none; color:inherit }.hpu-shell button,.hpu-shell input,.hpu-shell textarea { font:inherit }.hpu-shell h1,.hpu-shell h2,.hpu-shell h3,.hpu-shell p { margin-top:0 }.hpu-shell h2 { font-size:21px; letter-spacing:-.5px; font-weight:650; color:var(--ink) }.hpu-shell h3 { margin:0; font-size:18px }.hpu-sidebar { background:#183a36; color:#f4f4ed; padding:36px 20px; display:flex; flex-direction:column }.hpu-brand { font-size:23px; font-weight:650; display:flex; align-items:center; gap:12px; padding:0 14px }.hpu-brand span { font-size:48px; letter-spacing:-4px; color:var(--green); line-height:1 }.hpu-side-label { font-size:9px; letter-spacing:1.7px; color:#a5b9ac; padding:0 14px; margin:55px 0 16px }.hpu-sidebar nav { display:flex; flex-direction:column; gap:7px }.hpu-sidebar nav a { padding:13px 14px; border-radius:8px; color:#c4d3c8; font-size:14px }.hpu-sidebar nav a:hover { background:#254b43 }.hpu-sidebar nav a.is-active { background:var(--green); color:var(--ink); font-weight:650 }.hpu-side-bottom { margin-top:auto; padding:60px 14px 10px; font-size:13px; color:#d2ded2 }.hpu-side-bottom small { color:#92ab9f }.hpu-dot { display:inline-block; width:7px; height:7px; background:var(--green); border-radius:50%; margin-right:7px }.hpu-main { padding:30px clamp(22px,4vw,65px); min-width:0 }.hpu-topline { display:flex; justify-content:space-between; align-items:center; gap:20px; font-size:10px; letter-spacing:1px; color:var(--muted); border-bottom:1px solid var(--line); padding-bottom:22px }.hpu-topline a { font-size:12px; letter-spacing:0 }.hpu-heading { padding:42px 0 26px }.hpu-eyebrow { font-size:10px; font-weight:650; letter-spacing:1.8px; color:var(--muted); margin-bottom:14px }.hpu-heading h1 { font-size:clamp(30px,3.6vw,51px); font-weight:650; letter-spacing:-2px; line-height:1.12; margin-bottom:13px; color:var(--ink) }.hpu-heading p:last-child { color:var(--muted); font-size:15px }.hpu-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-bottom:25px }.hpu-stats article { background:white; border:1px solid var(--line); border-radius:13px; padding:24px 26px }.hpu-stats span,.hpu-stats small { display:block; color:var(--muted); font-size:12px }.hpu-stats strong { font-size:48px; letter-spacing:-2px; font-weight:600; display:block; margin:10px 0 5px; line-height:1.1 }.hpu-grid { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(250px,1fr); gap:24px }.hpu-card { background:white; border:1px solid var(--line); border-radius:13px; padding:28px; margin-bottom:24px; box-shadow:0 3px 8px #183a3603 }.hpu-card p { color:var(--muted); max-width:850px }.hpu-section-title { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-bottom:15px }.hpu-section-title h2 { margin:0 }.hpu-section-title a { color:#477c54; font-size:12px }.hpu-product { display:flex; gap:14px; align-items:center; padding:18px 0; border-top:1px solid var(--line) }.hpu-product>div { flex:1; min-width:0 }.hpu-product strong { display:block; font-size:14px }.hpu-product small { display:block; font-size:11px; color:var(--muted); word-break:break-word }.hpu-product-icon { width:38px; height:38px; flex:0 0 38px; border-radius:9px; display:grid; place-items:center; background:#eaf0e3; font-size:15px; font-weight:600 }.hpu-badge { display:inline-flex; background:#eef5e6; color:#416c3d; padding:5px 9px; font-size:11px; border-radius:6px; white-space:nowrap }.hpu-accent { background:#e5edd9; border-color:#d4e0c4; display:flex; flex-direction:column; justify-content:center; padding:35px }.hpu-accent h2 { font-size:33px; line-height:1.1; letter-spacing:-1px }.hpu-accent p { font-size:13px }.hpu-button { display:inline-block; background:#234f45; color:#fff!important; border:0; border-radius:8px; padding:12px 18px; font-size:13px; font-weight:600; cursor:pointer; text-align:center }.hpu-button:hover { background:#356b5b }.hpu-button:disabled { opacity:.5; cursor:default }.hpu-accent .hpu-button { margin-top:12px; align-self:flex-start }.hpu-table-wrap { overflow:auto }.hpu-shell table { width:100%; border-collapse:collapse; text-align:left; font-size:12px }.hpu-shell th { color:var(--muted); font-weight:500; padding:11px 12px; border-bottom:1px solid var(--line); white-space:nowrap }.hpu-shell td { padding:16px 12px; border-bottom:1px solid #edf0e9; vertical-align:middle; overflow-wrap:anywhere }.hpu-shell td small { display:block; color:var(--muted); font-size:10px; margin-top:4px }.hpu-shell td form { margin:0 }.hpu-footer { color:#839083; font-size:10px; padding:20px 0 }.hpu-shell label { display:block; margin:18px 0; font-size:13px; font-weight:600 }.hpu-shell input:not([type=checkbox]),.hpu-shell textarea { display:block; width:100%; border:1px solid #d9e1d5; background:#fafbf8; border-radius:7px; padding:11px 13px; color:var(--ink); margin-top:8px; max-width:100% }.hpu-shell input:focus,.hpu-shell textarea:focus { outline:2px solid #8bbf70; outline-offset:2px }.hpu-shell input[type=checkbox] { accent-color:#234f45; margin-right:8px }.hpu-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 22px }.hpu-shell fieldset { border:1px solid var(--line); border-radius:8px; padding:12px 20px; margin:15px 0 24px }.hpu-shell legend { font-size:13px; padding:0 7px }.hpu-checks { display:grid; grid-template-columns:1fr 1fr; gap:0 15px }.hpu-checks label { margin:9px 0; font-weight:400; font-size:12px }.hpu-link-button { border:0; background:none; color:#477c54; cursor:pointer; padding:5px }.hpu-secondary { border:1px solid #d5dfcf; border-radius:7px; background:white; color:#345a45; padding:9px 13px; cursor:pointer; font-size:12px }.hpu-license { border-top:1px solid var(--line); padding:25px 0 }.hpu-license:last-child { padding-bottom:0 }.hpu-license .hpu-section-title { margin:0 0 8px }.hpu-license .hpu-section-title p { margin:5px 0; font-size:13px }.hpu-license-actions { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:15px }.hpu-license-actions form { display:flex; gap:8px; align-items:center }.hpu-license-actions input { width:auto!important; font-size:12px!important; margin:0!important; padding:7px!important }.hpu-muted { font-size:11px!important; color:var(--muted)!important }.hpu-notice { padding:15px 20px; border:1px solid #b7d6a1; background:#eef8e5; border-radius:9px; margin-bottom:22px }.hpu-notice.is-error { background:#fff0e7; border-color:#e6b495; color:#7e3f26 }.hpu-key-reveal { border-color:#c2d9ac; background:#f4faed }.hpu-key-reveal input { font-family:monospace!important; font-size:14px!important }.hpu-guide li { margin:22px 0; padding-left:9px; color:var(--muted) }.hpu-guide strong { color:var(--ink) }.hpu-shell a:focus-visible,.hpu-shell button:focus-visible { outline:3px solid #b2d983; outline-offset:3px }
@media(max-width:1000px) { .hpu-shell { grid-template-columns:190px minmax(0,1fr) }.hpu-main { padding:25px }.hpu-grid { grid-template-columns:1fr }.hpu-sidebar { padding:25px 12px }.hpu-stats article { padding:20px }.hpu-stats strong { font-size:40px } }
@media(max-width:700px) { .hpu-shell { display:block }.hpu-sidebar { padding:20px }.hpu-brand { padding:0 }.hpu-side-label,.hpu-side-bottom { display:none }.hpu-sidebar nav { flex-direction:row; overflow:auto; margin-top:20px; gap:5px }.hpu-sidebar nav a { white-space:nowrap; padding:10px 12px; font-size:12px }.hpu-main { padding:20px }.hpu-heading { padding:30px 0 15px }.hpu-heading h1 { letter-spacing:-1px }.hpu-stats { grid-template-columns:1fr; gap:10px }.hpu-stats article { display:grid; grid-template-columns:1fr auto; align-items:center; padding:15px 20px }.hpu-stats strong { grid-column:2; grid-row:1/3; margin:0; font-size:35px }.hpu-card { padding:20px }.hpu-form-grid,.hpu-checks { grid-template-columns:1fr }.hpu-section-title { flex-wrap:wrap }.hpu-product { flex-wrap:wrap }.hpu-topline { letter-spacing:0 } }