:root{--bg:#080a08;--panel:#131713;--line:#384233;--muted:#b3bcb0;--yellow:#ffcc00;--white:#f5f6f0}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;height:100%;overflow:hidden}body{background:var(--bg);color:var(--white);font:14px/1.45 Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{cursor:pointer}:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}.jobs-shell{max-width:1000px;height:100vh;height:100dvh;margin:auto;display:grid;grid-template-rows:65px minmax(0,1fr)48px;background:#0b0e0b;padding-bottom:env(safe-area-inset-bottom)}header{padding:10px 24px;display:flex;gap:12px;align-items:center;border-bottom:1px solid var(--line)}.back-home{width:30px;height:37px;border:1px solid #3a4438;border-radius:10px;display:grid;place-items:center;font-size:26px;color:#c4cec0;flex-shrink:0}.brand{display:flex;gap:9px;align-items:center;flex:1;min-width:0}.brand img{width:28px;height:37px;object-fit:contain}.brand span{font-size:12px;font-weight:800;line-height:1.3;letter-spacing:.5px}.brand small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.topic-return{padding:10px;border:1px solid #566044;border-radius:8px;background:#20271b;font-size:12px;font-weight:700;white-space:nowrap}main{min-height:0;display:grid;grid-template-rows:auto 46px 46px 34px 28px minmax(0,1fr)44px;gap:8px;padding:16px 24px 10px}.jobs-title{display:flex;align-items:center;justify-content:space-between}.jobs-title h1{font-size:28px;letter-spacing:-.8px;line-height:1.1;margin:0}.jobs-title>button{background:transparent;color:var(--muted);border:0;width:40px;height:36px;font-size:22px}.search-label,.series-picker{display:block;min-width:0}.search-label input,.series-picker select{height:46px;width:100%;min-width:0;padding:10px 12px;border:1px solid #596354;border-radius:8px;background:#131713;color:var(--white);font-size:16px}.search-label input::placeholder{color:#b3bcb0}.series-picker select{background:#202918;border-color:#637348;color:var(--yellow);font-weight:700;padding-right:24px}.list-options{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11px;color:var(--muted)}.list-options label{display:flex;gap:7px;align-items:center;min-height:34px}.list-options input{width:17px;height:17px;accent-color:var(--yellow);margin:0}.list-options button{background:transparent;color:var(--yellow);border:0;min-height:34px;padding:5px 8px;font-size:12px}.result-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}.result-heading strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.catalog-count{font-size:11px;color:var(--muted);white-space:nowrap}#mos-results{min-height:0;display:flex;flex-direction:column;gap:6px;overflow:hidden}.mos-job{min-height:50px;width:100%;padding:8px 12px;display:flex;align-items:center;gap:12px;background:linear-gradient(145deg,#1a2118,#101510);border:1px solid var(--line);border-radius:9px;color:var(--white);text-align:left;flex:1;max-height:76px}.mos-job:hover{border-color:var(--yellow);background:#222b1b}.mos-job-code{width:42px;flex-shrink:0;display:grid;place-items:center;height:32px;border-radius:6px;background:#283323;color:var(--yellow);font-size:12px;font-weight:800}.mos-job-title{flex:1;min-width:0;font-size:14px;line-height:1.25}.mos-job-title small{display:block;font-size:10px;color:var(--muted);margin-top:3px}.mos-job-arrow{color:var(--yellow);font-size:19px}.empty-results{color:var(--muted);padding:12px;font-size:14px}.pager{display:flex;align-items:center;justify-content:space-between;gap:10px}.pager button{min-height:40px;border:1px solid #526344;background:#202918;color:var(--white);border-radius:7px;padding:8px 14px;font-size:12px}.pager button:disabled{opacity:.35;cursor:default}.pager span{color:var(--muted);font-size:11px}footer{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--line);padding:5px 24px}footer>span{font-size:10px;color:var(--muted);max-width:60%}footer button{background:transparent;border:0;color:var(--yellow);font-size:12px;font-weight:700;min-height:36px;padding:5px 0;white-space:nowrap}dialog{position:fixed;width:460px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);margin:auto;padding:22px;border:1px solid #637356;border-radius:12px;background:#131b11;color:var(--white);overflow-y:auto;font-size:13px}dialog::backdrop{background:#000c}dialog h2{font-size:23px;line-height:1.15;letter-spacing:-.5px;margin:0 22px 12px 0}dialog p{color:var(--muted)}.close{position:absolute;right:6px;top:6px;width:40px;height:40px;background:transparent;color:var(--white);border:0;font-size:26px}.role-series{font-size:10px;color:var(--yellow);letter-spacing:1px;margin:0 25px 10px 0}.role-content img{display:block;width:100%;height:min(22dvh,180px);object-fit:cover;border-radius:7px}.photo-credit{font-size:9px;color:var(--muted);display:block;margin:5px 0 10px}.role-content p{font-size:13px;margin:10px 0}.role-content ul{padding-left:18px;font-size:12px;color:var(--muted);margin:10px 0}.role-content li{margin:5px 0}.role-route{font-size:11px}.role-interest{width:100%;min-height:46px;background:var(--yellow);color:#10160e;font-weight:800;border:0;border-radius:6px;padding:12px;font-size:14px;position:sticky;bottom:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:600px){header{padding:10px 16px}.brand span{font-size:11px}.brand img{width:25px;height:35px}.topic-return{font-size:11px;padding:9px}.jobs-title h1{font-size:24px}main{padding:12px 16px 8px;gap:7px}.mos-job{padding:7px 10px;gap:10px}.mos-job-title{font-size:13px}.mos-job-title small{display:none}footer{padding:5px 16px}footer>span{font-size:9px}footer button{font-size:11px}}@media(max-height:600px){.jobs-shell{grid-template-rows:55px minmax(0,1fr)38px}header{padding-top:5px;padding-bottom:5px}main{padding-top:6px;gap:4px;grid-template-rows:28px 40px 40px 28px 23px minmax(0,1fr)38px}.search-label input,.series-picker select{height:40px}.jobs-title h1{font-size:22px}.mos-job{min-height:44px}.pager button{min-height:34px}.role-content img{height:100px}footer button{min-height:30px}}

/* A contained picker wheel keeps the page fixed while MOS choices roll. */
main{grid-template-rows:auto 46px 46px 34px 28px minmax(0,1fr)24px}
.wheel-shell{position:relative;min-height:0;overflow:hidden;border:1px solid #35432e;border-radius:14px;background:linear-gradient(180deg,#10160e,#171e13 50%,#10160e)}
.wheel-selection{position:absolute;z-index:0;left:6px;right:6px;top:50%;height:68px;transform:translateY(-50%);border:1px solid #9b872e;border-left:3px solid var(--yellow);border-radius:9px;background:#2b351d;pointer-events:none}
#mos-results.wheel-list{position:relative;z-index:1;display:block;overflow-x:hidden;overflow-y:auto;height:100%;padding:var(--wheel-padding,0px) 6px;scroll-snap-type:y mandatory;scrollbar-width:none;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;mask-image:linear-gradient(transparent,#000 18%,#000 82%,transparent);scroll-behavior:auto}
.wheel-list::-webkit-scrollbar{display:none}.wheel-list .mos-job{display:flex;flex:none;min-height:68px;max-height:68px;height:68px;margin:0;border:0;border-radius:8px;background:transparent;scroll-snap-align:center;scroll-snap-stop:normal;opacity:.56;transform-origin:center;transition:opacity .12s;color:#d2dacb;padding:8px 12px;gap:12px}.wheel-list .mos-job:hover{background:#ffffff06}.wheel-list .mos-job.is-selected{opacity:1;color:#fff}.wheel-list .mos-job-code{background:#1e2817;border:1px solid #4c5c37;color:#d9c664}.wheel-list .mos-job.is-selected .mos-job-code{background:var(--yellow);color:#11180c;border-color:var(--yellow)}.wheel-list .mos-job-title{font-size:15px}.wheel-list .mos-job-title small{display:block;font-size:10px;color:#c0c9b5}.wheel-hint{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:10px;color:var(--muted)}#wheel-position{white-space:nowrap;font-variant-numeric:tabular-nums}.is-empty .wheel-selection{display:none}.is-empty #mos-results{padding:8px;mask-image:none}.wheel-list .empty-results{text-align:center;font-size:13px}
@media(max-width:600px){.wheel-list .mos-job-title{font-size:14px}.wheel-list .mos-job-title small{font-size:9px}.wheel-list .mos-job{padding:8px;gap:10px}.wheel-hint{font-size:9px}}
@media(max-height:600px){main{grid-template-rows:28px 40px 40px 28px 23px minmax(0,1fr)20px;gap:4px}.wheel-list .mos-job-title{font-size:13px}.wheel-list .mos-job-title small{display:none}}
@media(prefers-reduced-motion:reduce){.wheel-list .mos-job{transform:none!important;transition:none}}
/* The centered choice has larger type and a visibly magnified row. */
#mos-results.wheel-list{padding-left:20px;padding-right:20px}.wheel-selection{height:78px;left:8px;right:8px}.wheel-list .mos-job{transition:opacity .12s,transform .12s;transform-origin:center}.wheel-list .mos-job.is-selected{position:relative;z-index:2;font-weight:700}.wheel-list .mos-job.is-selected .mos-job-title{font-size:17px;font-weight:800}.wheel-list .mos-job.is-selected .mos-job-code{height:36px;font-size:15px;width:46px}.wheel-list .mos-job.is-selected .mos-job-title small{font-weight:400;font-size:10px}.wheel-list .mos-job:not(.is-selected){opacity:.4}
dialog[open]{display:flex;flex-direction:column;height:min(680px,calc(100dvh - 24px));max-height:calc(100dvh - 24px);overflow:hidden;gap:8px;padding:18px}dialog>.role-series,dialog>h2{flex:none;margin-bottom:4px}.role-body,.career-info-body{flex:1;min-height:0}.role-interest{position:static;flex:none;min-height:46px}.role-content img{height:min(23dvh,160px);break-inside:avoid}.role-body .screen-flow ul{padding-left:18px}.role-body .screen-flow .role-route{font-size:11px}.career-info-body p{font-size:13px;line-height:1.5}.role-content p{line-height:1.5}
@media(max-width:600px){.wheel-list .mos-job.is-selected .mos-job-title{font-size:16px}.wheel-list .mos-job.is-selected .mos-job-title small{font-size:9px}.wheel-list .mos-job{gap:8px;padding-left:6px;padding-right:6px}}
@media(max-height:500px){.jobs-shell{grid-template-rows:44px minmax(0,1fr)34px}header{padding:3px 12px}header .brand small{display:none}main{grid-template-columns:1fr 1fr;grid-template-rows:26px 40px 26px minmax(0,1fr)18px;padding:6px 12px;gap:4px 10px}.jobs-title,.list-options,.result-heading,.wheel-shell,.wheel-hint{grid-column:1/-1}.list-options{display:none}.result-heading{grid-row:3}.wheel-shell{grid-row:4}.wheel-hint{grid-row:5}.search-label{grid-column:1}.series-picker{grid-column:2}.wheel-list .mos-job-title small{display:none}dialog[open]{padding:12px;gap:5px}dialog h2{font-size:20px}.role-content img{height:110px}}
@media(prefers-reduced-motion:reduce){.wheel-list .mos-job.is-selected{transform:scaleY(1.1)!important}}
.jobs-shell{padding-top:env(safe-area-inset-top)}main{padding-top:20px}.jobs-title h1{font-size:25px}.wheel-list .mos-job.is-selected .mos-job-title{font-size:16px}dialog[open]{height:min(600px,calc(100dvh - 40px));max-height:calc(100dvh - 40px)}dialog h2{font-size:21px;line-height:1.2}
@media(max-height:550px){main{padding-top:8px}.jobs-title h1{font-size:22px}}

/* Keep the selected MOS readable while neighboring choices remain visible. */
.wheel-list .mos-job:not(.is-selected){opacity:.7}.wheel-list .mos-job{touch-action:pan-y}.role-content img{width:100%;object-fit:cover;aspect-ratio:16/9}.topic-return{white-space:nowrap}.jobs-shell footer{flex-wrap:wrap;gap:6px;padding-bottom:max(8px,env(safe-area-inset-bottom))}.jobs-shell footer button{min-height:44px}
