fix: adopt frontend-base shell style manifest

The shell stylesheet moved from a SCSS file to a JS manifest at
@openedx/frontend-base/shell/style. Imports it directly from
site.config.dev.tsx and drops the now-redundant site.scss. Also fixes
two @media queries in _base_component.scss that used a single-dash
custom-media name and were silently non-matching.

Refs openedx/frontend-base#232

Co-Authored-By: Claude <noreply@anthropic.com>

Author: arbrandes

package-lock.json

@@ -10,8 +10,7 @@
     "url": "git+https://github.com/openedx/frontend-app-authn.git"
   },
   "exports": {
-    ".": "./dist/index.js",
-    "./app.scss": "./dist/app.scss"
+    ".": "./dist/index.js"
   },
   "files": [
     "/dist"
@@ -59,7 +58,6 @@
     "url": "https://github.com/openedx/frontend-app-authn/issues"
   },
   "dependencies": {
-    "@edx/brand": "npm:@openedx/brand-openedx@^1.2.3",
     "@edx/openedx-atlas": "^0.7.0",
     "@fortawesome/fontawesome-svg-core": "^6.7.2",
     "@fortawesome/free-brands-svg-icons": "^6.7.2",

package.json

@@ -2,7 +2,7 @@ import { EnvironmentTypes, SiteConfig } from '@openedx/frontend-base';
 
 import { authnApp } from './src';
 
-import './src/app.scss';
+import '@openedx/frontend-base/shell/style';
 
 const siteConfig: SiteConfig = {
   siteId: 'authn-dev',

site.config.dev.tsx

@@ -6,7 +6,7 @@ import {
   registerIcons,
 } from './common-components';
 
-import './sass/_style.scss';
+import './style.scss';
 
 registerIcons();
 

src/Main.tsx

@@ -59,7 +59,7 @@
   margin-bottom: 0.5rem;
   font-weight: 700;
 
-  @media (-pgn-size-breakpoint-max-width-xl) {
+  @media (--pgn-size-breakpoint-max-width-xl) {
     font-size: 1.375rem;
     line-height: 1.75rem;
   }
@@ -71,7 +71,7 @@
 }
 
 .large-screen-left-container {
-  @media (-pgn-size-breakpoint-max-width-xl) {
+  @media (--pgn-size-breakpoint-max-width-xl) {
     flex: 0 0 25%;
     max-width: 25%;
   }

src/app.scss

@@ -1,10 +1,12 @@
+@use "@openedx/paragon/styles/css/core/custom-media-breakpoints.css";
+
 // Load component based styles
-@use "_base_component.scss";
-@use "_registration.scss";
-@use "_reset_password.scss";
-@use "_progressive_profiling_page.scss";
-@use "_login_page.scss";
-@use "_forgot_password.scss";
+@use "./sass/base_component";
+@use "./sass/registration";
+@use "./sass/reset_password";
+@use "./sass/progressive_profiling_page";
+@use "./sass/login_page";
+@use "./sass/forgot_password";
 
 //
 // ----------------------------