/* Campus Socials — style skins.
 * Classic is app.css on its own: no data-skin attribute, nothing here applies.
 * html[data-skin="mix"] = Blend (Classic meets neobrutal), html[data-skin="neo"] = Neo (neobrutal).
 * Delete this file and its enqueue to remove both. */

@font-face { font-family: 'Lilita One'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/lilita-one-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Lilita One'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/lilita-one-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* ================= Tokens ================= */

/* Blend, light */
html[data-skin="mix"] {
	--font-display: 'Lilita One', 'DM Sans', system-ui, sans-serif;
	--bw: 1.75px;
	--yellow: #FFDA5C; --aqua: #6FEBD8;
	--canvas: #F3E8D4; --app: #FDF7EC; --solid: #FDF7EC; --header: #FDF7EC;
	--line: #CDB89F; --dash: #C2AB90;
	--primary: #FFDA5C; --tab-active: #FFDA5C; --nav-active: #6FEBD8;
	--official: #FF9147; --lecturer: #B9A3FF;
	--pin-bg: #FFF2C0; --unread: #FFF2C0; --warning-soft: #FFF2C0;
	--tag-bg: #CDF6EE; --chip-soft: #CDF6EE; --poll-bar: #E0F8F3;
	--tabbar: #D9CCFB; --tab-on: #FFFFFF; --nav-badge: #FF7FA3;
	--pop: 3px 3px 0 var(--edge);
	--card-pop: 2px 2px 0 var(--edge);
	--ink-3: #6E5A4A;
}
/* Blend, dark */
html[data-skin="mix"][data-theme="dark"] {
	--canvas: #0D0A07; --app: #18120C; --solid: #18120C; --header: #18120C;
	--line: #4A3C30; --dash: #4A3C30;
	--pin-bg: #33290F; --unread: #33290F; --warning-soft: #33290F;
	--tag-bg: #133F39; --tag-fg: #9FF2E4; --chip-soft: #133F39; --poll-bar: #133F39;
	--tabbar: #2E2547; --tab-on: #D9CCFB; --nav-badge: #FF7FA3;
	--pop: 3px 3px 0 var(--edge);
	--card-pop: 2px 2px 0 var(--edge);
	--ink-3: #C4B3A2;
}

/* Neo, light */
html[data-skin="neo"] {
	--font-display: 'Lilita One', 'DM Sans', system-ui, sans-serif;
	--font-mono: 'DM Sans', system-ui, sans-serif;
	--bw: 2px;
	--yellow: #FFD62E; --aqua: #00EED0;
	--canvas: #F5E6D0; --app: #FFF5E8; --solid: #FFF5E8; --header: #FFF5E8;
	--surface-2: #FFF5E8; --hover: #FBEBD6;
	--line: #381600; --dash: #381600;
	--primary: #FFD62E; --tab-active: #FFD62E; --nav-active: #00EED0; --soft: #D4FAF5;
	--verified: #00EED0; --official: #FF8A3D; --lecturer: #8C6CFF;
	--pin-bg: #FFF1B8; --unread: #FFF1B8; --warning-soft: #FFF1B8;
	--tag-bg: #D4FAF5; --chip-soft: #D4FAF5; --poll-bar: #D4FAF5;
	--tabbar: #FFFFFF; --tab-on: #00EED0; --nav-badge: #FF5C8A;
	--like-fill: #FF5C8A; --price: #381600;
	--pop: 3px 3px 0 var(--edge);
	--card-pop: 3px 3px 0 var(--edge);
	--ink-2: #5A4636; --ink-3: #6E5C51;
}
/* Neo, dark */
html[data-skin="neo"][data-theme="dark"] {
	--canvas: #0D0905; --app: #1A120B; --solid: #1A120B; --header: #1A120B;
	--surface: #261B12; --surface-2: #2E2217; --hover: #33261A;
	--edge: #F5DFC0; --line-strong: #F5DFC0; --line: #6B5442; --dash: #6B5442;
	--ink: #FFF5E8; --ink-2: #E8D6C2; --ink-3: #CDB9A4;
	--soft: #0F3D37; --on-soft: #7FF5E4;
	--pin-bg: #3A2C0A; --unread: #3A2C0A; --warning-soft: #3A2C0A;
	--tag-bg: #0F3D37; --tag-fg: #7FF5E4; --chip-soft: #0F3D37; --poll-bar: #0F3D37;
	--tabbar: #261B12; --tab-on: #00EED0; --nav-badge: #FF5C8A;
	--like-fill: #FF5C8A; --price: #FFD62E;
	--page-av-bg: #FFD62E; --page-av-fg: #381600;
	--pop: 3px 3px 0 var(--edge);
	--card-pop: 3px 3px 0 var(--edge);
}

/* ================= Shared by both skins ================= */

html[data-skin] { font-synthesis-weight: none; }

/* Cards get a hard shadow */
html[data-skin] :is(.cs-post, .cs-story, .cs-box, .cs-card, .cs-composer, .cs-rail__me, .cs-evpost-card, .cs-evmini, .cs-evfacts,
	.cs-pgcard, .cs-pgbanner, .cs-ldoc, .cs-mkcard, .cs-mymk__row, .cs-ls__seller, .cs-shopstats, .cs-rate, .cs-land__trends,
	.cs-note__post, .cs-notice__card, .cs-notice__post, .st-card, .st-cardx, .st-acct, .cs-pmenu__group, .cs-pman__card, .cs-pman__team,
	.cs-taghero, .cs-flist__box, .cs-mf__review, .cs-blk__facts, .cs-rep__list, .cs-comp__box, .cs-tabs, .cs-ptabs, .adm-box, .cs-gcard, .cs-ginfo__box, .cs-gfiles__pins) {
	box-shadow: var(--card-pop);
}

/* Headings: Lilita One */
html[data-skin] .cs-hello { font: 400 23px/1.2 var(--font-display); letter-spacing: .01em; }
html[data-skin] :is(.cs-screenbar__title, .cs-cmp-head__title) { font-family: var(--font-display); font-weight: 400; font-size: 20px; letter-spacing: .01em; }

/* Main buttons: Lilita One */
html[data-skin] .cs-btn-pop { font: 400 15px/1 var(--font-display); letter-spacing: .02em; }
html[data-skin] .cs-pill-btn.is-primary { font-family: var(--font-display); font-weight: 400; font-size: 15px; letter-spacing: .02em; box-shadow: var(--pop); }
html[data-skin] .cs-rail__new { font: 400 20px/1 var(--font-display); letter-spacing: .02em; }

/* Prices: Lilita One */
html[data-skin] .cs-mkcard__price { font: 400 18px/1.2 var(--font-display); color: var(--price); }
html[data-skin] .cs-ls__price { font: 400 24px/1.2 var(--font-display); color: var(--price); }

/* Hashtags: thick aqua underline */
html[data-skin] .cs-tag { text-decoration-color: var(--aqua); text-decoration-thickness: 2px; text-underline-offset: 3px; }

/* Bars: a heavier line between the bars and the page */
html[data-skin] :is(.cs-screenbar, .cs-xhead, .cs-nhead, .cs-evhead, .cs-evform__head, .cs-nbar, .cs-pe__bar, .cs-chat__head) { border-bottom-color: var(--edge); }

/* Bottom bar badge */
html[data-skin] .cs-tab__badge { color: var(--brown); }

/* ================= Blend only ================= */

html[data-skin="mix"] :is(.cs-circle-btn, .cs-icon-btn) { border-radius: 14px; }
html[data-skin="mix"] :is(.cs-screenbar, .cs-xhead, .cs-nhead, .cs-evhead, .cs-evform__head, .cs-nbar, .cs-pe__bar, .cs-chat__head) { border-bottom-width: 2px; }
html[data-skin="mix"] .cs-tabbar { border-top-width: 2px; }
html[data-skin="mix"] .cs-tab { border-radius: 14px; }
html[data-skin="mix"] .cs-fab { box-shadow: 3px 3px 0 var(--edge), 0 0 0 7px var(--app); }

/* ================= Neo only ================= */

html[data-skin="neo"] :is(.cs-circle-btn, .cs-icon-btn) { border-radius: 12px; box-shadow: 2px 2px 0 var(--edge); }
html[data-skin="neo"] :is(.cs-screenbar, .cs-xhead, .cs-nhead, .cs-evhead, .cs-evform__head, .cs-nbar, .cs-pe__bar, .cs-chat__head) { border-bottom-width: 2.5px; backdrop-filter: none; -webkit-backdrop-filter: none; }
html[data-skin="neo"] .cs-topbar { border-bottom: 2.5px solid var(--edge); }
html[data-skin="neo"] .cs-tabbar { border-top-width: 2.5px; }
html[data-skin="neo"] .cs-tab { border-radius: 13px; }
html[data-skin="neo"] .cs-tab.is-on { color: var(--brown); }
html[data-skin="neo"] .cs-fab { width: 58px; height: 58px; top: -24px; border-radius: 17px; border-width: 2.5px; transform: translateX(-50%) rotate(-4deg); box-shadow: 4px 4px 0 var(--edge); }
html[data-skin="neo"] :is(.cs-campus, .cs-chip) { border-radius: 999px; padding: 0 7px; font-weight: 800; }
html[data-skin="neo"] :is(.cs-tabs__item, .cs-ptabs a, .cs-seg a).is-on { box-shadow: 2px 2px 0 var(--edge); font-weight: 800; }
html[data-skin="neo"] .cs-rail__link { font-size: 16px; }
html[data-skin="neo"] .cs-rail__link.is-on { font-weight: 800; box-shadow: var(--pop); }
html[data-skin="neo"] .cs-rail__count { background: var(--nav-badge); }
html[data-skin="neo"] .cs-mkcard__price { font-size: 16px; display: inline-block; align-self: flex-start; background: var(--yellow); color: var(--brown); border: var(--bw) solid var(--edge); border-radius: 9px; padding: 1px 8px; }
html[data-skin="neo"] :is(.cs-xsearch, .cs-search) { box-shadow: 2px 2px 0 var(--edge); }