/* 15 Seconds hub (v1.1.0). Everything is scoped under .h15-*. Each app themes it with these variables.
   Defaults sit on :where(html) (zero specificity) so an app's own :root values always win, whatever the load order. */
:where(html){--h15-ink:#1C1C1C;--h15-text:#3A3A3A;--h15-mute:#6E6E6E;--h15-rule:#D6D6D6;--h15-tint:#F4F4F4;--h15-accent:#D22027;--h15-ok:#1E7A46;
  --h15-head:system-ui,sans-serif;--h15-body:system-ui,sans-serif;--h15-radius:14px;--h15-upper:uppercase;--h15-bg:#fff}
.h15-ov{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.45);display:flex;align-items:flex-end;justify-content:center}
.h15-ov[hidden]{display:none}
.h15-own{background:var(--h15-bg);width:100%;max-width:480px;max-height:88vh;overflow:auto;border-radius:18px 18px 0 0;padding:20px 18px calc(18px + env(safe-area-inset-bottom))}
@media (min-width:700px){.h15-ov{align-items:center}.h15-own{border-radius:18px}}
.h15-pane{font-family:var(--h15-body);color:var(--h15-text)}
.h15-head{display:flex;align-items:center;gap:8px;font:800 13px/1 var(--h15-head);letter-spacing:.18em;color:var(--h15-ink);text-transform:uppercase}
.h15-sq{width:10px;height:10px;background:var(--h15-accent);display:inline-block}
.h15-body{margin-top:14px}
.h15-list{display:flex;flex-direction:column;gap:8px}
.h15-app{display:flex;align-items:center;gap:12px;padding:12px;border:1.5px solid var(--h15-rule);border-radius:var(--h15-radius);text-decoration:none;color:inherit;background:var(--h15-bg);min-height:64px}
a.h15-app:hover,a.h15-app:focus-visible{border-color:var(--h15-ink);outline:none}
.h15-app.here{background:var(--h15-tint);border-color:var(--h15-tint)}
.h15-mk{flex:0 0 40px;height:40px;border-radius:10px;background:var(--h15-c,#333);color:#fff;display:flex;align-items:center;justify-content:center;font:800 15px/1 var(--h15-head);letter-spacing:.04em}
.h15-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.h15-nm{font:800 16px/1.1 var(--h15-head);color:var(--h15-ink);text-transform:var(--h15-upper);letter-spacing:.03em}
.h15-tg{font-size:13px;line-height:1.3;color:var(--h15-mute)}
.h15-st{flex:0 0 auto;max-width:42%;text-align:right;font-size:12px;line-height:1.25;color:var(--h15-mute)}
.h15-st.on{color:var(--h15-ok);font-weight:700}
.h15-st i{font-style:normal;margin-right:4px}
.h15-note{font-size:12.5px;line-height:1.4;color:var(--h15-mute);margin:10px 2px 0}
.h15-close{display:block;width:100%;margin-top:16px;padding:13px;border-radius:999px;border:1.5px solid var(--h15-ink);background:transparent;color:var(--h15-ink);font:700 14px/1 var(--h15-head);letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.h15-ver{text-align:center;font-size:11px;color:var(--h15-mute);margin-top:10px}
/* My Mentor card */
.h15-mentor{margin:16px 0;padding:16px;border-radius:var(--h15-radius);background:var(--h15-tint);border-left:4px solid var(--h15-accent);color:var(--h15-text)}
.h15-mentor.dark{background:#1C1C1C;color:#D9D9D9}
.h15-mh{display:flex;justify-content:space-between;align-items:center;gap:8px}
.h15-cap{font:700 11.5px/1.2 var(--h15-head);letter-spacing:.16em;text-transform:uppercase;color:var(--h15-accent)}
.h15-role{font:700 11px/1 var(--h15-head);letter-spacing:.12em;text-transform:uppercase;padding:5px 9px;border-radius:999px;border:1.5px solid currentColor;color:var(--h15-ink)}
.h15-mentor.dark .h15-role,.h15-mentor.dark .h15-who,.h15-mentor.dark .h15-v{color:#fff}
.h15-who{margin-top:8px;font:800 19px/1.15 var(--h15-head);color:var(--h15-ink);text-transform:var(--h15-upper);letter-spacing:.02em}
.h15-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.h15-grid>div{display:flex;flex-direction:column;gap:3px;min-width:0}
.h15-k{font:700 11px/1.2 var(--h15-head);letter-spacing:.14em;text-transform:uppercase;color:var(--h15-mute)}
.h15-v{font-weight:700;font-size:15px;line-height:1.3;color:var(--h15-ink)}
.h15-rel{font-size:12.5px;font-weight:700;color:var(--h15-accent)}
.h15-rel.past{color:var(--h15-mute)}
.h15-pl{font-size:12.5px;line-height:1.3;color:var(--h15-mute)}
.h15-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.h15-btn{flex:1 1 140px;text-align:center;padding:11px 14px;border-radius:999px;border:1.5px solid var(--h15-ink);color:var(--h15-ink);text-decoration:none;font:700 13px/1 var(--h15-head);letter-spacing:.1em;text-transform:uppercase}
.h15-btn.pri{background:var(--h15-accent);border-color:var(--h15-accent);color:#fff}
.h15-mentor.dark .h15-btn:not(.pri){border-color:#fff;color:#fff}
.h15-more{font-size:12.5px;color:var(--h15-mute);margin-top:10px}
@media (max-width:360px){.h15-grid{grid-template-columns:1fr}}
.h15-prefs{margin-top:12px;font:14px/1.4 var(--h15-body);color:var(--h15-text)}
.h15-prefs summary{cursor:pointer;font:700 11px/1.2 var(--h15-head);letter-spacing:.14em;text-transform:uppercase;color:var(--h15-mute);list-style:none;display:inline-flex;align-items:center;gap:6px;padding:4px 0}
.h15-prefs summary::-webkit-details-marker{display:none}
.h15-prefs summary::before{content:"▸";font-size:10px}
.h15-prefs[open] summary::before{content:"▾"}
.h15-prefs label{display:flex;align-items:center;gap:10px;margin-top:8px;cursor:pointer}
.h15-prefs input{width:18px;height:18px;accent-color:var(--h15-accent);flex:0 0 auto}
.h15-prefs p{margin:6px 0 0;font-size:12.5px;color:var(--h15-mute)}
.h15-mentor.dark .h15-prefs,.h15-mentor.dark .h15-prefs summary,.h15-mentor.dark .h15-prefs p{color:#ddd}
