/* Speero Personalization Hub: embed styles.
Colours, type scale and spacing are the prototype's design tokens
(nick-personalization-hub.vercel.app), scoped under
#speero-personalization-hub so nothing reaches the rest of a Webflow page.
Needs Poppins:
*/
#speero-personalization-hub{
--ink:#142844;--ink-soft:#1c2b3d;--muted:#586373;--hint:#8a9096;--line:#d7dad5;
--canvas:#f3f3ef;--wash:#e9ede8;--wash-2:#fafaf6;--paper:#fff;--alt:#f8f8f6;
--navy:#001641;--navy-bg:#ebecf0;--pink:#ff0049;--pink-bg:#ffebf0;--yellow:#ffb800;--yellow-bg:#fff9eb;
--warn:#8a5a00;--on-ink-muted:#c5cdd8;--accent:#244ed8;--accent-soft:#e5e8fb;
--page:clamp(1.25rem,5vw,5.5rem);
--hero:clamp(2.75rem,1.15rem + 5.4vw,5.25rem);--display:clamp(1.75rem,1.2rem + 2vw,2.75rem);
--shadow:0 0 0 1px #1428440f,0 1px 2px -1px #1428440f,0 2px 4px #1428440a;
--shadow-hover:0 0 0 1px #1428441a,0 1px 2px -1px #14284414,0 8px 20px #14284414;
display:block;background:var(--canvas);color:var(--ink);
font-family:'Poppins',Arial,sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;
}
#speero-personalization-hub *,#speero-personalization-hub *::before,#speero-personalization-hub *::after{box-sizing:border-box}
#speero-personalization-hub :where(h1,h2,h3,p,ul,ol,dl,dd,figure,blockquote,fieldset){margin:0;padding:0}
#speero-personalization-hub :where(ul,ol){list-style:none}
#speero-personalization-hub a{color:inherit}
#speero-personalization-hub button,#speero-personalization-hub input,#speero-personalization-hub select{font:inherit;color:inherit}
#speero-personalization-hub button{cursor:pointer;background:none;border:0}
#speero-personalization-hub :focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (prefers-reduced-motion:reduce){#speero-personalization-hub *{transition:none!important;scroll-behavior:auto!important}}
#speero-personalization-hub .ph{max-width:80rem;margin:0 auto;padding:0 var(--page) 4rem;}
#speero-personalization-hub .ph-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
#speero-personalization-hub .ph-loading{padding:5rem 0;color:var(--muted)}
/* type */
#speero-personalization-hub .ph-kicker{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--pink);margin-bottom:1.25rem}
#speero-personalization-hub .ph-hero-h{font-size:var(--hero);line-height:1.02;font-weight:800;letter-spacing:-.038em;margin-bottom:1.5rem;text-wrap:balance;max-width:40rem}
#speero-personalization-hub .ph-display{font-size:var(--display);line-height:1.12;font-weight:800;letter-spacing:-.038em;margin-bottom:.75rem;text-wrap:balance;max-width:48rem}
#speero-personalization-hub .ph-pink{color:var(--pink)}
/* Webflow's normalize makes summary a block, which drops the disclosure triangle */
#speero-personalization-hub summary{display:list-item}
#speero-personalization-hub .ph-lede{font-size:1.0625rem;font-weight:300;line-height:1.625;color:var(--muted);max-width:32rem;text-wrap:pretty}
#speero-personalization-hub .ph-lede-sm{font-size:.875rem;font-weight:300;line-height:1.625;color:var(--muted);max-width:36rem;margin-bottom:2rem}
#speero-personalization-hub .ph-small{font-size:.75rem;font-weight:300;color:var(--muted);line-height:1.6}
#speero-personalization-hub .ph-note{margin-top:.75rem;max-width:16rem;text-align:center;font-size:.75rem;font-weight:300;color:var(--muted)}
#speero-personalization-hub .ph-strong{font-weight:600}
/* buttons */
#speero-personalization-hub .ph-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:44px;border-radius:.75rem;padding:.875rem 1.5rem;font-size:1.125rem;font-weight:600;text-decoration:none;transition:background-color .15s,box-shadow .15s,transform .15s}
#speero-personalization-hub .ph-btn:active:not(:disabled){transform:scale(.96)}
#speero-personalization-hub .ph-btn:disabled{opacity:.5;cursor:default}
#speero-personalization-hub .ph-btn-hl{background:var(--yellow);color:var(--ink)}
#speero-personalization-hub .ph-btn-solid{background:var(--ink);color:#fff}
#speero-personalization-hub .ph-btn-solid:hover:not(:disabled){background:var(--ink-soft)}
#speero-personalization-hub .ph-btn-outline{background:var(--paper);color:var(--ink);box-shadow:var(--shadow);padding:.625rem 1rem;font-size:.875rem;font-weight:500}
#speero-personalization-hub .ph-btn-outline:hover:not(:disabled){box-shadow:var(--shadow-hover)}
#speero-personalization-hub .ph-btn-ghost{background:transparent;color:var(--ink);padding:.5rem .75rem;font-size:.875rem;font-weight:500}
#speero-personalization-hub .ph-btn-ghost:hover{background:var(--wash)}
#speero-personalization-hub .ph-btn-block{width:100%}
#speero-personalization-hub .ph-textlink{display:inline-flex;align-items:center;min-height:44px;font-size:.875rem;font-weight:600;text-decoration:underline;text-underline-offset:4px;color:var(--ink);padding:0}
#speero-personalization-hub .ph-on-ink{color:#fff}
#speero-personalization-hub .ph-actions{display:flex;flex-wrap:wrap;align-items:center;gap:1.25rem;margin-top:2rem}
#speero-personalization-hub .ph-ico-sm{width:1rem;height:1rem;flex:none}
#speero-personalization-hub .ph-arrow-sm{margin-left:.25rem}
/* home */
#speero-personalization-hub .ph-hero{display:grid;gap:2.5rem;align-items:center;padding:3.5rem 0;background:var(--alt);box-shadow:0 0 0 100vmax var(--alt);clip-path:inset(0 -100vmax)}
@media (min-width:768px){#speero-personalization-hub .ph-hero{padding:5rem 0}}
@media (min-width:1024px){#speero-personalization-hub .ph-hero{grid-template-columns:1.2fr 1fr;gap:4rem}#speero-personalization-hub .ph-hero-steps{justify-self:end}}
#speero-personalization-hub .ph-hero-steps{width:100%;max-width:28rem}
#speero-personalization-hub .ph-steps{display:grid;grid-template-columns:1fr 1fr;gap:1px;overflow:hidden;border-radius:1.75rem;border:1px solid var(--navy);background:rgba(255,255,255,.2);color:#fff}
#speero-personalization-hub .ph-steps li{display:flex;flex-direction:column;align-items:flex-start;gap:.75rem;background:var(--navy);padding:1.25rem}
@media (min-width:640px){#speero-personalization-hub .ph-steps li{padding:1.5rem}}
#speero-personalization-hub .ph-steps-top{display:flex;width:100%;justify-content:space-between;align-items:flex-start;gap:.75rem}
#speero-personalization-hub .ph-steps-ico{width:2.5rem;height:2.5rem}
@media (min-width:640px){#speero-personalization-hub .ph-steps-ico{width:3rem;height:3rem}}
#speero-personalization-hub .ph-steps-n{font-size:.75rem;font-weight:500;color:var(--pink)}
#speero-personalization-hub .ph-steps-label{font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-style:italic;color:var(--yellow)}
#speero-personalization-hub .ph-steps-q{font-weight:600}
#speero-personalization-hub .ph-steps li.ph-steps-loop{justify-content:center;gap:0}
#speero-personalization-hub .ph-steps-loop .ph-steps-ico{margin-bottom:.75rem}
#speero-personalization-hub .ph-steps-win{font-size:.875rem;font-weight:700;color:var(--yellow)}
#speero-personalization-hub .ph-steps-note{margin-top:.5rem;font-size:.75rem;line-height:1.6;color:var(--on-ink-muted)}
#speero-personalization-hub .ph-row{padding:3rem 0;background:var(--canvas);box-shadow:0 0 0 100vmax var(--canvas);clip-path:inset(0 -100vmax)}
#speero-personalization-hub .ph-row-2{background:var(--alt);box-shadow:0 0 0 100vmax var(--alt)}
@media (min-width:768px){#speero-personalization-hub .ph-row{padding:4rem 0}}
#speero-personalization-hub .ph-row-grid{display:grid;gap:2.5rem;align-items:center}
@media (min-width:1024px){#speero-personalization-hub .ph-row-grid{grid-template-columns:1fr 1fr;gap:4rem}
#speero-personalization-hub .is-flip .ph-row-copy{order:2}#speero-personalization-hub .is-flip .ph-row-cta{order:1}}
#speero-personalization-hub .ph-row-cta{display:flex;flex-direction:column;align-items:center;justify-content:center}
#speero-personalization-hub .ph-row-head{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}
#speero-personalization-hub .ph-row-n{display:inline-flex;width:2.5rem;height:2.5rem;align-items:center;justify-content:center;border-radius:50%;background:var(--pink);color:#fff;font-size:.875rem;font-weight:700}
#speero-personalization-hub .ph-badge{display:inline-flex;min-height:1.75rem;align-items:center;border-radius:999px;padding:0 .625rem;font-size:.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
#speero-personalization-hub .ph-badge-1{background:var(--navy);color:#fff}
#speero-personalization-hub .ph-badge-2{background:var(--pink-bg);color:var(--pink)}
#speero-personalization-hub .ph-badge-3{background:var(--yellow-bg);color:var(--warn)}
#speero-personalization-hub .ph-preview{max-width:24rem;border-radius:1.25rem;background:var(--paper);padding:1rem;box-shadow:var(--shadow)}
#speero-personalization-hub .ph-sigs{display:flex;flex-direction:column;gap:.75rem}
#speero-personalization-hub .ph-sigrow{display:grid;grid-template-columns:minmax(0,1fr) 1.25rem minmax(0,1.2fr);align-items:center;gap:.25rem}
#speero-personalization-hub .ph-sig,#speero-personalization-hub .ph-msg{border-radius:.75rem;padding:.5rem .625rem;font-size:.8125rem;font-weight:500;line-height:1.375}
#speero-personalization-hub .ph-sig{background:var(--wash)}
#speero-personalization-hub .ph-msg{background:var(--pink-bg)}
#speero-personalization-hub .ph-sig-arrow{text-align:center;color:var(--hint)}
#speero-personalization-hub .ph-logos{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
#speero-personalization-hub .ph-logo-tile{display:flex;flex-direction:column;align-items:center;gap:.375rem;border-radius:.75rem;background:var(--wash);padding:.75rem .5rem;min-width:0}
#speero-personalization-hub .ph-logo-box{display:inline-flex;width:2rem;height:2rem;align-items:center;justify-content:center}
#speero-personalization-hub .ph-logo-name{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;font-size:.5625rem;font-weight:500}
#speero-personalization-hub .ph-logo{flex:none;border-radius:.5rem;background:var(--paper);object-fit:contain;width:2rem;height:2rem}
#speero-personalization-hub .ph-logo-sm{width:1.5rem;height:1.5rem}
#speero-personalization-hub .ph-logo-lg{width:3rem;height:3rem}
#speero-personalization-hub .ph-logo-fb{display:inline-flex;align-items:center;justify-content:center;background:var(--navy);color:#fff;font-weight:700;font-size:.75rem}
/* pillar map */
#speero-personalization-hub .ph-pillars{display:grid;grid-template-columns:1fr 1fr;gap:1px;overflow:hidden;border-radius:1.75rem;border:1px solid var(--navy);background:rgba(255,255,255,.2);color:#fff}
#speero-personalization-hub .ph-pillars section{background:var(--navy);padding:1rem;scroll-margin-top:6rem}
@media (min-width:640px){#speero-personalization-hub .ph-pillars section{padding:1.25rem}}
#speero-personalization-hub .ph-pillars-top{display:flex;justify-content:space-between;align-items:flex-start;gap:.75rem;margin-bottom:1rem}
#speero-personalization-hub .ph-pillars-ico{width:2rem;height:2rem}
#speero-personalization-hub .ph-pillars-n{font-size:.75rem;color:var(--pink)}
#speero-personalization-hub .ph-pillars-label{font-size:.875rem;font-weight:700;color:var(--yellow)}
#speero-personalization-hub .ph-pillars.is-detailed{grid-template-columns:1fr}
@media (min-width:640px){#speero-personalization-hub .ph-pillars.is-detailed{grid-template-columns:1fr 1fr}#speero-personalization-hub .is-detailed section{padding:2rem}}
#speero-personalization-hub .is-detailed .ph-pillars-ico{width:2.5rem;height:2.5rem}
#speero-personalization-hub .is-detailed h3{font-size:1.25rem;font-weight:800;color:var(--yellow);margin-bottom:.5rem}
#speero-personalization-hub .ph-pillars-q{font-weight:600;margin-bottom:.5rem}
#speero-personalization-hub .ph-pillars-d{font-size:.875rem;font-weight:300;line-height:1.625;color:var(--on-ink-muted)}
/* assess */
#speero-personalization-hub .ph-intro{display:grid;gap:3rem;padding:3.5rem 0;align-items:start}
@media (min-width:1024px){#speero-personalization-hub .ph-intro{grid-template-columns:1.2fr 1fr;gap:4rem}}
#speero-personalization-hub .ph-checks{margin:2rem 0 1.5rem;display:grid;gap:.75rem;font-size:.875rem}
#speero-personalization-hub .ph-checks li{display:flex;gap:.75rem;align-items:flex-start}
#speero-personalization-hub .ph-check{width:1rem;height:1rem;color:var(--pink);flex:none;margin-top:.2rem}
#speero-personalization-hub .ph-meta{font-size:.75rem;font-weight:600;margin-bottom:1rem}
#speero-personalization-hub .ph-meta span{color:var(--hint);margin:0 .375rem}
#speero-personalization-hub .ph-startcard{background:var(--paper);border-radius:1.75rem;padding:1.5rem;box-shadow:var(--shadow)}
#speero-personalization-hub .ph-startcard-h{font-weight:700;font-size:1.125rem;color:var(--navy);margin:1.25rem 0 .25rem}
#speero-personalization-hub .ph-startcard .ph-pills{margin:1rem 0 1.25rem}
#speero-personalization-hub .ph-startcard .ph-note{max-width:none}
#speero-personalization-hub .ph-pills{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}
#speero-personalization-hub .ph-pill{display:inline-flex;align-items:center;min-height:44px;border-radius:999px;padding:0 .875rem;font-size:.75rem;font-weight:500;background:var(--canvas);transition:background-color .15s,color .15s}
#speero-personalization-hub .ph-pill:hover{background:var(--wash)}
#speero-personalization-hub .ph-pill-paper{background:var(--paper);color:var(--muted);box-shadow:var(--shadow);font-size:.875rem}
#speero-personalization-hub .ph-pill-paper:hover{color:var(--ink);background:var(--paper)}
#speero-personalization-hub .ph-pill[aria-pressed="true"],#speero-personalization-hub .ph-pill.on{background:var(--ink);color:#fff;box-shadow:none}
#speero-personalization-hub .ph-pillar-sec{padding:3.5rem 0}
#speero-personalization-hub .ph-pillar-sec .ph-lede{margin-bottom:2rem;max-width:40rem}
#speero-personalization-hub .ph-pillar-sec>.ph-small{margin-top:1.5rem}
#speero-personalization-hub .ph-levels-sec{padding:3.5rem 0}
#speero-personalization-hub .ph-levels-head{display:grid;gap:1.5rem;margin-bottom:2rem}
@media (min-width:1024px){#speero-personalization-hub .ph-levels-head{grid-template-columns:1fr 1fr;align-items:end}}
#speero-personalization-hub .ph-levels{display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:.75rem}
#speero-personalization-hub .ph-levels li{background:var(--paper);border-radius:1.25rem;padding:1.25rem;box-shadow:var(--shadow)}
#speero-personalization-hub .ph-levels h3{font-size:1rem;font-weight:700;margin:.75rem 0 .25rem}
#speero-personalization-hub .ph-levels p{font-size:.75rem;color:var(--muted)}
#speero-personalization-hub .ph-bars{display:inline-flex;align-items:flex-end;gap:2px;height:1.25rem}
#speero-personalization-hub .ph-bars span{width:4px;border-radius:2px;background:var(--line)}
#speero-personalization-hub .ph-bars .b1{height:.5rem}#speero-personalization-hub .ph-bars .b2{height:.625rem}#speero-personalization-hub .ph-bars .b3{height:.875rem}#speero-personalization-hub .ph-bars .b4{height:1rem}#speero-personalization-hub .ph-bars .b5{height:1.25rem}
#speero-personalization-hub .ph-bars .on{background:var(--ink)}
#speero-personalization-hub .ph-quiz{max-width:48rem;margin:0 auto;padding:2.5rem 0}
#speero-personalization-hub .ph-progress{margin-bottom:1.5rem}
#speero-personalization-hub .ph-progress p{font-size:.75rem;color:var(--muted);margin-top:.5rem}
#speero-personalization-hub .ph-progress-bar{height:6px;border-radius:999px;background:var(--wash);overflow:hidden}
#speero-personalization-hub .ph-progress-bar div{height:100%;background:var(--pink);transition:width .2s}
#speero-personalization-hub .ph-qsteps{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;margin-bottom:2rem}
#speero-personalization-hub .ph-qsteps li{display:flex;flex-direction:column;gap:.125rem;border-radius:.75rem;padding:.75rem .5rem;text-align:center;font-size:.75rem;font-weight:600;background:var(--wash);color:var(--muted)}
#speero-personalization-hub .ph-qsteps li.on{background:var(--navy);color:#fff}
#speero-personalization-hub .ph-qs{display:grid;gap:.75rem;margin-bottom:2rem}
#speero-personalization-hub .ph-qs li{background:var(--paper);border-radius:1.25rem;padding:1.25rem;box-shadow:var(--shadow)}
#speero-personalization-hub .ph-q-n{font-size:.75rem;font-weight:700;color:var(--pink);margin-bottom:.25rem}
#speero-personalization-hub .ph-q-text{font-weight:600;margin-bottom:.5rem}
#speero-personalization-hub .ph-q-ex{display:inline-flex;align-items:center;gap:.375rem;min-height:36px;font-size:.75rem;font-weight:600;color:var(--accent)}
#speero-personalization-hub .ph-q-example{font-size:.8125rem;font-weight:300;color:var(--muted);background:var(--wash-2);border-radius:.75rem;padding:.75rem;margin:.25rem 0 .5rem}
#speero-personalization-hub .ph-answers{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.5rem}
#speero-personalization-hub .ph-answer{min-height:44px;border-radius:.75rem;padding:0 1rem;font-size:.875rem;font-weight:600;background:var(--wash);color:var(--muted);transition:background-color .15s,color .15s}
#speero-personalization-hub .ph-answer:hover{color:var(--ink)}
#speero-personalization-hub .ph-answer[aria-pressed="true"]{background:var(--ink);color:#fff}
#speero-personalization-hub .ph-quiz-foot{display:flex;justify-content:space-between;gap:1rem}
#speero-personalization-hub .ph-results{padding:3rem 0}
#speero-personalization-hub .ph-results-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:1rem}
#speero-personalization-hub .ph-score{font-size:1.25rem}
#speero-personalization-hub .ph-scores{display:grid;gap:.75rem;margin-bottom:1rem}
@media (min-width:768px){#speero-personalization-hub .ph-scores{grid-template-columns:1fr 1fr}}
#speero-personalization-hub .ph-scores section{background:var(--paper);border-radius:1.25rem;padding:1.5rem;box-shadow:var(--shadow)}
#speero-personalization-hub .ph-score-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.75rem}
#speero-personalization-hub .ph-score-n{display:inline-flex;width:2rem;height:2rem;border-radius:50%;align-items:center;justify-content:center;background:var(--navy);color:#fff;font-size:.75rem;font-weight:700}
#speero-personalization-hub .ph-score-v{font-size:1.75rem;font-weight:800}
#speero-personalization-hub .ph-score-v span{font-size:.875rem;font-weight:400;color:var(--muted)}
#speero-personalization-hub .ph-scores h2{font-size:1.25rem;font-weight:800;margin-bottom:.25rem}
#speero-personalization-hub .ph-scores p:last-child{font-size:.875rem;font-weight:300;line-height:1.6}
#speero-personalization-hub .ph-meter{height:6px;border-radius:999px;background:var(--wash);overflow:hidden;margin:1rem 0}
#speero-personalization-hub .ph-meter div{height:100%;background:var(--pink)}
#speero-personalization-hub .ph-scores .ph-start-here{background:var(--navy);color:#fff}
@media (min-width:768px){#speero-personalization-hub .ph-start-here{grid-column:1/-1}}
#speero-personalization-hub .ph-start-here .ph-kicker{color:var(--yellow);margin-bottom:.5rem}
/* explorer and cards */
#speero-personalization-hub .ph-opps{padding-top:3.5rem}
#speero-personalization-hub .ph-filters{margin:2.5rem 0 1.5rem;background:var(--paper);border-radius:1.25rem;padding:1.25rem;box-shadow:var(--shadow);display:grid;gap:1rem}
#speero-personalization-hub .ph-filter-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(10rem,1fr))}
#speero-personalization-hub .ph-field{display:block;font-size:.75rem;font-weight:600}
#speero-personalization-hub .ph-field select,#speero-personalization-hub .ph-field input{display:block;margin-top:.5rem;min-height:44px;width:100%;border-radius:.75rem;border:1px solid var(--line);background:var(--paper);padding:0 .75rem;font-size:.875rem;font-weight:400}
#speero-personalization-hub .ph-results-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;font-size:.875rem;color:var(--muted)}
#speero-personalization-hub .ph-results-bar .ph-textlink{font-size:.75rem}
#speero-personalization-hub .ph-grid-opps{display:grid;gap:1rem}
@media (min-width:768px){#speero-personalization-hub .ph-grid-opps{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){#speero-personalization-hub .ph-grid-opps{grid-template-columns:repeat(3,1fr)}}
#speero-personalization-hub .ph-card-opp{display:flex;flex-direction:column;background:var(--navy);color:#fff;border-radius:1.25rem;padding:1.5rem;text-decoration:none;transition:transform .15s,box-shadow .15s}
#speero-personalization-hub .ph-card-opp:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(0,22,65,.2)}
#speero-personalization-hub .ph-card-kicker{font-size:.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--yellow);margin-bottom:.75rem}
#speero-personalization-hub .ph-card-opp h3{font-size:1.25rem;font-weight:800;line-height:1.25;letter-spacing:-.02em;margin-bottom:.5rem}
#speero-personalization-hub .ph-card-sum{font-size:.875rem;font-weight:300;color:var(--on-ink-muted);margin-bottom:1rem}
#speero-personalization-hub .ph-card-opp dl{display:grid;gap:.25rem;font-size:.8125rem;margin-bottom:1rem}
#speero-personalization-hub .ph-card-opp dt{font-size:.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--pink);margin-top:.5rem}
#speero-personalization-hub .ph-card-opp dd{margin:0;font-weight:300}
#speero-personalization-hub .ph-card-go{margin-top:auto;display:flex;align-items:center;gap:.375rem;font-size:.8125rem;font-weight:600}
#speero-personalization-hub .ph-empty{padding:2rem 0;color:var(--muted)}
#speero-personalization-hub .ph-more{margin:1.5rem auto 0;display:flex}
/* opportunity */
#speero-personalization-hub .ph-opp,#speero-personalization-hub .ph-tool{padding-top:2.5rem;max-width:64rem}
#speero-personalization-hub .ph-back{display:inline-block;font-size:.75rem;font-weight:500;color:var(--muted);text-decoration:none;margin-bottom:1.5rem}
#speero-personalization-hub .ph-back:hover{color:var(--ink)}
#speero-personalization-hub .ph-opp-head .ph-lede{margin-bottom:.5rem}
#speero-personalization-hub .ph-stepnav{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.5rem 0 2rem}
#speero-personalization-hub .ph-stepnav button{display:inline-flex;align-items:center;gap:.5rem;min-height:40px;border-radius:999px;padding:0 .875rem;background:var(--paper);box-shadow:var(--shadow);font-size:.75rem;font-weight:500}
#speero-personalization-hub .ph-stepnav span{color:var(--pink);font-weight:700}
#speero-personalization-hub .ph-step-list{display:grid;gap:1.25rem;max-width:56rem;margin-left:auto;margin-right:auto}
#speero-personalization-hub .ph-step{background:var(--navy);color:#fff;border-radius:1.75rem;padding:1.25rem;scroll-margin-top:8rem;font-size:.9375rem;font-weight:300;line-height:1.625}
@media (min-width:640px){#speero-personalization-hub .ph-step{padding:2rem}}
#speero-personalization-hub .ph-step>*+*{margin-top:1rem}
#speero-personalization-hub .ph-step-head{display:flex;gap:1rem;align-items:center;margin-bottom:1.5rem}
#speero-personalization-hub .ph-step-n{display:inline-flex;flex:none;width:2.5rem;height:2.5rem;border-radius:50%;align-items:center;justify-content:center;background:var(--pink);font-weight:700;font-size:.875rem}
#speero-personalization-hub .ph-step-k{font-size:.6875rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-style:italic;color:var(--yellow)}
#speero-personalization-hub .ph-step h2{font-size:1.5rem;font-weight:800;letter-spacing:-.02em;line-height:1.2}
#speero-personalization-hub .ph-step strong{font-weight:700;color:var(--yellow)}
#speero-personalization-hub .ph-step-note{font-size:.8125rem;color:var(--on-ink-muted)}
#speero-personalization-hub .ph-signals{display:grid;gap:.5rem}
#speero-personalization-hub .ph-signals li{border-radius:.75rem;background:var(--yellow);color:var(--navy);padding:.75rem 1rem;font-size:.875rem;font-weight:500}
#speero-personalization-hub .ph-signals li.is-inferred{background:none;color:#fff;border:1px dashed rgba(255,184,0,.7)}
#speero-personalization-hub .ph-signal-k{font-size:.6875rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
#speero-personalization-hub .ph-step details summary{cursor:pointer;font-size:.8125rem;font-weight:600}
#speero-personalization-hub .ph-step details>*+*{margin-top:.75rem}
#speero-personalization-hub .ph-trio,#speero-personalization-hub .ph-quad{display:grid;gap:.75rem}
@media (min-width:768px){#speero-personalization-hub .ph-trio{grid-template-columns:repeat(3,1fr)}#speero-personalization-hub .ph-quad{grid-template-columns:1fr 1fr}}
#speero-personalization-hub .ph-trio div,#speero-personalization-hub .ph-quad div{border:1px solid rgba(255,255,255,.2);border-radius:1rem;padding:1rem}
#speero-personalization-hub .ph-trio dt,#speero-personalization-hub .ph-quad dt{font-weight:700;color:var(--yellow);margin-bottom:.25rem}
#speero-personalization-hub .ph-trio dd,#speero-personalization-hub .ph-quad dd{margin:0;font-size:.875rem}
#speero-personalization-hub .ph-formats{display:flex;flex-wrap:wrap;gap:.5rem}
#speero-personalization-hub .ph-formats li{border-radius:.75rem;border:1px solid rgba(255,255,255,.25);padding:.5rem 1rem;font-size:.875rem;color:var(--on-ink-muted)}
#speero-personalization-hub .ph-formats li.on{background:var(--pink);border-color:var(--pink);color:#fff;font-weight:700}
#speero-personalization-hub .ph-arms{display:grid;gap:.75rem}
@media (min-width:768px){#speero-personalization-hub .ph-arms{grid-template-columns:repeat(3,1fr)}}
#speero-personalization-hub .ph-arms div{border:1px solid rgba(255,255,255,.2);border-radius:1rem;padding:1rem;font-size:.875rem}
#speero-personalization-hub .ph-arms h3{font-size:1rem;font-weight:700;color:var(--yellow)}
#speero-personalization-hub .ph-arm-note{font-size:.75rem;color:var(--on-ink-muted);margin-bottom:.5rem}
#speero-personalization-hub .ph-bullets{display:grid;gap:.375rem;padding-left:1.1rem!important;list-style:disc!important}
#speero-personalization-hub .ph-opp-tools,#speero-personalization-hub .ph-opp-related{margin-top:3rem}
#speero-personalization-hub .ph-opp-tools h2,#speero-personalization-hub .ph-opp-related h2,#speero-personalization-hub .ph-tool h2{font-size:1.25rem;font-weight:800;letter-spacing:-.02em;margin-bottom:1rem}
#speero-personalization-hub .ph-chips{display:flex;flex-wrap:wrap;gap:.5rem}
#speero-personalization-hub .ph-chip{display:inline-flex;align-items:center;gap:.5rem;min-height:40px;border-radius:999px;background:var(--paper);box-shadow:var(--shadow);padding:.25rem .875rem .25rem .375rem;font-size:.8125rem;font-weight:500;text-decoration:none}
#speero-personalization-hub span.ph-chip{padding:.25rem .875rem}
#speero-personalization-hub a.ph-chip:hover{box-shadow:var(--shadow-hover)}
#speero-personalization-hub .ph-prevnext{display:flex;justify-content:space-between;gap:1rem;margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--line);font-size:.875rem;font-weight:500}
#speero-personalization-hub .ph-prevnext a{text-decoration:none;max-width:45%}
#speero-personalization-hub .ph-prevnext a:last-child{text-align:right}
#speero-personalization-hub .ph-prevnext a:hover{text-decoration:underline}
/* tools */
#speero-personalization-hub .ph-tools,#speero-personalization-hub .ph-compare{padding-top:3.5rem}
#speero-personalization-hub .ph-search{position:relative;display:block;margin-bottom:1.25rem;max-width:none}
#speero-personalization-hub .ph-search input{width:100%;min-height:48px;border-radius:999px;border:0;background:var(--paper);box-shadow:var(--shadow);padding:0 3rem 0 2.75rem;font-size:.875rem}
#speero-personalization-hub .ph-search-ico{position:absolute;left:1rem;top:50%;width:1rem;height:1rem;transform:translateY(-50%);color:var(--hint)}
#speero-personalization-hub .ph-search kbd{position:absolute;right:1rem;top:50%;transform:translateY(-50%);font:inherit;font-size:.75rem;color:var(--hint);border:1px solid var(--line);border-radius:.375rem;padding:0 .375rem}
#speero-personalization-hub .ph-count{font-size:.875rem;color:var(--muted);margin:.5rem 0}
#speero-personalization-hub .ph-limit{font-size:.75rem;font-weight:600;color:var(--warn);min-height:1rem;margin-bottom:.75rem}
#speero-personalization-hub .ph-grid-tools{display:grid;gap:1rem}
@media (min-width:768px){#speero-personalization-hub .ph-grid-tools{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){#speero-personalization-hub .ph-grid-tools:not(.ph-grid-2){grid-template-columns:repeat(3,1fr)}}
#speero-personalization-hub .ph-card-tool{display:flex;flex-direction:column;gap:.75rem;background:var(--paper);border-radius:1.25rem;padding:1.5rem;box-shadow:var(--shadow);font-size:.875rem;font-weight:300;line-height:1.6}
#speero-personalization-hub .ph-card-role{font-size:.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
#speero-personalization-hub .ph-card-tool-head{display:flex;align-items:center;gap:.75rem}
#speero-personalization-hub .ph-card-tool h3{font-size:1.125rem;font-weight:700;line-height:1.3}
#speero-personalization-hub .ph-src{font-size:.75rem;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
#speero-personalization-hub .ph-connected{font-size:.75rem;color:var(--muted)}
#speero-personalization-hub .ph-card-tool-foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-top:.5rem;border-top:1px solid var(--line);font-weight:600}
#speero-personalization-hub .ph-card-tool-foot a,#speero-personalization-hub .ph-card-tool>a:last-child{text-decoration:none;font-weight:600;color:var(--accent)}
#speero-personalization-hub .ph-cmp{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;cursor:pointer;font-size:.8125rem;font-weight:500}
#speero-personalization-hub .ph-cmp.is-off{color:var(--muted);cursor:not-allowed}
#speero-personalization-hub .ph-cmp input{width:1rem;height:1rem;accent-color:var(--ink)}
#speero-personalization-hub .ph-tray{position:sticky;bottom:1rem;z-index:5;margin-top:1.5rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;background:var(--ink);color:#fff;border-radius:1rem;padding:.75rem 1.25rem;font-size:.875rem;box-shadow:0 10px 26px rgba(0,22,65,.25)}
#speero-personalization-hub .ph-tray a{color:var(--yellow);font-weight:600}
#speero-personalization-hub .ph-tool-head{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}
#speero-personalization-hub .ph-tool-head .ph-display{margin:0}
#speero-personalization-hub .ph-tool>.ph-lede{max-width:42rem;font-size:1.125rem;line-height:1.75rem;margin-bottom:.5rem}
#speero-personalization-hub .ph-claim{margin:1.5rem 0 0;border-left:3px solid var(--pink);background:var(--paper);border-radius:0 1rem 1rem 0;padding:1rem 1.25rem;font-size:.875rem;font-weight:300;line-height:1.6}
#speero-personalization-hub .ph-claim-k{font-size:.6875rem;font-weight:700;letter-spacing:.08em;color:var(--pink);margin-bottom:.5rem}
#speero-personalization-hub .ph-claim a{display:inline-block;margin-top:.5rem;font-size:.75rem;color:var(--muted)}
#speero-personalization-hub .ph-tool .ph-actions{margin:1.5rem 0 .5rem}
#speero-personalization-hub .ph-two{display:grid;gap:1rem;margin-top:1rem}
@media (min-width:768px){#speero-personalization-hub .ph-two{grid-template-columns:1fr 1fr}}
#speero-personalization-hub .ph-two section,#speero-personalization-hub .ph-tool-sec{background:var(--paper);border-radius:1.25rem;padding:1.5rem;box-shadow:var(--shadow);font-size:.875rem;font-weight:300;line-height:1.6}
#speero-personalization-hub .ph-tool-sec{margin-top:1rem}
#speero-personalization-hub .ph-tool-sec h2+p,#speero-personalization-hub .ph-tool-sec p+h2{margin-bottom:1.25rem}
#speero-personalization-hub .ph-tool-sec .ph-chip{box-shadow:none;background:var(--wash)}
#speero-personalization-hub .ph-apps{display:grid;gap:.75rem}
@media (min-width:768px){#speero-personalization-hub .ph-apps{grid-template-columns:1fr 1fr}}
#speero-personalization-hub .ph-app{background:var(--wash-2);border-radius:1rem;padding:1rem}
#speero-personalization-hub .ph-app-name{font-weight:700}
#speero-personalization-hub .ph-app a{display:inline-block;margin-top:.5rem;font-weight:600;color:var(--accent);text-decoration:none}
#speero-personalization-hub .ph-table-wrap{overflow-x:auto;margin-top:1.5rem;border-radius:1.25rem;box-shadow:var(--shadow);background:var(--paper)}
#speero-personalization-hub .ph-table{width:100%;border-collapse:collapse;font-size:.8125rem;line-height:1.55;min-width:42rem}
#speero-personalization-hub .ph-table th,#speero-personalization-hub .ph-table td{text-align:left;vertical-align:top;padding:1rem;border-bottom:1px solid var(--line)}
#speero-personalization-hub .ph-table tbody th{width:10rem;font-weight:600;color:var(--muted)}
#speero-personalization-hub .ph-table td{font-weight:300}
#speero-personalization-hub .ph-table thead a{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;text-decoration:none}
#speero-personalization-hub .ph-compare-empty>p{margin:1.5rem 0 1rem;color:var(--muted)}
#speero-personalization-hub .ph-grid-pick{display:grid;gap:.75rem}
@media (min-width:768px){#speero-personalization-hub .ph-grid-pick{grid-template-columns:repeat(3,1fr)}}
#speero-personalization-hub .ph-pick{text-align:left;background:var(--paper);border-radius:1rem;padding:1rem;box-shadow:var(--shadow);transition:box-shadow .15s}
#speero-personalization-hub .ph-pick:hover{box-shadow:var(--shadow-hover)}
#speero-personalization-hub .ph-pick-name{display:flex;align-items:center;gap:.5rem;font-weight:700;font-size:.875rem;margin-bottom:.375rem}
#speero-personalization-hub .ph-pick-sum{font-size:.75rem;font-weight:300;color:var(--muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
/* explore */
#speero-personalization-hub .ph-explore{padding-top:3.5rem}
#speero-personalization-hub .ph-explore-head{display:grid;gap:1rem;align-items:end;margin-bottom:1.5rem}
@media (min-width:1024px){#speero-personalization-hub .ph-explore-head{grid-template-columns:1fr 1fr}}
#speero-personalization-hub .ph-tabs{display:flex;flex-wrap:wrap;gap:1.5rem;border-bottom:1px solid var(--line);margin-bottom:1.5rem}
#speero-personalization-hub .ph-tabs button{display:flex;align-items:center;gap:.5rem;padding-bottom:.875rem;min-height:44px;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px}
#speero-personalization-hub .ph-tabs button[aria-pressed="true"]{color:var(--ink);font-weight:600;border-color:var(--ink)}
#speero-personalization-hub .ph-tabs span{border-radius:999px;padding:.125rem .5rem;font-size:.75rem;font-weight:600;background:var(--wash)}
#speero-personalization-hub .ph-tabs [aria-pressed="true"] span{background:var(--ink);color:#fff}
#speero-personalization-hub .ph-explore-body{display:grid;gap:2rem}
@media (min-width:1024px){#speero-personalization-hub .ph-explore-body{grid-template-columns:16rem 1fr}}
#speero-personalization-hub .ph-aside{display:grid;gap:1.25rem;align-content:start;font-size:.875rem}
#speero-personalization-hub .ph-aside-top{display:flex;justify-content:space-between;align-items:center;font-weight:700}
#speero-personalization-hub .ph-aside fieldset{border:0;display:grid;gap:.25rem}
#speero-personalization-hub .ph-aside legend{font-size:.75rem;font-weight:600;color:var(--muted);margin-bottom:.5rem}
#speero-personalization-hub .ph-aside label:not(.ph-field){display:flex;align-items:center;gap:.5rem;min-height:36px;cursor:pointer}
#speero-personalization-hub .ph-aside input[type=radio]{accent-color:var(--ink)}
#speero-personalization-hub .ph-principle{background:var(--navy);color:#fff;border-radius:1.25rem;padding:1.25rem;font-size:.8125rem;font-weight:300}
#speero-personalization-hub .ph-principle-k{font-size:.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--yellow);margin-bottom:.5rem}
#speero-personalization-hub .ph-principle-h{font-weight:700;font-size:1rem;margin-bottom:.25rem}
#speero-personalization-hub .ph-explore-count{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem;font-size:.875rem;margin-bottom:.75rem}
#speero-personalization-hub .ph-explore-count span:first-child{font-weight:700}
#speero-personalization-hub .ph-explore-count span+span{color:var(--muted)}
/* guide, research, blueprints, 404 */
#speero-personalization-hub .ph-page-hero{padding:3.5rem 0 2rem}
#speero-personalization-hub .ph-page-hero .ph-kicker{margin-bottom:1rem}
#speero-personalization-hub .ph-page-hero .ph-lede a{color:var(--accent)}
#speero-personalization-hub .ph-guide{max-width:56rem}
#speero-personalization-hub .ph-guide .ph-small{margin:.5rem 0 1rem}
#speero-personalization-hub .ph-guide-steps{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem}
#speero-personalization-hub .ph-guide-steps .ph-pill{min-height:36px;font-weight:600;background:var(--wash);color:var(--muted)}
#speero-personalization-hub .ph-guide-steps .ph-pill.on{background:var(--ink);color:#fff}
#speero-personalization-hub .ph-opts{display:grid;gap:.75rem}
@media (min-width:640px){#speero-personalization-hub .ph-opts{grid-template-columns:repeat(2,1fr)}}
#speero-personalization-hub .ph-opt{text-align:left;border-radius:.75rem;padding:1rem;background:var(--paper);box-shadow:var(--shadow);transition:box-shadow .15s,transform .15s}
#speero-personalization-hub .ph-opt:hover{transform:translateY(-1px);box-shadow:var(--shadow-hover)}
#speero-personalization-hub .ph-opt.on{background:var(--accent-soft);box-shadow:0 0 0 2px var(--accent)}
#speero-personalization-hub .ph-opt-l{font-weight:600}
#speero-personalization-hub .ph-opt-b{font-size:.8125rem;font-weight:300;color:var(--muted);margin-top:.25rem}
#speero-personalization-hub .ph-card-plain{display:flex;flex-direction:column;gap:.5rem;background:var(--paper);border-radius:1.25rem;padding:1.25rem;box-shadow:var(--shadow);text-decoration:none;font-size:.875rem;font-weight:300}
#speero-personalization-hub .ph-card-plain .ph-card-kicker{color:var(--pink);margin:0}
#speero-personalization-hub .ph-card-title{font-weight:700;font-size:1rem}
#speero-personalization-hub .ph-myths{display:grid;gap:1rem}
@media (min-width:768px){#speero-personalization-hub .ph-myths{grid-template-columns:1fr 1fr}}
#speero-personalization-hub .ph-myths article{background:var(--paper);border-radius:1.25rem;padding:1.5rem;box-shadow:var(--shadow);font-size:.875rem;font-weight:300;line-height:1.6}
#speero-personalization-hub .ph-myths h2{font-size:1.125rem;font-weight:700;margin-bottom:.5rem;text-decoration:line-through;text-decoration-color:var(--pink)}
#speero-personalization-hub .ph-myth-t{font-weight:600;margin-bottom:.5rem}
#speero-personalization-hub .ph-bp{margin-top:2.5rem}
#speero-personalization-hub .ph-canvas{display:grid;gap:.75rem}
@media (min-width:768px){#speero-personalization-hub .ph-canvas{grid-template-columns:repeat(3,1fr)}}
#speero-personalization-hub .ph-canvas div{background:var(--ink);color:#fff;border-radius:1.25rem;padding:1.5rem}
#speero-personalization-hub .ph-canvas div.is-pink{background:var(--pink)}
#speero-personalization-hub .ph-canvas-k{font-size:.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;opacity:.8;margin-bottom:.5rem}
#speero-personalization-hub .ph-gantt{display:grid;gap:1.25rem;background:var(--paper);border-radius:1.25rem;padding:1.5rem;box-shadow:var(--shadow)}
#speero-personalization-hub .ph-gantt-row{display:grid;gap:.75rem}
@media (min-width:768px){#speero-personalization-hub .ph-gantt-row{grid-template-columns:12rem 1fr}}
#speero-personalization-hub .ph-gantt-name{font-weight:700;font-size:.875rem}
#speero-personalization-hub .ph-gantt-track{position:relative;height:1.75rem;background:var(--wash-2);border-radius:.25rem;margin-bottom:.375rem}
#speero-personalization-hub .ph-gantt-bar{position:absolute;top:0;height:1.75rem;border-radius:.25rem;background:var(--ink)}
#speero-personalization-hub .ph-gantt-bar.is-pink{background:var(--pink)}
#speero-personalization-hub .ph-gantt-bar.is-plum{background:#805779}
#speero-personalization-hub .ph-404{padding:5rem 0}
#speero-personalization-hub .ph-404 a{color:var(--accent);font-weight:600;font-size:.875rem}
@media (max-width:640px){
#speero-personalization-hub .ph-answers{grid-template-columns:1fr}
#speero-personalization-hub .ph-qsteps{grid-template-columns:1fr 1fr}
}
/* ---- matched to the prototype in QA ---- */
#speero-personalization-hub .ph-hero-wide{max-width:56rem}
#speero-personalization-hub .ph-page-hero .ph-kicker{color:var(--accent)}
#speero-personalization-hub .ph-page-hero .ph-lede{max-width:36rem}
#speero-personalization-hub .ph-btn-sm{min-height:40px;padding:.5rem .875rem;font-size:.8125rem;font-weight:500}
/* A secondary button beside a primary one matches its size, so the pair lines up */
#speero-personalization-hub .ph-actions .ph-btn-hl ~ .ph-btn-outline{padding:.875rem 1.5rem;font-size:1.125rem;font-weight:600}
/* assess: levels */
#speero-personalization-hub .ph-levels-head h2{max-width:20rem}
#speero-personalization-hub .ph-levels-head .ph-small{font-size:.875rem}
#speero-personalization-hub .ph-levels li{border-radius:.75rem;border-top:3px solid var(--yellow)}
/* assess: quiz */
#speero-personalization-hub .ph-quiz{max-width:none}
#speero-personalization-hub .ph-quiz .ph-display{max-width:none}
@media (min-width:768px){#speero-personalization-hub .ph-qs{grid-template-columns:1fr 1fr}}
#speero-personalization-hub .ph-q-n{font-size:.6875rem;font-weight:400;color:var(--hint)}
#speero-personalization-hub .ph-q-text{font-size:.875rem}
#speero-personalization-hub .ph-q-ex{color:var(--muted);font-weight:400}
#speero-personalization-hub .ph-q-example{background:none;padding:0;margin:.25rem 0 .75rem}
#speero-personalization-hub .ph-answers{display:flex;flex-wrap:wrap}
#speero-personalization-hub .ph-answer{min-height:40px;padding:0 .75rem;font-size:.8125rem}
#speero-personalization-hub .ph-quiz-foot{align-items:center}
#speero-personalization-hub .ph-quiz-foot .ph-btn-solid:disabled{background:var(--hint);opacity:1}
/* assess: results */
#speero-personalization-hub .ph-scores section{background:var(--navy);color:#fff;box-shadow:none}
#speero-personalization-hub .ph-score-n{background:var(--pink)}
#speero-personalization-hub .ph-score-v span{color:var(--on-ink-muted)}
#speero-personalization-hub .ph-scores h2{color:var(--yellow)}
#speero-personalization-hub .ph-scores .ph-small{color:#fff;font-weight:600;font-size:.8125rem}
#speero-personalization-hub .ph-scores .ph-meter{background:rgba(255,255,255,.15)}
#speero-personalization-hub .ph-scores .ph-meter div{background:var(--yellow)}
#speero-personalization-hub .ph-scores p:last-child{color:var(--on-ink-muted)}
#speero-personalization-hub .ph-scores .ph-start-here{background:var(--yellow-bg);color:var(--ink);border:1px solid var(--yellow)}
#speero-personalization-hub .ph-start-here .ph-kicker{color:var(--pink)}
#speero-personalization-hub .ph-scores .ph-start-here h2{color:var(--ink)}
#speero-personalization-hub .ph-scores .ph-start-here p:last-child{color:var(--muted)}
#speero-personalization-hub .ph-results .ph-lede-sm{max-width:48rem}
/* opportunity cards */
#speero-personalization-hub .ph-card-opp dt{text-transform:none;letter-spacing:0;font-size:.75rem;font-weight:600;color:var(--yellow)}
#speero-personalization-hub .ph-card-go{justify-content:space-between;padding-top:1rem;border-top:1px solid rgba(255,255,255,.15)}
@media (min-width:768px){#speero-personalization-hub .ph-opp-related .ph-grid-opps{grid-template-columns:repeat(3,1fr)}}
#speero-personalization-hub .ph-opp-related .ph-card-opp h3{font-size:1.125rem}
/* opportunity detail */
#speero-personalization-hub .ph-opp,#speero-personalization-hub .ph-tool{max-width:none}
#speero-personalization-hub .ph-signals{display:flex;flex-wrap:wrap}
#speero-personalization-hub .ph-step details{border-top:1px solid rgba(255,255,255,.15);padding-top:1rem}
#speero-personalization-hub .ph-step>p strong+*,#speero-personalization-hub .ph-step>p:has(strong){font-size:1rem;font-weight:400}
#speero-personalization-hub .ph-opp-tools,#speero-personalization-hub .ph-opp-related{padding-top:2rem;border-top:1px solid var(--line)}
#speero-personalization-hub .ph-opp-tools h2,#speero-personalization-hub .ph-opp-related h2{font-size:1.5rem}
#speero-personalization-hub .ph-prevnext{border-top:0}
/* tools */
#speero-personalization-hub .ph-src{text-decoration:none}
#speero-personalization-hub .ph-back{color:var(--accent);font-weight:600}
#speero-personalization-hub .ph-claim{border-left:0;border-radius:1rem;box-shadow:var(--shadow);max-width:44rem}
#speero-personalization-hub .ph-claim-k{color:var(--muted);font-size:.625rem}
#speero-personalization-hub .ph-claim a{color:var(--accent);font-weight:600;text-decoration:none}
#speero-personalization-hub .ph-tool-best{background:var(--navy);color:#fff;box-shadow:none}
#speero-personalization-hub .ph-tool-plain{margin-top:2rem;font-size:.875rem}
#speero-personalization-hub .ph-tool-plain .ph-chip{min-height:0;border-radius:.375rem;background:var(--wash);box-shadow:none;padding:.25rem .625rem;font-size:.75rem}
#speero-personalization-hub .ph-tool-plain .ph-app{background:var(--paper);box-shadow:var(--shadow)}
#speero-personalization-hub .ph-table thead th{background:var(--wash)}
#speero-personalization-hub .ph-table tbody th{color:var(--ink);font-weight:700;background:var(--wash-2)}
#speero-personalization-hub .ph-compare .ph-actions{margin-top:1rem}
/* explore */
#speero-personalization-hub .ph-limit{color:var(--muted);font-weight:400}
#speero-personalization-hub .ph-aside legend,#speero-personalization-hub .ph-aside .ph-field>span{font-size:.625rem;letter-spacing:.08em;text-transform:uppercase}
@media (min-width:1024px){#speero-personalization-hub .ph-explore-head .ph-search{justify-self:end;width:100%;max-width:20rem;margin:0}}
/* research, blueprints */
#speero-personalization-hub .ph-myths{grid-template-columns:1fr!important;max-width:56rem}
#speero-personalization-hub .ph-myths h2{text-decoration:none;font-size:1rem}
#speero-personalization-hub .ph-myth-t{font-size:.875rem}
#speero-personalization-hub .ph-myths article>p:last-child{font-size:.75rem;color:var(--muted)}
#speero-personalization-hub .ph-canvas div{background:none;padding:0;border-radius:0}
#speero-personalization-hub .ph-canvas>div{background:var(--ink);padding:1.25rem;border-radius:.75rem;font-size:.875rem;font-weight:300}
#speero-personalization-hub .ph-canvas>div.is-pink{background:var(--pink)}
#speero-personalization-hub .ph-canvas-k{font-size:.625rem;font-weight:600;opacity:.75}
/* Matched to the prototype's computed styles at 1280px (generated, then reviewed). */
#speero-personalization-hub .is-pink{border-radius:20px;padding:24px}
#speero-personalization-hub .is-pink p{line-height:22.75px}
#speero-personalization-hub .ph-app{border-radius:8px;padding:20px}
#speero-personalization-hub .ph-app a{line-height:20px}
#speero-personalization-hub .ph-app p{color:rgb(88, 99, 115);font-weight:300;line-height:20px}
#speero-personalization-hub .ph-arms h3{line-height:24px}
#speero-personalization-hub .ph-arms p{font-weight:400}
#speero-personalization-hub .ph-aside label{font-weight:400;line-height:20px}
#speero-personalization-hub .ph-aside-top span{font-size:17px;line-height:26.35px}
#speero-personalization-hub .ph-bullets li{font-size:14px}
#speero-personalization-hub .ph-canvas p{line-height:22.75px}
#speero-personalization-hub .ph-card-go span{font-size:14px;line-height:20px}
#speero-personalization-hub .ph-card-opp dd{color:rgb(197, 205, 216);font-size:14px;font-weight:400;line-height:22.75px}
#speero-personalization-hub .ph-card-opp dt{font-weight:700;line-height:16px}
#speero-personalization-hub .ph-card-opp h3{font-size:20px;letter-spacing:-0.76px;line-height:27.5px}
#speero-personalization-hub .ph-card-tool h3{line-height:28px}
#speero-personalization-hub .ph-card-tool p{color:rgb(88, 99, 115)}
#speero-personalization-hub .ph-card-tool-foot a{line-height:20px}
#speero-personalization-hub .ph-card-tool-head h3{line-height:28px}
#speero-personalization-hub .ph-checks li{line-height:22.75px}
#speero-personalization-hub .ph-claim{border-radius:8px}
#speero-personalization-hub .ph-claim a{font-size:14px;line-height:20px}
#speero-personalization-hub .ph-claim p{color:rgb(88, 99, 115);line-height:22.75px}
#speero-personalization-hub .ph-compare-empty p{line-height:24.8px}
#speero-personalization-hub .ph-formats li{font-weight:400;line-height:20px}
#speero-personalization-hub .ph-levels h3{font-size:14px;line-height:20px}
#speero-personalization-hub .ph-levels p{font-weight:500;line-height:16px}
#speero-personalization-hub .ph-myths h2{font-size:18px;font-weight:600;line-height:28px}
#speero-personalization-hub .ph-myths p{font-size:14px;line-height:22.75px}
#speero-personalization-hub .ph-opp-related h2{font-weight:700;letter-spacing:normal;line-height:37.2px}
#speero-personalization-hub .ph-opp-tools h2{font-weight:700;letter-spacing:normal;line-height:37.2px}
#speero-personalization-hub .ph-pick{border-radius:8px}
#speero-personalization-hub .ph-pillars h3{font-size:18px;font-weight:700;line-height:28px}
#speero-personalization-hub .ph-prevnext a{font-weight:400;line-height:20px}
#speero-personalization-hub .ph-principle div{color:rgb(124, 132, 128)}
#speero-personalization-hub .ph-quad dt{font-size:16px;line-height:24.8px}
#speero-personalization-hub .ph-results-bar p{line-height:20px}
#speero-personalization-hub .ph-startcard{padding:28px}
#speero-personalization-hub .ph-step{border-radius:28px}
#speero-personalization-hub .ph-step strong{font-size:17px;line-height:27.625px}
#speero-personalization-hub .ph-step summary{font-size:14px;line-height:20px}
#speero-personalization-hub .ph-step-head h2{letter-spacing:-0.912px;line-height:37.2px}
#speero-personalization-hub .ph-tool-plain h2{font-size:18px;font-weight:700;letter-spacing:normal;line-height:28px}
#speero-personalization-hub .ph-tool-sec{border-radius:8px}
#speero-personalization-hub .ph-tool-sec h2{font-size:18px;font-weight:700;letter-spacing:normal;line-height:28px}
#speero-personalization-hub .ph-tool-sec p{font-size:16px;line-height:24.8px}
#speero-personalization-hub .ph-trio dt{font-size:16px;line-height:24.8px}
#speero-personalization-hub .ph-two h2{font-size:18px;font-weight:700;letter-spacing:normal;line-height:28px}
#speero-personalization-hub a.ph-back{font-size:14px;font-weight:500;line-height:20px}
#speero-personalization-hub a.ph-btn{font-weight:600}
#speero-personalization-hub a.ph-chip{border-radius:12px;font-size:14px;font-weight:400;line-height:20px}
#speero-personalization-hub a.ph-src{color:rgb(124, 132, 128);font-size:13px;font-weight:500;line-height:20.15px}
#speero-personalization-hub button.ph-btn{font-weight:600}
#speero-personalization-hub div.ph-app-name{font-size:16px;line-height:24.8px}
#speero-personalization-hub div.ph-canvas-k{font-size:12px;letter-spacing:0.96px;line-height:16px}
#speero-personalization-hub div.ph-card-role{line-height:17.05px}
#speero-personalization-hub div.ph-claim-k{color:rgb(124, 132, 128);font-size:11px;letter-spacing:0.88px;line-height:17.05px}
#speero-personalization-hub div.ph-connected{color:rgb(138, 144, 150);font-size:13px;line-height:20.15px}
#speero-personalization-hub div.ph-gantt-name{font-size:16px;line-height:24.8px}
#speero-personalization-hub div.ph-kicker{line-height:16px}
#speero-personalization-hub div.ph-opt-l{line-height:24.8px}
#speero-personalization-hub div.ph-pick-name{font-size:16px;line-height:24.8px}
#speero-personalization-hub div.ph-pick-sum{font-size:14px;line-height:20px}
#speero-personalization-hub div.ph-principle-h{color:rgb(20, 40, 68);font-size:20px;font-weight:600;line-height:27.5px}
#speero-personalization-hub div.ph-principle-k{color:rgb(88, 99, 115);line-height:17.05px}
#speero-personalization-hub div.ph-small{color:rgb(124, 132, 128);font-weight:400;line-height:16px}
#speero-personalization-hub label.ph-cmp{font-size:14px;font-weight:400;line-height:20px}
#speero-personalization-hub li.on{line-height:20px}
#speero-personalization-hub p.ph-arm-note{font-weight:400;line-height:16px}
#speero-personalization-hub p.ph-card-kicker{font-size:12px;letter-spacing:0.96px;line-height:16px}
#speero-personalization-hub p.ph-card-sum{line-height:22.75px}
#speero-personalization-hub p.ph-count{line-height:20px}
#speero-personalization-hub p.ph-kicker{line-height:16px}
#speero-personalization-hub p.ph-lede{font-size:17px;line-height:27.625px}
#speero-personalization-hub p.ph-meta{font-size:14px;font-weight:500;line-height:20px}
#speero-personalization-hub p.ph-myth-t{font-size:16px;font-weight:500;line-height:24.8px}
#speero-personalization-hub p.ph-pillars-d{font-weight:400}
#speero-personalization-hub p.ph-pillars-label{line-height:20px}
#speero-personalization-hub p.ph-pillars-q{line-height:24.8px}
#speero-personalization-hub p.ph-signal-k{font-size:12px;font-weight:600;letter-spacing:normal;line-height:16px}
#speero-personalization-hub p.ph-small{font-size:14px}
#speero-personalization-hub p.ph-startcard-h{color:rgb(20, 40, 68);line-height:28px}
#speero-personalization-hub p.ph-step-k{font-size:12px;letter-spacing:0.96px;line-height:16px}
#speero-personalization-hub p.ph-step-note{font-weight:400}
#speero-personalization-hub p.ph-steps-label{line-height:16px}
#speero-personalization-hub p.ph-steps-note{line-height:19.5px}
#speero-personalization-hub p.ph-steps-win{line-height:20px}
#speero-personalization-hub span.ph-badge{line-height:17.05px}
#speero-personalization-hub span.ph-chip{border-radius:4px;font-size:14px;font-weight:400;line-height:20px}
#speero-personalization-hub span.ph-logo-name{line-height:13.95px}
/* Layout and card shapes matched to the prototype at 1280px */
@media (min-width:1100px){#speero-personalization-hub .ph-grid-opps,#speero-personalization-hub .ph-grid-tools:not(.ph-grid-2){grid-template-columns:repeat(2,1fr)}}
#speero-personalization-hub .ph-grid-opps,#speero-personalization-hub .ph-grid-tools{gap:1.25rem}
#speero-personalization-hub .ph-levels li{border-radius:0;padding:1rem;box-shadow:none;border-top:2px solid var(--yellow)}
#speero-personalization-hub .ph-signals li{border-radius:1.25rem}
#speero-personalization-hub .ph-trio div,#speero-personalization-hub .ph-quad div{border:1px dashed rgba(255,184,0,.6);border-radius:1.25rem}
#speero-personalization-hub .ph-arms div{border-color:rgba(255,255,255,.25);border-radius:1.25rem}
#speero-personalization-hub .ph-two section,#speero-personalization-hub .ph-tool-sec{border-radius:.5rem;box-shadow:none;border:1px solid var(--line)}
#speero-personalization-hub .ph-bullets li{color:var(--muted);line-height:20px}
#speero-personalization-hub .ph-myths{grid-template-columns:1fr}
#speero-personalization-hub .ph-myths article{border-radius:1.25rem;padding:1.75rem}
#speero-personalization-hub .ph-myths article p:last-child{font-size:14px}
#speero-personalization-hub .ph-canvas>div{border-radius:1.25rem;padding:1.5rem}
#speero-personalization-hub .ph-canvas>div div{padding:0;border-radius:0;background:none}
#speero-personalization-hub .ph-gantt{background:none;border-radius:0;padding:0;box-shadow:none}
#speero-personalization-hub .ph-opp-tools a.ph-chip{padding:8px 12px}
#speero-personalization-hub .ph-tool-plain span.ph-chip{padding:2px 8px;border-radius:4px;font-size:14px}
#speero-personalization-hub div.ph-connected{padding-top:12px}
#speero-personalization-hub .ph-myths{max-width:none}
#speero-personalization-hub .ph-tool-sec.ph-tool-best{background:var(--ink);border-color:var(--ink)}
#speero-personalization-hub .ph-step summary{font-size:14px}
#speero-personalization-hub .ph-claim{max-width:42rem}
#speero-personalization-hub .ph-page-hero .ph-lede{max-width:42rem}