:root{--ink:#24352c;--muted:#5f695f;--line:#cbbeaa;--paper:#fbf8f1;--wash:#eee7da;--blue:#355e4b;--navy:#2e493a;--mint:#dce4d4;--green:#46633f;--amber:#efe4d2;--radius:18px;--shadow:0 16px 45px rgba(57,48,35,.12)}
*{box-sizing:border-box}html,body{max-width:100%;overflow-x:hidden}body{margin:0;color:var(--ink);background:linear-gradient(#edf4ff 0 310px,var(--wash) 310px);font-family:Tahoma,"Noto Sans Thai",system-ui,sans-serif;line-height:1.55}.shell{width:min(1120px,calc(100% - 32px));margin-inline:auto}.hero{padding:44px 0 76px;color:#fff;background:linear-gradient(120deg,#0b2140 0%,#123f78 62%,#1762b7 100%)}.hero-inner{display:flex;justify-content:space-between;align-items:flex-start;gap:30px}.kicker,.step{margin:0 0 5px;color:#70a6ff;font-size:.75rem;font-weight:800;letter-spacing:.13em}.hero h1{margin:0;font-size:clamp(2rem,6vw,4.1rem);line-height:1.05;letter-spacing:-.04em}.hero h1 span{color:#8fd7ff}.hero-copy{max-width:570px;margin:16px 0 0;color:#d8e7f8}.full-link{flex:none;padding:10px 14px;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:999px;text-decoration:none;font-weight:700}.input-card,.results{position:relative;margin-top:-38px;padding:26px;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.results{margin-top:24px}.section-title,.subheading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.section-title h2,.subheading h3{margin:0;color:var(--navy)}.section-title h2{font-size:1.55rem}.subheading h3{font-size:1.2rem}.status{margin:6px 0 0;color:var(--green);font-size:.83rem;font-weight:700}.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:22px}.field{display:block;min-width:0}.field>span,.group-label{display:block;margin-bottom:6px;font-size:.88rem;font-weight:700}.field b,.group-label b{color:#ca3c3c}.field small{color:var(--muted);font-size:.72rem;font-weight:400}.field em{display:block;margin-top:5px;color:var(--muted);font-size:.72rem;font-style:normal}input,select{width:100%;min-width:0;min-height:46px;padding:9px 11px;color:var(--ink);background:#fff;border:1px solid #aebac8;border-radius:10px;font:inherit}input:focus,select:focus,summary:focus-visible,a:focus-visible{outline:3px solid rgba(21,94,239,.2);outline-offset:2px;border-color:var(--blue)}.date-group{grid-column:span 2}.date-inputs{display:grid;grid-template-columns:1.15fr 1fr .75fr;gap:8px}.date-inputs label span{display:block;margin-bottom:4px;color:var(--muted);font-size:.7rem}.suffix{display:flex}.suffix input{border-radius:10px 0 0 10px}.suffix i{display:grid;place-items:center;flex:none;padding:0 11px;color:var(--muted);background:#eef2f6;border:1px solid #aebac8;border-left:0;border-radius:0 10px 10px 0;font-size:.82rem;font-style:normal}.errors{margin-top:16px;padding:12px 14px;color:#8e2929;background:#fff0f0;border:1px solid #efb6b6;border-radius:10px}.assumptions{margin-top:20px;padding:12px 15px;background:#f7f9fc;border:1px solid var(--line);border-radius:12px}.assumptions summary,.all-raises summary{cursor:pointer;color:var(--navy);font-weight:800}.assumptions ul{margin:10px 0 0;padding-left:20px;color:var(--muted);font-size:.84rem}.result-title{margin-bottom:18px}.badge{padding:7px 11px;color:#7a5500;background:var(--amber);border-radius:999px;font-size:.78rem;font-weight:800}.headline-grid{display:grid;grid-template-columns:1.25fr 1fr 1.15fr;gap:12px}.headline,.quick-grid article{min-width:0;padding:17px;background:#f8fafc;border:1px solid var(--line);border-radius:14px}.headline.primary{color:#fff;background:linear-gradient(130deg,var(--blue),#0f7bc7);border:0}.headline span,.headline small,.quick-grid span{display:block;color:var(--muted);font-size:.76rem}.headline.primary span,.headline.primary small{color:#dbeaff}.headline strong{display:block;margin:5px 0;font-size:clamp(1.35rem,4vw,2rem);overflow-wrap:anywhere}.quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:10px}.quick-grid strong{display:block;margin-top:5px;color:var(--navy);font-size:.95rem;overflow-wrap:anywhere}.path-section,.salary-section{margin-top:30px}.subheading p{margin:3px 0 0;color:var(--muted);font-size:.8rem}.career-path{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;margin:16px 0 0;padding:0;list-style:none}.career-path li{position:relative;min-width:0;padding:14px;background:#f8fafc;border:1px solid var(--line);border-radius:13px}.career-path li.active{background:#edf4ff;border-color:#94b9ff}.career-path .rank{display:block;color:var(--blue);font-weight:900}.career-path time,.career-path small{display:block;margin-top:5px;color:var(--muted);font-size:.75rem;overflow-wrap:anywhere}.career-path strong{display:block;margin-top:8px;color:var(--navy);font-size:1.05rem}.salary-story{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:16px}.story-card{display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px;min-width:0;padding:15px;background:#fff;border:1px solid var(--line);border-radius:14px}.story-card .when{color:var(--blue);font-size:.78rem;font-weight:800}.story-card h4{margin:0 0 5px;color:var(--navy)}.story-money{display:flex;flex-wrap:wrap;gap:7px 14px}.story-money span{color:var(--muted);font-size:.76rem}.story-money strong{display:block;color:var(--ink);font-size:1rem}.story-card p{grid-column:2;margin:4px 0 0;color:var(--muted);font-size:.76rem}.all-raises{margin-top:24px;border-top:1px solid var(--line)}.all-raises summary{padding:18px 0}.raise-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding-bottom:6px}.raise-item{min-width:0;padding:13px;background:#f8fafc;border:1px solid var(--line);border-radius:12px}.raise-top{display:flex;justify-content:space-between;gap:10px}.raise-top time{color:var(--blue);font-size:.78rem;font-weight:800}.raise-top b{color:var(--green)}.raise-change{margin:7px 0;font-size:1rem;font-weight:900}.raise-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;color:var(--muted);font-size:.72rem}.raise-meta strong{display:block;color:var(--ink);font-size:.8rem}.disclaimer{margin:18px auto 32px;padding:14px 18px;color:#6a5523;background:#fff7dc;border:1px solid #ead48c;border-radius:13px;font-size:.8rem;text-align:center}
@media(max-width:820px){.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.headline-grid{grid-template-columns:1fr 1fr}.headline.primary{grid-column:1/-1}.quick-grid{grid-template-columns:1fr 1fr}.career-path{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){body{background:linear-gradient(#edf4ff 0 260px,var(--wash) 260px)}.shell{width:calc(100% - 20px)}.hero{padding:28px 0 60px}.hero-inner{display:block}.full-link{display:inline-block;margin-top:20px}.input-card,.results{padding:16px;border-radius:15px}.section-title,.subheading{display:block}.status,.badge{display:inline-block;margin-top:9px}.form-grid,.headline-grid,.salary-story,.raise-list{grid-template-columns:1fr}.date-group{grid-column:auto}.date-inputs{grid-template-columns:1.05fr 1fr .72fr}.quick-grid{grid-template-columns:1fr 1fr}.career-path{grid-template-columns:1fr}.career-path li{display:grid;grid-template-columns:70px minmax(0,1fr);align-items:start}.career-path .rank{grid-row:1/4}.story-card{grid-template-columns:82px minmax(0,1fr);padding:13px}.raise-meta{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:360px){.quick-grid{grid-template-columns:1fr}.date-inputs{grid-template-columns:1fr 1fr}.date-inputs label:first-child{grid-column:1/-1}.story-card{grid-template-columns:1fr}.story-card p{grid-column:1}.raise-meta{grid-template-columns:1fr 1fr}}
@media print{body{background:#fff}.hero{padding:12px 0;color:#000;background:#fff;border-bottom:2px solid #000}.hero-copy,.full-link,.input-card,.all-raises{display:none}.results{margin:15px 0;padding:0;border:0;box-shadow:none}.headline.primary{color:#000;background:#fff;border:1px solid #999}.headline.primary span,.headline.primary small{color:#555}.disclaimer{border-color:#999}.salary-story{grid-template-columns:1fr 1fr}}
.warnings{margin-top:16px;padding:12px 14px;color:#70551a;background:#fff8df;border:1px solid #ead48c;border-radius:10px}
.source-note{margin:22px 0 0;padding-top:14px;color:var(--muted);border-top:1px solid var(--line);font-size:.75rem}
.birth-group{grid-column:span 2}
.header-icon{width:18px;height:18px;margin-right:6px;vertical-align:middle;border-radius:5px}

/* Compact Lite input: all required controls fit in one normal desktop viewport. */
@media(min-width:821px){
  .hero{padding:22px 0 48px}.hero h1{font-size:2.35rem}.hero-copy{margin-top:8px}.input-card{margin-top:-28px;padding:18px 22px}.form-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 12px;margin-top:12px}.field>span,.group-label{margin-bottom:3px}.field em{margin-top:2px}.assumptions{margin-top:10px;padding:8px 12px}input,select{min-height:40px;padding:6px 9px}
}

/* iPhone 16 Pro Max (440px CSS width): dense two-column input sheet, no sideways scroll. */
@media(max-width:560px){
  body{line-height:1.3}.hero{padding:12px 0 38px}.hero-inner{position:relative;display:block}.hero h1{font-size:clamp(1rem,4.8vw,1.3rem);line-height:1.15;white-space:nowrap}.hero h1 br{display:none}.hero h1 span{white-space:nowrap}.hero-copy{max-width:330px;margin-top:5px;font-size:.69rem}.kicker{max-width:235px;font-size:.58rem;white-space:nowrap}.full-link{position:absolute;top:0;right:0;margin:0;padding:5px 7px;font-size:.62rem}.input-card{margin-top:-25px;padding:10px}.section-title{display:flex;align-items:center;gap:8px}.section-title .step{display:none}.section-title h2{font-size:1rem;white-space:nowrap}.status{margin:0;font-size:.68rem;white-space:nowrap}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 8px;margin-top:7px}.date-group,.birth-group{grid-column:1/-1}.field>span,.group-label{min-height:1.15em;margin-bottom:2px;font-size:.68rem;line-height:1.15}.field small,.field em{display:none}input,select{min-height:36px;padding:5px 7px;border-radius:8px;font-size:.78rem}.date-inputs{gap:5px}.date-inputs label span{margin-bottom:1px;font-size:.58rem}.suffix i{padding:0 7px;font-size:.68rem}.errors,.warnings{margin-top:6px;padding:6px 8px;font-size:.68rem}.assumptions{margin-top:6px;padding:6px 9px;font-size:.72rem}.assumptions ul{font-size:.72rem}.results{margin-top:12px}
}

@media screen{
  body{background:linear-gradient(#e8dfcf 0 310px,var(--wash) 310px)}
  .hero{background:linear-gradient(120deg,#294438 0%,#466048 62%,#76533e 100%)}
  .kicker,.step{color:#e5c483}.hero h1 span{color:#e9c98b}.hero-copy{color:#f0e9dc}.full-link{color:#fff;border-color:rgba(255,255,255,.62);background:rgba(36,53,44,.22)}
  .field b,.group-label b{color:#9a4e32}input,select{background:#fffdf8;border-color:#a99e8b}input:focus,select:focus,summary:focus-visible,a:focus-visible{outline-color:rgba(53,94,75,.28);border-color:var(--blue)}
  .suffix i{color:var(--muted);background:#e9e2d6;border-color:#a99e8b}.errors{color:#71372f;background:#f7e7df;border-color:#d7a99d}.warnings{color:#60452f;background:#f3e6ce;border-color:#d3b78c}
  .assumptions,.headline,.quick-grid article,.career-path li,.raise-item{background:#f5f1e8}.badge{color:var(--ink);background:#e5cf9e}
  .headline.primary{background:linear-gradient(130deg,#355e4b,#79543d)}.headline.primary span,.headline.primary small{color:#eee7da}
  .career-path li.active{background:#e3e9db;border-color:#9eae91}.story-card{background:#fffdf8}.disclaimer{color:#60452f;background:#efe4d2;border-color:#d3b78c}
}

.raise-line{display:grid;grid-template-columns:.95fr .9fr .5fr 1.2fr .9fr .55fr .55fr;gap:7px;align-items:center;white-space:nowrap;color:var(--muted);font-size:.75rem}
.raise-line time{color:var(--blue);font-weight:800}.raise-line b{color:var(--green)}.raise-line strong{color:#9a4e32;text-align:right}.raise-salary{color:var(--ink);font-size:.82rem;font-weight:900}
.site-credit{margin:-16px auto 22px;color:var(--muted);font-size:.68rem;letter-spacing:.03em;text-align:center;opacity:.78}
.floating-credit{display:none}@media(min-width:901px){.floating-credit{position:fixed;z-index:30;top:50%;left:8px;display:block;padding:10px 7px;color:var(--navy);background:rgba(251,248,241,.96);border:1px solid var(--line);border-radius:9px;box-shadow:0 5px 18px rgba(57,48,35,.14);font-size:.68rem;letter-spacing:.03em;writing-mode:vertical-rl;transform:translateY(-50%) rotate(180deg)}}@media print{.floating-credit{display:none!important}}
@media(max-width:560px){.raise-item{padding:8px 6px}.raise-line{display:flex;justify-content:space-between;gap:3px;font-size:clamp(.6rem,2.45vw,.68rem);letter-spacing:-.025em}.raise-line>*{flex:0 1 auto;min-width:0}.raise-salary{font-size:inherit}.raise-line strong{padding-right:1px}}
@media(max-width:560px){
  .results{padding:12px}.result-title{margin-bottom:10px}.result-title .step,.subheading .step{margin-bottom:1px}.result-title h2{font-size:1.25rem}.badge{margin-top:5px;padding:4px 8px;font-size:.68rem}
  .headline-grid{gap:6px}.headline,.quick-grid article{padding:8px;border-radius:10px}.headline span,.headline small,.quick-grid span{font-size:.65rem;line-height:1.25}.headline strong{margin:2px 0;font-size:1.05rem;line-height:1.2}.headline.primary{min-height:0}.quick-grid{gap:6px;margin-top:6px}.quick-grid strong{margin-top:2px;font-size:.78rem;line-height:1.25}
  .path-section,.salary-section{margin-top:14px}.subheading h3{font-size:1rem;line-height:1.25;white-space:nowrap}.subheading p{margin-top:1px;font-size:.67rem}.career-path{gap:5px;margin-top:8px}.career-path li{grid-template-columns:58px 86px minmax(0,1fr);gap:1px 6px;padding:6px 8px;border-radius:9px}.career-path .rank{grid-row:1/3;font-size:.78rem}.career-path time,.career-path small{margin-top:0;font-size:.63rem;line-height:1.25}.career-path strong{margin-top:0;font-size:.76rem;line-height:1.25}.career-path small:first-of-type{grid-column:3}.career-path small:last-child{grid-column:2/4}
  .salary-story{gap:5px;margin-top:8px}.story-card{grid-template-columns:76px minmax(0,1fr);gap:3px 7px;padding:6px 8px;border-radius:9px}.story-card .when{font-size:.66rem;line-height:1.25}.story-card h4{margin:0 0 2px;font-size:.76rem;line-height:1.2}.story-money{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px}.story-money span{font-size:.56rem;line-height:1.15}.story-money strong{font-size:.68rem;line-height:1.2;white-space:nowrap}.story-card p{margin:0;font-size:.59rem;line-height:1.2}
  .all-raises{margin-top:14px}.all-raises summary{padding:12px 0}
}
