/* RailPulse 0.6 — clear railway symbology, everyday usability, no clipped cards. */
:root{--rail-gold:#f5b46a}
#shell{grid-template-columns:365px minmax(0,1fr)}
#sidebar{height:100dvh;min-height:0;overflow:hidden}
.brand{height:70px;flex:0 0 70px;padding:0 20px}
.brand-mark{height:39px;width:39px;border-radius:12px}
.brand strong{font-size:21px}
.side-inner{flex:1 1 auto;min-height:0;min-width:0;padding:14px 17px 30px;
  overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-gutter:stable;
  scrollbar-width:thin;scrollbar-color:#47808a transparent}
.side-inner::-webkit-scrollbar{width:8px}
.side-inner::-webkit-scrollbar-thumb{background:#41727b;border-radius:10px}
.side-footer{flex:0 0 auto;min-height:48px;padding:8px 15px;line-height:1.4;font-size:10px;z-index:2}
.side-footer a{white-space:nowrap}
.side-intro .overline{font-size:9px;letter-spacing:2px}
.side-intro h1{font-size:25px;line-height:1.07;margin:6px 0}
.side-intro p{max-width:300px;font-size:11px;line-height:1.45;margin-bottom:11px}
.search{height:41px;flex-shrink:0}
.experience-shortcuts{margin:8px 0}
.shortcut{padding:8px 11px;min-height:46px}
.shortcut strong{font-size:11px}
.shortcut small{font-size:9px;margin-top:2px}
.shortcut-icon{width:26px;height:26px;font-size:19px}
.shortcut-pair button{padding:8px 5px}
.tabs{margin:10px 0 14px}
.tabs button{padding:8px}
.section-title{margin-bottom:8px}
.filters{gap:5px}
.filters button{min-height:37px;padding:8px 10px;border-radius:9px;font-size:11px}
.filters button:hover{transform:none}
.list-title{margin:16px 0 9px}
.list-title small{font-size:9px;margin-top:4px}
.train-list{gap:7px;padding-bottom:35px;min-height:80px}
.train-card{min-height:79px;padding:10px 10px;border-radius:10px;max-width:100%;overflow:hidden}
.train-card:hover{transform:none}
.train-card .card-top{min-width:0}
.train-card .train-tag{max-width:calc(100% - 75px);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.train-card .gps{flex-shrink:0;font-size:9px}
.train-card .card-body{margin:7px 0 5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.train-card .card-bottom{font-size:10px;gap:5px}
.train-card .card-bottom span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.train-card .card-bottom span:last-child{flex:0 0 auto}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.my-journey{background:linear-gradient(135deg,#142f3d,#0f2531);border:1px solid #335a6b;
 border-radius:11px;padding:10px 11px 8px;margin-top:9px}
.my-journey-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.my-journey-top .overline{letter-spacing:1.5px;font-size:9px}
.my-journey-tip{font-size:9px;color:#84bcb7}
.my-journey-row{display:flex;align-items:center;gap:5px;min-width:0}
.my-journey-row select{min-width:0;flex:1;height:37px;background:#0e2531;border:1px solid #365f6c;
 color:#e5f7f9;border-radius:8px;padding:0 9px;font-size:11px}
.my-journey-row select option{background:#0c1d2a}
.my-go{padding:0 14px;height:37px;border:1px solid #48b3aa;border-radius:8px;background:#24b9ad;color:#082d35;font-weight:800;font-size:11px}
.my-journey-links{display:flex;align-items:center;gap:12px;margin-top:7px;flex-wrap:wrap}
.my-journey-links button{padding:3px 0;background:transparent;border:0;color:#9adddc;font-size:10px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.my-journey-links button:first-child{color:#f7bf88}
.my-line-status{margin-top:4px;color:#89aab5;font-size:10px;line-height:1.3;min-height:0}
body.light .my-journey{background:linear-gradient(120deg,#e7f3f6,#f5fbfa);border-color:#b2d0d6}
body.light .my-journey-tip,body.light .my-line-status{color:#536e78}
body.light .my-journey-row select{background:#fff;color:#183b49;border-color:#bdd4da}
body.light .my-journey-links button{color:#08747a}
body.light .my-go{color:#073a3f;background:#58d7cb}
body.light .my-journey-links button:first-child{color:#92612d}
body.light .side-inner{scrollbar-color:#9fbec7 transparent}
/* All train markers have a visible rail icon, unlike station circles. */
.train-div-icon{overflow:visible!important}
.train-marker-body{width:var(--marker-size,26px);height:var(--marker-size,26px);
 position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
 display:grid;place-items:center;background:#09212d;color:#f3fcff;
 border:2.2px solid var(--pin-color,#43e2e0);border-radius:9px;
 box-shadow:0 0 0 2px rgba(2,11,19,.84),0 3px 10px #0009,0 0 8px color-mix(in srgb,var(--pin-color) 30%,transparent)}
.train-marker-body svg{width:68%;height:68%;display:block;stroke:var(--pin-color)}
.train-marker-body.is-selected{--marker-size:34px;border-width:3px;
 box-shadow:0 0 0 4px #f2fbff9c,0 0 18px var(--pin-color),0 5px 14px #0009}
.train-marker-body.is-fgc{border-radius:10px 10px 7px 7px}
.train-marker-body.is-fgc::after{content:'F';position:absolute;bottom:-7px;right:-7px;
 border-radius:5px;background:#f4b26d;color:#251708;font-size:8px;font-weight:900;padding:1px 3px}
.station-label-icon{background:transparent;border:0;overflow:visible!important}
.station-hub{display:flex;align-items:center;gap:6px;width:max-content;max-width:180px;position:relative;
 transform:translate(8px,-8px);pointer-events:auto}
.station-hub .hub-dot{display:grid;place-items:center;flex:0 0 21px;width:21px;height:21px;
 background:#f7fcff;color:#125967;border:2px solid #2c8d9b;border-radius:50%;
 box-shadow:0 0 0 2px #061b27,0 2px 8px #0008;font-size:13px;font-weight:900}
.station-hub .hub-name{font-size:10px;font-weight:800;color:#e4f7fb;max-width:142px;
 white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
 border:1px solid #4c798b;background:#0b2231e9;padding:5px 7px;border-radius:6px;
 box-shadow:0 3px 9px #0009}
body.light .station-hub .hub-name{background:#fff;color:#183c4e;border-color:#a0c5d1}
body.light .station-hub .hub-dot{border-color:#237a8a}
.station-circle{filter:drop-shadow(0 1px 2px #000)}
.legend{gap:12px;flex-wrap:wrap;max-width:calc(100% - 55px);padding:10px 13px}
.legend-symbol{display:inline-grid;place-items:center;font-style:normal;font-size:13px}
.legend-symbol-train{width:16px;height:16px;background:#172932;color:#52ebdf;border:1px solid #5cbed1;border-radius:5px}
.legend-symbol-station{width:14px;height:14px;border:1.5px solid #81b8d2;color:#d7f5f5;border-radius:50%;font-size:11px}
body.light .legend-symbol-station{color:#155a68;border-color:#38869c}
/* Well-contained information cards, including long FGC IDs. */
.detail,.experience-panel{overflow-x:hidden;overscroll-behavior:contain}
.detail .detail-head{min-width:0}
.detail .detail-head>div{min-width:0}
.detail h2{overflow-wrap:anywhere;word-break:normal;font-size:24px}
.detail .facts div{min-width:0;gap:12px}
.detail .facts dd{overflow-wrap:anywhere;text-align:right;min-width:0}
.detail-route-block strong{overflow-wrap:anywhere}
.detail-velocity-note{font-size:10px;line-height:1.55;margin:6px 0 12px;color:#9fbbc9}
body.light .detail-velocity-note{color:#46606b}
.experience-panel{top:78px;bottom:17px}
.experience-tabs button{min-width:0;padding:12px 2px;font-size:10px}
.experience-tabs button.active{font-weight:800}
.holiday-inputs{display:grid;grid-template-columns:110px 1fr;gap:8px}
.holiday-inputs label{font-size:11px;display:flex;flex-direction:column;gap:6px;color:#b6d0da}
.holiday-inputs input,.holiday-inputs select{height:39px;padding:8px;background:#132a38;color:#effaff;
 border:1px solid #446170;border-radius:8px;min-width:0;width:100%}
.calendar-toolbar{display:flex;align-items:center;gap:9px;margin:22px 0 10px}
.calendar-toolbar strong{margin-right:auto;text-transform:capitalize;font-size:16px}
.calendar-toolbar button{border-radius:7px;background:#17343f;color:#d1f1f1;border:1px solid #416371;
 min-width:32px;height:31px;padding:0 7px}
.calendar-weekdays,.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.calendar-weekdays span{font-size:10px;font-weight:800;color:#a2bcc8;text-align:center;padding:7px 0}
.calendar-cell{position:relative;display:flex;align-items:flex-start;justify-content:center;
 padding-top:7px;height:39px;min-width:0;color:#cee4ea;background:#112736;border:1px solid #284351;
 border-radius:7px;font-size:12px}
.calendar-cell.is-holiday{border-color:#619f99;background:#1c4c4d;color:#d3fff7;font-weight:800}
.calendar-cell.is-local{border-color:#d0a16a;background:#59402b;color:#ffddaa}
.calendar-cell.is-today{box-shadow:inset 0 0 0 2px #70e9db}
.calendar-cell.is-selected{outline:2px solid #a4f4ed;outline-offset:1px}
.calendar-indicator{position:absolute;bottom:5px;width:5px;height:5px;border-radius:50%;background:currentColor}
.calendar-blank{height:39px}
.holiday-list h3{font-size:12px;color:#c1e2e9;margin:14px 0 8px}
.holiday-event{display:flex;gap:12px;align-items:baseline;border-bottom:1px solid #2b4958;padding:9px 0;font-size:12px}
.holiday-event strong{color:#85ded6;flex:0 0 74px;font-size:11px}
.holiday-event span{color:#d5e7ee;line-height:1.4}
.holiday-event.local strong{color:#f0b76c}
.calendar-selection,.empty-holidays{font-size:11px;color:#a9c6d0;line-height:1.5}
body.light .holiday-inputs label{color:#315665}
body.light .holiday-inputs input,body.light .holiday-inputs select{background:#fff;color:#20404e;border-color:#b3cdd7}
body.light .calendar-toolbar strong{color:#173d4e}
body.light .calendar-toolbar button{background:#ebf4f6;color:#275569;border-color:#b9d0d8}
body.light .calendar-weekdays span{color:#46616f}
body.light .calendar-cell{background:#f1f7f8;color:#294f5f;border-color:#cedfe3}
body.light .calendar-cell.is-holiday{background:#d7f2e9;color:#116d60;border-color:#87c4b0}
body.light .calendar-cell.is-local{background:#fdf1d9;color:#865522;border-color:#d8bd8e}
body.light .calendar-cell.is-today{box-shadow:inset 0 0 0 2px #2d9d95}
body.light .holiday-list h3,body.light .holiday-event span{color:#1f4555}
body.light .holiday-event{border-color:#d3e1e7}
body.light .holiday-event strong{color:#147e75}
body.light .holiday-event.local strong{color:#a16e33}
body.light .calendar-selection,body.light .empty-holidays{color:#55717e}
@media(max-width:1150px) and (min-width:781px){#shell{grid-template-columns:325px minmax(0,1fr)}.side-inner{padding:10px 14px 24px}}
@media(max-width:780px){
 #shell{display:block}
 #sidebar{height:100dvh;max-height:100dvh}
 .side-inner{padding:12px 16px 28px}
 .side-footer{padding-bottom:max(12px,env(safe-area-inset-bottom))}
 .experience-panel{top:auto;bottom:65px}
 .legend{bottom:109px;max-width:calc(100% - 25px)}
 .legend span:nth-last-child(1){display:none}
 .station-hub .hub-name{max-width:112px}
 .station-hub{gap:3px}
 .calendar-cell{height:38px}
 .experience-tabs button{font-size:9px;padding:11px 1px}
}
@media(max-height:730px) and (min-width:781px){
 .brand{height:62px;flex-basis:62px}
 .side-intro h1{font-size:23px}
 .side-intro p{margin-bottom:8px}
 .experience-shortcuts{margin:6px 0}
 .my-journey{margin-top:7px}
 .filters button{min-height:32px;padding:6px 10px}
 .list-title{margin:12px 0 6px}
}
@media(prefers-reduced-motion:reduce){.train-marker-body{transition:none}}

/* Incidències oficials només quan el feed és recent i l'identificador coincideix. */
.train-warning{position:absolute;display:grid;place-items:center;
 top:-9px;right:-9px;width:18px;height:18px;border-radius:50%;
 background:#ed704e;color:white;border:2px solid #f9eadc;font-size:11px;font-weight:900;
 box-shadow:0 2px 8px #000a}
.train-alert{border-color:#e4a078!important;box-shadow:inset 3px 0 #e88955}
.train-alert .gps{color:#ffbc96;font-size:8px;letter-spacing:.3px}
body.light .train-alert{background:#fff2e9}
body.light .train-alert .gps{color:#ab4b28}
.train-extra-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.train-extra-actions button{min-width:0;white-space:normal;overflow-wrap:anywhere;line-height:1.35}
.train-extra-actions button:last-child{grid-column:1/-1;border-color:#996344;color:#edc7a5}
body.light .train-extra-actions button:last-child{background:#fff0e3;color:#935127;border-color:#ddb18d}

/* Three equal shortcuts: journey, incidents/community, and holidays. */
.shortcut-pair{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
.shortcut-pair button{font-size:10px;gap:4px;white-space:nowrap;min-width:0}
@media(max-width:350px){.shortcut-pair button{font-size:9px;padding-left:3px;padding-right:3px}}

/* Trenlyra public beta: safe alternative contact when the moderated chats are closed. */
.community-email-fallback{border:1px solid #4f9b9a;background:linear-gradient(125deg,#173d44,#112e39);border-radius:12px;padding:15px;margin:12px 0}
.community-email-fallback[hidden]{display:none}
.community-email-fallback p{color:#c0e1e4;font-size:12px;line-height:1.6;margin:0 0 12px}
.community-email-fallback a{display:inline-block;background:#53dacc;color:#072a32;font-size:12px;
 border-radius:9px;padding:10px 14px;text-decoration:none;font-weight:800}
.community-email-fallback a:hover{background:#80f0e4}
body.light .community-email-fallback{background:#e6f7f5;border-color:#91c7c4}
body.light .community-email-fallback p{color:#295a65}
body.light .community-email-fallback a{color:#06444d}
.side-footer{flex-wrap:wrap;gap:6px 10px;min-height:48px}
.side-footer a{min-height:24px;display:inline-flex;align-items:center}
@media(max-width:900px){.side-footer{font-size:10px}}
:focus-visible{outline:2px solid #7ceee3;outline-offset:3px}