/* Direction C: Bulletin.
   The community notice board, made confident: warm cream paper, a deep
   cobalt sidebar, a cream tab for the page you are on, and Bricolage
   Grotesque headlines with real character over Inter for reading.
   Fonts: OFL 1.1, self-hosted in /fonts/bulletin/. */

@font-face { font-family: "Bricolage Grotesque"; src: url("../../fonts/bulletin/bricolage-grotesque.woff2") format("woff2"); font-weight: 200 800; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../../fonts/bulletin/inter.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }

:root[data-brand="bulletin"] {
    /* Cream neutrals: hue 85; ink leans to the cobalt hue (265). */
    --bg: #F7F2E7;          /* oklch(.962 .016 85) */
    --surface: #FEFBF7;     /* oklch(.99 .007 85) */
    --sunken: #F0E9DB;      /* oklch(.935 .02 85) */
    --ink: #161D2B;         /* oklch(.23 .03 265) */
    --ink-2: #4C5361;       /* oklch(.44 .025 265) */
    --ink-3: #59606F;       /* oklch(.49 .025 265) */
    --line: #DDD7CB;        /* oklch(.88 .017 85) */
    --line-strong: #798090; /* oklch(.60 .025 265) */

    /* Accent: cobalt, hue 264. */
    --accent: #1949C5;      /* oklch(.46 .20 264) */
    --accent-hover: #123BA6;
    --on-accent: #FDFAF3;
    --accent-ink: #1745C2;  /* oklch(.45 .20 264) */
    --accent-soft: #DCE8FF; /* oklch(.93 .035 264) */
    --accent-soft-ink: #12389E;

    --focus: #2456D3;
    --danger: #BE241F; --danger-soft: #FFE9E5; --ok: #236436; --warn: #8D5406;

    --nav-bg: #082675;      /* oklch(.31 .14 264) */
    --nav-ink: #F9F5EC; --nav-ink-2: #BCCBE9; --nav-line: #1E3A86;
    --nav-active-bg: #F7F2E7; --nav-active-ink: #161D2B; --nav-hover: #173888; --nav-focus: #F9F5EC;

    --font-display: "Bricolage Grotesque", "Inter", system-ui, sans-serif;
    --font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
    --font-mono: "Inter", system-ui, sans-serif;
    --display-weight: 750; --display-tracking: -0.028em;
    --h1: clamp(2.125rem, 1.4rem + 2vw, 3.25rem); --h1-lh: 1.0;
    --label-font: "Inter", sans-serif; --label-size: .75rem; --label-tracking: .07em; --label-weight: 650;

    --r-s: 8px; --r-m: 12px; --r-l: 18px; --r-btn: 999px;
    --shadow-1: 0 1px 1px rgb(22 29 43 / .04), 0 2px 4px -1px rgb(22 29 43 / .07);
    --shadow-2: 0 1px 2px rgb(22 29 43 / .05), 0 14px 28px -12px rgb(8 38 117 / .28), 0 4px 10px -4px rgb(22 29 43 / .08);
    --shadow-3: 0 2px 4px rgb(22 29 43 / .06), 0 28px 56px -18px rgb(8 38 117 / .34);
    --icon-stroke: 2;
}

/* Signature: the cream tab. The active nav item is cut from the page
   colour and runs to the sidebar edge, so the page you are on reads as
   pulled out of the board. Headlines are big and set tight. */
@media (min-width: 1024px) {
    [data-brand="bulletin"] .sidebar__panel { padding-right: 0; }
    [data-brand="bulletin"] .nav__link.is-active { border-radius: var(--r-m) 0 0 var(--r-m); margin-right: -1px; padding-right: calc(var(--s3) + var(--s4)); }
    [data-brand="bulletin"] .sidebar__user, [data-brand="bulletin"] .sidebar__dept { margin-right: var(--s4); }
}
[data-brand="bulletin"] .sidebar { border-color: var(--nav-bg); }
[data-brand="bulletin"] .nav__link.is-active .icon { color: var(--accent); }
[data-brand="bulletin"] .sidebar__dept { background: rgb(255 255 255 / .07); box-shadow: inset 0 0 0 1px rgb(255 255 255 / .1); }
[data-brand="bulletin"] .brand__mark { background: var(--nav-ink); color: var(--nav-bg); border-radius: 50%; }
[data-brand="bulletin"] .card__icon { border-radius: 50%; }
[data-brand="bulletin"] .card { border-color: transparent; box-shadow: var(--shadow-1), inset 0 0 0 1px var(--line); }
[data-brand="bulletin"] .card:hover { box-shadow: var(--shadow-2), inset 0 0 0 1px var(--line); }
[data-brand="bulletin"] .card::before {
    content: ""; position: absolute; top: -1px; left: var(--s5); width: 28px; height: 4px;
    border-radius: 0 0 3px 3px; background: var(--accent);
    transform-origin: left; transition: width var(--dur-2) var(--ease-out);
}
[data-brand="bulletin"] .card:hover::before { width: 56px; }
[data-brand="bulletin"] .page-head .label { color: var(--accent-ink); }
[data-brand="bulletin"] .chip[aria-pressed="true"] { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
[data-brand="bulletin"] .avatar { background: var(--accent-soft); color: var(--accent-soft-ink); box-shadow: none; }
[data-brand="bulletin"] .guest__aside { background: var(--nav-bg); }
[data-brand="bulletin"] .guest__title { color: var(--nav-ink); }
@media (min-width: 960px) {
    [data-brand="bulletin"] .guest__title { font-size: clamp(2.5rem, 1rem + 3vw, 3.75rem); line-height: 1; letter-spacing: -0.035em; }
}