/* OSP panel 3.6.9 — shared visual language, scoped to the firefighter panel. */
body.osp-panel-page { background:#09111e!important; }
.osp-app-shell {
 --osp-bg:#09111e; --osp-surface:#111e30; --osp-inset:#0c1727;
 --osp-line:#293b50; --osp-text:#eff4fa; --osp-muted:#afbdce; --osp-blue:#a8c9ec;
 --osp-red:#df6372; --osp-radius:20px;
 color-scheme:dark; color:var(--osp-text); background:var(--osp-bg)!important;
 max-width:1450px; margin:0 auto; padding:24px; gap:22px;
 grid-template-columns:minmax(0,1fr) 300px; align-items:start;
 font-family:system-ui,-apple-system,"Segoe UI",sans-serif; font-size:15px;
}
.osp-app-shell.osp-no-rail { grid-template-columns:minmax(0,1fr)!important; }
.osp-app-shell * { box-sizing:border-box; }
.osp-app-shell .osp-sidebar {
 position:relative; overflow:hidden; padding:22px 26px; border:1px solid #314057;
 border-left:1px solid #314057; border-radius:var(--osp-radius);
 background:radial-gradient(ellipse at 100% 0,#32263855,transparent 65%),linear-gradient(115deg,#16243a,#111c2c);
 box-shadow:0 12px 32px #02071425;
}
.osp-app-shell .osp-sidebar::after { content:''; position:absolute; width:130px; height:130px; border:1px solid #b86c7720; border-radius:40px; transform:rotate(30deg); right:-30px; top:-60px; pointer-events:none; }
.osp-app-shell .osp-brand { gap:20px; }
.osp-app-shell .osp-brand-badge { width:70px; height:88px; flex:0 0 70px; padding:5px; background:#0b1422; border:1px solid #415069; border-radius:16px; box-shadow:0 5px 20px #0002; }
.osp-app-shell .osp-brand .osp-brand-organization { color:#bdcada; font-size:12px; margin-bottom:5px; letter-spacing:.035em; }
.osp-app-shell .osp-brand .osp-brand-name { font-size:clamp(20px,2.1vw,27px); color:#f4f7fb; letter-spacing:-.035em; line-height:1.25; }
.osp-app-shell .osp-brand .osp-brand-caption { margin-top:10px; padding:4px 9px; border:1px solid #9e566740; background:#b8516413; border-radius:6px; font-size:10px; letter-spacing:.06em; color:#e8b9c3; }
.osp-app-shell .osp-center { display:flex; flex-direction:column; gap:22px; min-width:0; }
.osp-app-shell .osp-center>section,.osp-app-shell .osp-right-rail>section,.osp-app-shell>#osp-training {
 margin:0!important; padding:25px; border:1px solid var(--osp-line); border-radius:var(--osp-radius);
 background:linear-gradient(135deg,#142236,#101c2d); box-shadow:0 10px 28px #02071520;
}
.osp-app-shell .osp-center #osp-profile { padding:22px 25px; margin:0; gap:16px; background:#101d2e; border:1px solid var(--osp-line); border-radius:var(--osp-radius); }
.osp-app-shell #osp-profile h2 { color:#f0f5fc; font-size:clamp(23px,2.5vw,31px); font-weight:650; letter-spacing:-.035em; }
.osp-app-shell #osp-profile .osp-kicker { color:#aabbd0; font-size:10px; letter-spacing:.12em; }
.osp-app-shell #osp-profile select.osp-profile-status { border-radius:10px; min-height:46px; padding:10px 13px; font-size:13px; }
.osp-app-shell #osp-profile select.osp-profile-status-ready { color:#b4ebd2; background:#17332e; border-color:#467765; }
.osp-app-shell #osp-profile select.osp-profile-status-station { color:#c4ddf5; background:#1b304c; border-color:#55799e; }
.osp-app-shell #osp-profile select.osp-profile-status-unavailable { color:#f4c3cd; background:#3b2433; border-color:#986174; }
.osp-app-shell .osp-right-rail { display:grid; gap:18px; min-width:0; }
.osp-app-shell h3 { display:flex; align-items:center; gap:11px; color:#f0f5fc; font-size:21px; font-weight:650; line-height:1.35; letter-spacing:-.025em; }
.osp-app-shell h2 { letter-spacing:-.025em; }
.osp-app-shell p { line-height:1.7; }
.osp-app-shell .osp-muted,.osp-app-shell .osp-hint { color:var(--osp-muted); }
.osp-app-shell .osp-icon { display:inline-block; flex:0 0 23px; width:23px; height:23px; color:#b7cde6; vertical-align:middle; }
.osp-app-shell .osp-feature-art { display:block; flex:none; width:64px; height:64px; max-width:100%; color:#b9d5f2; }
.osp-app-shell .osp-section-heading { gap:12px; }
.osp-app-shell :is(button,select,input[type=search],input[type=date],input[type=text],input[type=email],input[type=number],input[type=tel],textarea) { font:inherit; max-width:100%; border-radius:11px; }
.osp-app-shell :is(button,select,input[type=search],input[type=date],input[type=text],input[type=email],input[type=number],input[type=tel]) { min-height:46px; }
.osp-app-shell button { border:1px solid #546f8b; background:#263e59; color:#f2f7fd; padding:11px 16px; cursor:pointer; white-space:normal; transition:background .16s,border-color .16s; }
.osp-app-shell button:hover { background:#325271; border-color:#8eafd0; }
.osp-app-shell button:disabled { opacity:.6; cursor:default; }
.osp-app-shell :is(input,select,textarea) { color:var(--osp-text); background:#0c192b; border:1px solid #526b87; padding:12px; }
.osp-app-shell input::placeholder,.osp-app-shell textarea::placeholder { color:#9dafc3; opacity:1; }
.osp-app-shell input[type=checkbox],.osp-app-shell input[type=radio] { width:22px; height:22px; min-height:22px; padding:0; accent-color:#a1c3e7; }
.osp-app-shell summary { min-height:48px; padding:14px 0; cursor:pointer; line-height:1.5; }
.osp-app-shell :is(button,a,summary,input,select,textarea):focus-visible { outline:3px solid #b2d6fa; outline-offset:4px; }
.osp-app-shell :is(section,div,article) { scroll-margin-top:18px; }
/* Search remains first, with a quiet illuminated field rather than a heavy frame. */
.osp-app-shell #osp-find-equipment { background:linear-gradient(120deg,#1a2e49,#142238); border:1px solid #476382; box-shadow:inset 0 1px #cbe5ff08,0 10px 30px #0002; padding:25px; }
.osp-app-shell #osp-find-equipment h3 { font-size:24px; }
.osp-app-shell #osp-find-equipment .osp-find-help { color:#b9c8da; font-size:13px; margin:12px 0 18px; }
.osp-app-shell .osp-find-label { color:#c8d8e9; font-size:12px; font-weight:550; }
.osp-app-shell #osp-find-equipment .osp-find-wrap input { min-height:58px!important; padding:16px 60px 16px 17px!important; font-size:16px!important; border-radius:13px; background:#0b192b; border:1px solid #607e9f; box-shadow:0 5px 18px #0002; }
.osp-app-shell #osp-find-equipment .osp-find-wrap input:focus { border-color:#b1d4f6; outline:2px solid #9bc4ec; outline-offset:3px; }
.osp-app-shell #osp-equipment-search-clear { width:46px; height:46px; top:6px; right:6px; min-height:46px; padding:0; font-size:26px; background:#213752; border-color:#3c5675; }
.osp-app-shell .osp-find-results { display:grid; gap:10px; }
.osp-app-shell .osp-find-result { border:1px solid #314b68; border-radius:12px; background:#101e32; }
.osp-app-shell .osp-find-icon { color:#afcce9; }
/* Existing figures are retained; their surrounding cards are quieter. */
.osp-app-shell .osp-uniform-grid { gap:14px; }
.osp-app-shell .osp-uniform-card { min-height:0; padding:14px; border:1px solid #2c4059; border-radius:15px; background:radial-gradient(ellipse at 50% 40%,#253d5838,transparent 70%),#0c1829; box-shadow:none; }
.osp-app-shell .osp-character-wrap { height:225px; margin:10px 0; }
.osp-app-shell .osp-character-photo { max-height:225px; }
.osp-app-shell .osp-equipment-group>summary { font-size:13px; color:#d0dfef; border-color:#304159; }
.osp-app-shell .osp-owned-equipment { background:#15273e; border-color:#30465f; border-radius:12px; }
.osp-app-shell .osp-owned-equipment h4 { color:#ecf3fb; }
.osp-app-shell .osp-owned-equipment p { color:#b2c2d5; }
/* Progress is a visual reward, without changing any score calculation. */
.osp-app-shell .osp-center #osp-points.osp-points-card { position:relative; overflow:hidden; background:radial-gradient(ellipse at 100% 0,#3d527d55,transparent 65%),linear-gradient(120deg,#1c2d49,#142138); border-color:#3f5575; }
.osp-app-shell #osp-points .osp-points-eyebrow { color:#b2c2db; font-size:10px; letter-spacing:.13em; }
.osp-app-shell #osp-points .osp-points-total strong { font-size:clamp(52px,7vw,74px); font-weight:750; letter-spacing:-.055em; line-height:1; color:#f1f6fd; }
.osp-app-shell #osp-points .osp-level-chip { border:1px solid #829db65c; background:#253a59; color:#d5e6f8; border-radius:9px; }
.osp-app-shell #osp-points .osp-points-motivation { font-size:14px; margin:13px 0 22px; max-width:550px; color:#b7c7dc; }
.osp-app-shell #osp-points .osp-points-track { height:12px; overflow:hidden; border-radius:20px; border:1px solid #49617b; background:#0c192c; }
.osp-app-shell #osp-points .osp-points-track>span { display:block; height:100%; border-radius:20px; background:linear-gradient(90deg,#6e9ecc,#c4def8); box-shadow:0 0 15px #a5cced30; }
.osp-app-shell #osp-points .osp-points-goal { color:#d7e5f6; font-size:13px; }
.osp-app-shell #osp-points .osp-points-milestone { border:1px solid #354967; border-radius:12px; background:#112038; }
.osp-app-shell #osp-points .osp-points-milestone.is-earned { border-color:#6f94b3; background:#233c55; }
.osp-app-shell #osp-points .osp-milestone-symbol { color:#a6c6e8; }
.osp-app-shell #osp-points .osp-points-next { background:#253e5b; border-color:#587b9c; border-radius:12px; }
/* Action cards use local vector illustrations. No external graphic libraries. */
.osp-app-shell #osp-action-guide { border:1px solid #4b5677; border-radius:var(--osp-radius); background:linear-gradient(115deg,#242a44,#162238); padding:25px; }
.osp-app-shell #osp-action-guide .osp-guide-heading { gap:18px; }
.osp-app-shell #osp-action-guide .osp-guide-art { display:block; flex:0 0 64px; width:64px; height:64px; }
.osp-app-shell #osp-action-guide h2 { font-size:25px; margin:0; line-height:1.3; color:#f1f4fc; }
.osp-app-shell #osp-action-guide .osp-guide-heading p { color:#bfcbde; font-size:13px; margin:6px 0 0; }
.osp-app-shell #osp-action-guide .osp-guide-scope { border-left:0; padding-left:0; margin:18px 0; color:#b1bfd4; font-size:12px; }
.osp-app-shell #osp-action-guide select { min-height:50px; border-color:#637394; background:#0d1a2d; border-radius:12px; }
.osp-app-shell #osp-action-guide h4 { color:#bbd6ef; }
.osp-app-shell #osp-action-guide button,.osp-app-shell #osp-action-guide .osp-guide-report { background:#2c3d5c; border-color:#667b9e; }
.osp-app-shell #osp-training { grid-column:1/-1; }
.osp-app-shell .osp-training-summary>div { border:1px solid #334760; border-radius:13px; background:#0d1b2d; }
.osp-app-shell .osp-training-summary .warn { color:#e8c0c7; }
.osp-app-shell .osp-training-card { border-color:#31465e; background:#101f32; }
.osp-app-shell #osp-hydrants.osp-hydrants-card { background:linear-gradient(135deg,#142236,#101c2d); border:1px solid var(--osp-line); border-radius:var(--osp-radius); padding:25px; box-shadow:0 10px 28px #02071520; }
.osp-app-shell #osp-hydrants #osp-online-map { border-radius:14px; border-color:#4b6380; }
.osp-app-shell .osp-panel-fold>summary { display:flex; align-items:center; gap:12px; list-style:none; font-size:20px; font-weight:650; }
.osp-app-shell .osp-panel-fold>summary>span { display:flex; align-items:center; gap:11px; }
.osp-app-shell .osp-panel-fold>summary:before { content:'›'; color:#9bb4d4; font-size:25px; }
.osp-app-shell .osp-panel-fold[open]>summary:before { transform:rotate(90deg); }
.osp-app-shell .osp-panel-fold>summary small { font-size:11px; font-weight:450; color:#bdcee1; margin-left:auto; padding:4px 8px; border:1px solid #39506a; border-radius:7px; background:#192c43; }
.osp-app-shell .osp-panel-fold[open]>summary { border-bottom:1px solid var(--osp-line); margin-bottom:16px; }
.osp-app-shell .osp-panel-logout { grid-column:1/-1; padding-top:6px; margin:0; }
.osp-app-shell .osp-panel-logout-button { background:#312333!important; border-color:#865669!important; color:#f1dce3!important; border-radius:12px; box-shadow:none; }
.osp-app-shell [hidden] { display:none!important; }
@media(max-width:1050px) {
 .osp-app-shell { grid-template-columns:minmax(0,1fr); padding:16px; }
 .osp-app-shell .osp-right-rail { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:650px) {
 .osp-app-shell { padding:10px; gap:14px; }
 .osp-app-shell .osp-center,.osp-app-shell .osp-right-rail { gap:14px; }
 .osp-app-shell .osp-right-rail { grid-template-columns:1fr; }
 .osp-app-shell .osp-center>section,.osp-app-shell .osp-right-rail>section,.osp-app-shell>#osp-training { padding:20px; border-radius:17px; }
 .osp-app-shell .osp-sidebar { padding:18px 16px; border-radius:17px; }
 .osp-app-shell .osp-brand { gap:14px; }
 .osp-app-shell .osp-brand-badge { width:54px; height:73px; flex-basis:54px; padding:4px; border-radius:12px; }
 .osp-app-shell .osp-brand .osp-brand-organization { font-size:10px; }
 .osp-app-shell .osp-brand .osp-brand-name { font-size:19px; }
 .osp-app-shell .osp-brand .osp-brand-caption { margin-top:8px; font-size:9px; }
 .osp-app-shell .osp-center #osp-profile { padding:20px; }
 .osp-app-shell #osp-profile h2 { font-size:25px; }
 .osp-app-shell .osp-profile-availability { width:100%; }
 .osp-app-shell #osp-profile select.osp-profile-status { width:100%; }
 .osp-app-shell .osp-uniform-grid { grid-template-columns:1fr; }
 .osp-app-shell .osp-character-wrap { height:205px; }
 .osp-app-shell .osp-character-photo { max-height:205px; }
 .osp-app-shell #osp-points .osp-points-goal { display:flex; flex-wrap:wrap; gap:6px 15px; }
 .osp-app-shell #osp-action-guide { padding:20px; }
 .osp-app-shell #osp-action-guide .osp-guide-heading { gap:12px; }
 .osp-app-shell #osp-action-guide .osp-guide-art { flex-basis:52px; width:52px; height:52px; }
 .osp-app-shell #osp-action-guide h2 { font-size:22px; }
 .osp-app-shell #osp-action-guide .osp-feature-art { width:52px; height:52px; }
 .osp-app-shell .osp-panel-fold>summary { flex-wrap:wrap; gap:9px; font-size:18px; }
 .osp-app-shell .osp-panel-fold>summary>span { flex:1; min-width:0; }
 .osp-app-shell .osp-panel-fold>summary small { margin-left:26px; }
}
@media(prefers-reduced-motion:reduce) { .osp-app-shell * { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }