/* PT and BS use the same attained-grade palette; missing grades stay grey. */
:is([data-track="pt"],[data-track="bs"]) [data-grade="2"]{--grade-bg:#0057ff;--grade-ink:#fff;--grade-year:#fff}
:is([data-track="pt"],[data-track="bs"]) [data-grade="3"],:is([data-track="pt"],[data-track="bs"]) [data-grade="4"],:is([data-track="pt"],[data-track="bs"]) [data-grade="5"]{--grade-bg:#ff0000;--grade-ink:#fff;--grade-year:#fff}
:is([data-track="pt"],[data-track="bs"]) [data-grade="6"],:is([data-track="pt"],[data-track="bs"]) [data-grade="7"],:is([data-track="pt"],[data-track="bs"]) [data-grade="8"]{--grade-bg:#ffff00;--grade-ink:#302b13;--grade-year:#40391a}
:is([data-track="pt"],[data-track="bs"]) [data-grade="9"]{--grade-bg:#ffd700;--grade-fill:linear-gradient(135deg,#fff000 0%,#ffd700 45%,#d4a017 100%);--grade-ink:#30220a;--grade-year:#403012}
:is([data-track="pt"],[data-track="bs"]) .grade-step.achieved{background:var(--grade-fill,var(--grade-bg,#22634f));border-color:var(--grade-bg,#22634f);color:var(--grade-ink,#fff)}
:is([data-track="pt"],[data-track="bs"]) .grade-step.achieved strong{color:var(--grade-year,#dce6c5)}
.card-grades:is([data-track="pt"],[data-track="bs"]) .found{background:var(--grade-fill,var(--grade-bg,#22634f));color:var(--grade-ink,#fff)}
.card-grades:is([data-track="pt"],[data-track="bs"]) .found:is([data-grade="3"],[data-grade="4"],[data-grade="5"]){color:#230000}
#image-dialog{max-width:1080px;max-height:94dvh}
.photo-workspace{display:grid;grid-template-columns:minmax(0,1fr) 300px;background:#e9ece5}
.photo-workspace .image-scroll{max-height:65dvh;min-height:260px;display:flex;align-items:flex-start;justify-content:center;padding:20px}
.photo-workspace .image-scroll img{width:auto;max-width:100%;max-height:60dvh;object-fit:contain;box-shadow:0 4px 24px #173f3920}
.large-preview .image-scroll img{width:100%;max-height:none}
.photo-editor{background:#fffdf7;padding:22px 18px;max-height:65dvh;overflow:auto;border-left:1px solid #dce3d6}
.photo-editor h3{font-size:19px;margin:0 0 7px;color:var(--deep)}
.photo-editor p{font-size:13px;line-height:1.8;color:#6a7963;margin:8px 0 14px}
.photo-editor .button{width:100%;font-size:15px;min-height:46px;padding:10px}
.photo-editor .text-button{font-size:14px;margin:8px 0}
.photo-editor label{display:block;font-size:14px;font-weight:500;margin-top:13px;color:var(--deep)}
.photo-editor select{display:block;width:100%;font:inherit;margin-top:6px;padding:9px 8px;border:1px solid #cbd7c5;border-radius:7px;background:white;color:var(--deep)}
.photo-editor input[type=range]{display:block;width:100%;accent-color:var(--green);margin:9px 0;min-height:25px}
.photo-editor .photo-privacy{font-size:12px;border-top:1px solid #dce3d6;padding-top:12px;margin-top:15px}
.photo-editor .photo-zoom-toggle{display:flex;gap:8px;align-items:center;font-size:13px;font-weight:400}
.photo-zoom-toggle input{accent-color:var(--green)}
#portrait-status{font-size:13px;margin-bottom:0;color:var(--green)}
.fan-option{padding:0 12px 10px;border:1px solid #d6dfd0;border-radius:10px;background:#f3f5eb;margin:12px 0}
.fan-option .photo-zoom-toggle{font-size:16px;font-weight:600;min-height:32px;cursor:pointer}
.fan-option input{width:18px;height:18px;flex-shrink:0}
.fan-summary{display:flex;gap:10px;align-items:center}
.fan-summary img{width:44px;height:66px;object-fit:contain;flex-shrink:0}
.photo-editor #fan-status{font-size:13px;margin:4px 0;color:#356250;line-height:1.65}
.background-gallery{margin:12px 0;border:1px solid #d6dfd0;border-radius:10px;background:#fff}
.background-gallery summary{cursor:pointer;padding:12px;font-size:15px;font-weight:600;color:#173f39}
.background-gallery summary span{font-size:12px;font-weight:400;color:#6a7963;margin-left:5px}
.background-reset{display:block;width:calc(100% - 20px);min-height:48px;margin:0 10px 10px;padding:9px 12px;border:2px solid #d6dfd0;border-radius:8px;background:#fff;color:#173f39;text-align:left;font:inherit;font-size:15px;font-weight:600;cursor:pointer}
.background-reset span{display:block;font-size:12px;font-weight:400;color:#6a7963}
.background-reset:hover,.background-reset[aria-pressed=true]{border-color:#126957;background:#f0f7f3}
.background-reset:focus-visible{outline:3px solid #c5a25f;outline-offset:2px}
.background-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:3px 10px 12px;max-height:340px;overflow:auto}
.background-choice{position:relative;min-width:0;border:2px solid #e1e7dd;border-radius:9px;overflow:hidden;padding:0;background:#fff;color:#173f39;cursor:pointer;text-align:left;font:inherit}
.background-choice img{display:block;width:100%;height:auto;aspect-ratio:1.6;object-fit:cover}
.background-choice span{display:block;padding:6px 7px;font-size:12px;line-height:1.5}
.background-choice:hover{border-color:#76a28b}
.background-choice[aria-pressed=true]{border-color:#126957;box-shadow:0 0 0 1px #126957}
.background-choice[aria-pressed=true]::after{content:'✓';position:absolute;right:5px;top:5px;border-radius:50%;width:23px;height:23px;background:#126957;color:#fff;text-align:center;font-size:16px;line-height:23px}
.background-choice:focus-visible,.background-gallery summary:focus-visible{outline:3px solid #c5a25f;outline-offset:2px}
.photo-editor #background-status,.photo-editor #name-grade-status{font-size:13px;line-height:1.65;color:#356250;margin:5px 0 10px}
#background-status:empty{display:none}
#image-dialog [hidden]{display:none!important}
#download-image[aria-disabled=true]{pointer-events:none;opacity:.5}
#download-image[role=button]{cursor:pointer}
#photos-help-panel{padding:16px 22px;background:#eff6ef;border-bottom:1px solid #d6dfd0;color:#173f39}
#photos-help-panel strong{font-size:17px}#photos-help-panel p{font-size:14px;line-height:1.8;margin:6px 0}
.photos-help-open .photo-editor{display:none}
.photos-help-open .photo-workspace{display:block;max-height:55dvh;overflow:auto}
.photos-help-open .image-scroll{max-height:none;min-height:0}
.photos-help-open .image-scroll img{max-height:none;width:100%;-webkit-touch-callout:default;user-select:auto}
/* Chrome iOS saves via the native image long-press menu. Do not leave a no-op save button in this view. */
.chrome-ios-save.photos-help-open #download-image,.chrome-ios-save.photos-help-open #native-share{display:none!important}
.chrome-ios-save.photos-help-open #share-image{-webkit-touch-callout:default;-webkit-user-select:none;user-select:none;touch-action:auto}
.chrome-ios-save.photos-help-open .dialog-actions{justify-content:center}
.chrome-ios-save.photos-help-open #image-status{font-size:15px;font-weight:500;color:#173f39;text-align:center;line-height:1.8}
@media(max-width:700px){
 #image-dialog{width:calc(100% - 16px);max-height:96dvh}
 .photo-workspace{display:flex;flex-direction:column;max-height:72dvh;overflow:auto}
 .photo-editor{order:-1;max-height:none;overflow:visible;border-left:0;border-bottom:1px solid #dce3d6;padding:15px}
 .photo-editor h3{font-size:17px}.photo-editor>p:first-of-type{margin:4px 0 10px}
 .background-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-height:270px}
 .background-choice span{font-size:12px}
 .photo-editor #portrait-options{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
 #portrait-crop{grid-column:1/-1}#portrait-crop label{margin-top:9px}
 .photo-editor .photo-privacy{margin:12px 0 0;padding-top:8px}
 .photo-workspace .image-scroll{flex-shrink:0;max-height:none;min-height:180px;padding:14px}
 .photo-workspace .image-scroll img{max-height:48dvh}
 .large-preview .image-scroll img{max-height:none}
 #image-dialog .dialog-actions{padding:12px;gap:8px}
}
@media(max-width:390px){.background-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
