/* =========================================================================
   SG Säntis Cup – "Mein Jahr" (persönliche Saison-Bilanz)
   Themefähig über die App-Tokens (Gold im Alpin-Theme, Türkis im hellen).
   Alles unter .myyear gescoped.
   ========================================================================= */
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500;600;700&family=IBM+Plex+Mono:wght@500;600&display=swap');

.myyear { --my-accent: var(--accent-teal, #0891b2); --my-sky:#5b9bd5; --my-green:#4bbf87; }
.myyear .tnum { font-family:'IBM Plex Mono',monospace; font-variant-numeric:tabular-nums; }
.myyear .dot { display:inline-block; width:3px; height:3px; border-radius:50%; background:currentColor; opacity:.5; margin:0 3px; vertical-align:middle; }
.myyear .taf { color:var(--text-muted); font-size:10.5px; }

/* Kopf */
.my-head { display:flex; align-items:flex-end; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.my-title h2 { font-family:'Oswald',sans-serif; font-size:30px; font-weight:700; letter-spacing:.02em; text-transform:uppercase; margin:0; color:var(--text-primary); }
.my-sub { color:var(--text-secondary); font-size:13px; margin-top:4px; }
.my-pick-wrap { font-size:11px; text-transform:uppercase; letter-spacing:.8px; color:var(--text-secondary); display:flex; flex-direction:column; gap:5px; }
.my-pick { font:inherit; font-weight:600; text-transform:none; letter-spacing:normal; background:var(--background-section); color:var(--text-primary); border:1px solid var(--border-light); border-radius:999px; padding:8px 13px; }

/* Pilotkopf */
.my-me { display:flex; align-items:center; gap:16px; margin:22px 0 6px; }
.my-ava { position:relative; width:66px; height:66px; border-radius:50%; overflow:hidden; flex:none; border:2.4px solid var(--my-accent); background:var(--background-section); display:grid; place-items:center; }
.my-ava-fallback { font-family:'Oswald',sans-serif; font-size:23px; color:var(--my-accent); }
.my-ava-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.my-name { font-family:'Oswald',sans-serif; font-size:26px; font-weight:700; line-height:1.05; color:var(--text-primary); }
.my-pills { display:flex; align-items:center; gap:8px; margin-top:5px; }
.my-pill { font-size:12px; font-weight:600; padding:3px 10px; border-radius:999px; background:color-mix(in srgb, var(--my-accent) 16%, transparent); color:var(--my-accent); }
.my-faint { color:var(--text-muted); font-size:12px; }

.my-sectlabel { font-size:11px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color:var(--text-secondary); margin:26px 0 12px; display:flex; align-items:center; gap:10px; }
.my-sectlabel::after { content:""; flex:1; height:1px; background:var(--border-light); }

/* Hero-Kacheln */
.my-tiles { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
@media (min-width:560px){ .my-tiles { grid-template-columns:repeat(4,1fr); } }
.my-tile { background:var(--background-section); border:1px solid var(--border-light); border-radius:16px; padding:15px 14px; }
.my-tile .k { font-size:10.5px; text-transform:uppercase; letter-spacing:.8px; color:var(--text-secondary); }
.my-tile .v { font-family:'Oswald',sans-serif; font-size:30px; line-height:1.05; margin-top:7px; color:var(--text-primary); }
.my-tile .v small { font-size:13px; color:var(--text-secondary); font-family:inherit; }
.my-tile .x { font-size:11.5px; color:var(--text-muted); margin-top:3px; }
.my-tile.hl { border-color:color-mix(in srgb, var(--my-accent) 45%, var(--border-light)); background:linear-gradient(180deg, color-mix(in srgb, var(--my-accent) 12%, var(--background-section)), var(--background-section)); }
.my-tile.hl .v { color:var(--my-accent); }

/* Fortschritt */
.my-cards2 { display:grid; grid-template-columns:1fr; gap:12px; }
@media (min-width:560px){ .my-cards2 { grid-template-columns:1fr 1fr; } }
.my-card { background:var(--background-section); border:1px solid var(--border-light); border-radius:16px; padding:16px; }
.my-card h3 { font-family:'Oswald',sans-serif; font-weight:600; font-size:16px; margin:0 0 12px; color:var(--text-primary); }
.my-kv { display:flex; justify-content:space-between; align-items:baseline; padding:8px 0; border-top:1px solid var(--border-light); font-size:13.5px; }
.my-kv:first-of-type { border-top:0; }
.my-kv .lab { color:var(--text-secondary); }
.my-kv .val { font-family:'IBM Plex Mono',monospace; font-weight:600; color:var(--text-primary); }
.my-delta { font-family:'IBM Plex Mono',monospace; font-weight:600; font-size:12px; }
.my-delta.up { color:var(--my-green); } .my-delta.down { color:#e06464; }
.my-prog { margin:12px 0 2px; }
.my-prog .meta { display:flex; justify-content:space-between; font-size:12px; color:var(--text-secondary); margin-bottom:6px; }
.my-prog .meta b { color:var(--text-primary); font-family:'IBM Plex Mono',monospace; }
.my-pbar { height:9px; border-radius:6px; background:var(--background-card); overflow:hidden; }
.my-pbar i { display:block; height:100%; background:linear-gradient(90deg, var(--my-accent), color-mix(in srgb, var(--my-accent) 60%, var(--my-sky))); }
.my-x { font-size:11.5px; color:var(--text-muted); margin-top:6px; }

/* Badges */
.my-badgewrap { background:var(--background-section); border:1px solid var(--border-light); border-radius:16px; padding:16px; }
.my-bsum { display:flex; gap:18px; flex-wrap:wrap; }
.my-bsum .s b { font-family:'Oswald',sans-serif; font-size:22px; color:var(--my-accent); }
.my-bsum .s small { display:block; font-size:9.5px; letter-spacing:.8px; text-transform:uppercase; color:var(--text-secondary); }
.my-bgrid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-top:14px; }
@media (min-width:560px){ .my-bgrid { grid-template-columns:repeat(3,1fr); } }
.my-bitem { display:flex; gap:11px; align-items:center; background:var(--background-card); border:1px solid var(--border-light); border-radius:12px; padding:10px 11px; }
.my-bicon { position:relative; width:42px; height:42px; flex:none; display:grid; place-items:center; }
.my-bfallback { width:34px; height:37px; clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%); background:linear-gradient(145deg, var(--my-accent), color-mix(in srgb, var(--my-accent) 55%, #7a4f00)); display:grid; place-items:center; color:#2a1c00; font-family:'Oswald',sans-serif; font-weight:700; font-size:13px; }
.my-bicon.single .my-bfallback { background:color-mix(in srgb, var(--my-sky) 30%, var(--background-section)); color:var(--text-primary); }
.my-bimg { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
.my-lvlpip { position:absolute; bottom:-3px; right:-5px; font-family:'Oswald',sans-serif; font-size:9px; font-weight:700; color:var(--my-accent); background:var(--background-card); border:1px solid var(--border-light); border-radius:5px; padding:0 3px; line-height:1.45; }
.my-bn { font-size:12.5px; line-height:1.2; color:var(--text-primary); }
.my-bl { font-size:10.5px; color:var(--text-secondary); margin-top:2px; }
.my-newtag { font-size:9px; font-weight:700; letter-spacing:.4px; color:var(--my-green); background:color-mix(in srgb, var(--my-green) 16%, transparent); padding:1px 6px; border-radius:999px; margin-left:6px; }

/* Flüge-Tabelle */
.my-ftwrap { background:var(--background-section); border:1px solid var(--border-light); border-radius:16px; padding:6px 14px 10px; overflow-x:auto; }
.my-ft { width:100%; border-collapse:collapse; font-size:12.5px; min-width:380px; }
.my-ft th { text-align:right; color:var(--text-secondary); font-weight:600; font-size:9.5px; text-transform:uppercase; letter-spacing:.5px; padding:9px 6px; border-bottom:1px solid var(--border-light); }
.my-ft th.l, .my-ft td.l { text-align:left; }
.my-ft td { padding:9px 6px; border-bottom:1px solid var(--border-light); font-family:'IBM Plex Mono',monospace; text-align:right; color:var(--text-primary); }
.my-ft tr:last-child td { border-bottom:0; }
.my-ft a, .my-flink { color:var(--my-sky); text-decoration:none; }
.my-ft a:hover, .my-flink:hover { text-decoration:underline; }

/* Bestwerte */
.my-pb { display:grid; grid-template-columns:1fr; gap:10px; }
@media (min-width:560px){ .my-pb { grid-template-columns:repeat(3,1fr); } }
.my-pbcard { background:var(--background-section); border:1px solid var(--border-light); border-radius:16px; padding:15px; border-left:3px solid var(--my-sky); }
.my-pbcard.gold { border-left-color:var(--my-accent); }
.my-pbcard.green { border-left-color:var(--my-green); }
.my-pbcard .k { font-size:10.5px; text-transform:uppercase; letter-spacing:.8px; color:var(--text-secondary); }
.my-pbcard .v { font-family:'Oswald',sans-serif; font-size:26px; margin-top:6px; color:var(--text-primary); }
.my-pbcard .v small { font-size:13px; color:var(--text-secondary); font-family:inherit; }
.my-pbcard .x { font-size:11.5px; color:var(--text-muted); margin-top:3px; }