/* MyStudyCorner's own look, laid over the pages it shares with the other site (html.msc, set in base.html):
   rounded Nunito type in sentence case, pill buttons, crisp flat cards with thin borders, white fields. */

html.msc body {
    font-family: 'Nunito', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
    -webkit-font-smoothing: antialiased;
}

/* Sentence case instead of small spaced-out capitals */
html.msc .uppercase { text-transform: none; }
html.msc [class*="tracking-["],
html.msc .tracking-widest,
html.msc .tracking-wider,
html.msc .tracking-wide { letter-spacing: 0.005em; }
html.msc .tracking-tight { letter-spacing: -0.01em; }
html.msc .font-black { font-weight: 800; }
html.msc .text-\[9px\] { font-size: 11px; }
html.msc .text-\[10px\] { font-size: 11.5px; }
html.msc .text-\[11px\] { font-size: 12.5px; }

/* Buttons are pills */
html.msc :is(a, button, input[type="submit"]):is([class*="bg-brand-navy"], [class*="bg-brand-burgundy"], [class*="bg-brand-gold"], [class*="bg-[#"], .bg-white):is([class*="py-2"], [class*="py-3"], [class*="py-4"]):not(.msc-keep-shape) {
    border-radius: 9999px;
}

/* Cards: smaller corners, a thin blue-grey edge, barely any shadow */
html.msc :is(.rounded-\[2rem\], .rounded-\[2\.5rem\], .rounded-\[3rem\], .rounded-3xl):not(.msc-keep-shape) { border-radius: 1.25rem; }
html.msc .shadow-sm { --tw-shadow: 0 1px 2px rgba(13, 60, 120, 0.05); }
html.msc .shadow-md,
html.msc .shadow-lg { --tw-shadow: 0 6px 18px -10px rgba(13, 60, 120, 0.22); }
html.msc .shadow-xl,
html.msc .shadow-2xl { --tw-shadow: 0 16px 40px -22px rgba(13, 60, 120, 0.35); }
html.msc .border-slate-100,
html.msc .border-gray-100,
html.msc .border-slate-200,
html.msc .border-gray-200,
html.msc .border-brand-line { border-color: #DCE5F0; }

/* The other site's grid-paper backgrounds */
html.msc [class*="bg-[size:4rem_4rem]"] { display: none; }

/* Fields: white, clear edge, blue focus */
html.msc :is(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="hidden"]):not([type="range"]):not([type="file"]):not([type="button"]), select, textarea):not(.bg-transparent):not(.border-0):not(.border-none):not(.msc-keep-shape) {
    background-color: #fff;
    border: 1.5px solid #D3DEEB;
    border-radius: 0.875rem;
    box-shadow: none;
}
html.msc :is(input, select, textarea):not(.bg-transparent):not(.border-0):not(.border-none):focus {
    border-color: #0D3C78;
    box-shadow: 0 0 0 4px rgba(13, 60, 120, 0.12);
    outline: none;
}
html.msc input[type="checkbox"] { accent-color: #E06500; }

/* Pieces of MyStudyCorner's own pages */
html.msc .msc-dots { display: inline-flex; gap: 4px; }
html.msc .msc-dots i { width: 8px; height: 8px; border-radius: 9999px; display: block; }
html.msc .msc-corner { border-radius: 1.75rem 1.75rem 1.75rem 0.375rem; }
html.msc .msc-corner-tr { border-radius: 1.75rem 0.375rem 1.75rem 1.75rem; }
html.msc .msc-underline { background-image: linear-gradient(transparent 62%, rgba(252, 180, 0, 0.45) 62%); }
