/* ============================================================================
   app.css — Static, production-ready stylesheet for the Glacier theme.
   Replaces the dev-only Tailwind Play CDN (cdn.tailwindcss.com), which is not
   meant for production and was failing to load on mobile, leaving the site
   completely unstyled.

   This is a hand-built, self-contained subset of Tailwind covering ONLY the
   utility classes actually used by the views in app/views/. If you add NEW
   Tailwind classes to a view, you must add the corresponding rule here.
   ============================================================================ */

/* ---------- Reset (Tailwind Preflight, trimmed) ---------- */
*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:currentColor}
::before,::after{--tw-content:''}
html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:Inter,ui-sans-serif,system-ui,sans-serif}
body{margin:0;line-height:inherit}
hr{height:0;color:inherit;border-top-width:1px}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit;margin:0}
a{color:inherit;text-decoration:inherit}
b,strong{font-weight:bolder}
img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}
img,video{max-width:100%;height:auto}
button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}
button,select{text-transform:none}
button,[type='button'],[type='submit']{-webkit-appearance:button;background-color:transparent;background-image:none;cursor:pointer}
:-moz-focusring{outline:auto}
ol,ul,menu{list-style:none;margin:0;padding:0}
p,blockquote,figure{margin:0}
textarea{resize:vertical}
input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}
[hidden]{display:none}

/* ============================================================================
   THEME COLOR VARIABLES (from tailwind.config in header.php)
   ============================================================================ */
:root{
  --c-inverse-primary:#0a4c6e; --c-primary-fixed-dim:#7dd3fc; --c-surface-container-lowest:#0a0e1a;
  --c-on-primary:#001f2e; --c-surface-bright:#1a2438; --c-error:#ff6b6b; --c-tertiary-fixed:#e8d0ff;
  --c-on-tertiary-fixed-variant:#4d2a73; --c-background:#0a0e1a; --c-surface-container-highest:#202c42;
  --c-secondary-fixed-dim:#88b4cc; --c-secondary-container:#1a3a4e; --c-inverse-on-surface:#0a0e1a;
  --c-tertiary-fixed-dim:#c8a0f0; --c-on-tertiary:#1a002e; --c-on-error:#1a0000; --c-error-container:#3d1414;
  --c-secondary:#88b4cc; --c-on-primary-fixed:#001f2e; --c-outline-variant:#2a3a48; --c-on-background:#e0e8f0;
  --c-on-tertiary-fixed:#1a002e; --c-on-secondary-fixed:#0d1f2b; --c-tertiary:#c8a0f0;
  --c-surface-container-high:#1a2438; --c-surface-variant:#1a2438; --c-on-surface:#e0e8f0;
  --c-on-secondary-container:#c0d8e8; --c-surface-tint:#7dd3fc; --c-on-primary-container:#c8eaff;
  --c-surface:#0f1524; --c-on-secondary-fixed-variant:#2a4a5e; --c-on-error-container:#ffb3b3;
  --c-surface-dim:#0f1524; --c-surface-container-low:#111828; --c-outline:#4a6070; --c-primary:#7dd3fc;
  --c-on-tertiary-container:#e8d0ff; --c-on-surface-variant:#a0b4c4; --c-inverse-surface:#e0e8f0;
  --c-surface-container:#141c2e; --c-primary-fixed:#c8eaff; --c-on-secondary:#001f2e;
  --c-tertiary-container:#3d2060; --c-secondary-fixed:#c0d8e8; --c-primary-container:#0e4d6e;
  --c-on-primary-fixed-variant:#004d73;
}

/* ============================================================================
   LAYOUT / DISPLAY
   ============================================================================ */
.block{display:block}.inline-block{display:inline-block}.inline-flex{display:inline-flex}
.flex{display:flex}.grid{display:grid}.hidden{display:none}
.flex-col{flex-direction:column}.flex-1{flex:1 1 0%}.flex-grow{flex-grow:1}.flex-wrap{flex-wrap:wrap}
.shrink-0{flex-shrink:0}.grow{flex-grow:1}
.items-center{align-items:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}
.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.order-1{order:1}.order-2{order:2}

/* Position */
.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.sticky{position:sticky}
.inset-0{inset:0}.top-0{top:0}.bottom-0{bottom:0}.left-0{left:0}.right-0{right:0}
.top-1\/2{top:50%}.-top-3{top:-.75rem}.-top-20{top:-5rem}.-right-3{right:-.75rem}.-right-20{right:-5rem}
.z-0{z-index:0}.z-10{z-index:10}.z-50{z-index:50}

/* Sizing */
.w-2{width:.5rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-14{width:3.5rem}.w-16{width:4rem}
.w-20{width:5rem}.w-32{width:8rem}.w-64{width:16rem}.w-96{width:24rem}
.w-full{width:100%}.w-max{width:max-content}.min-w-0{min-width:0}
.h-2{height:.5rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-14{height:3.5rem}.h-16{height:4rem}
.h-64{height:16rem}.h-96{height:24rem}.h-auto{height:auto}.h-full{height:100%}
.min-h-screen{min-height:100vh}.min-h-\[88vh\]{min-height:88vh}
.max-w-md{max-width:28rem}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}
.max-w-4xl{max-width:56rem}.max-w-5xl{max-width:64rem}.max-w-6xl{max-width:72rem}
.max-w-7xl{max-width:80rem}.max-w-screen-2xl{max-width:1536px}
.aspect-square{aspect-ratio:1/1}.aspect-video{aspect-ratio:16/9}

/* Columns (masonry) */
.columns-1{columns:1}

/* ============================================================================
   SPACING (margin / padding / gap)
   ============================================================================ */
.mx-auto{margin-left:auto;margin-right:auto}.ml-2{margin-left:.5rem}
.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}
.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-12{margin-top:3rem}
.mb-1{margin-bottom:.25rem}.mb-1\.5{margin-bottom:.375rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}
.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}
.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}.mb-16{margin-bottom:4rem}
.-translate-y-1\/2{--tw-translate-y:-50%;transform:translateY(-50%)}

.p-3{padding:.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-8{padding:2rem}
.p-10{padding:2.5rem}.p-12{padding:3rem}
.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}
.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}
.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-8{padding-left:2rem;padding-right:2rem}
.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}
.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}
.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}
.py-4{padding-top:1rem;padding-bottom:1rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}
.py-12{padding-top:3rem;padding-bottom:3rem}.py-16{padding-top:4rem;padding-bottom:4rem}
.py-20{padding-top:5rem;padding-bottom:5rem}.py-24{padding-top:6rem;padding-bottom:6rem}
.py-32{padding-top:8rem;padding-bottom:8rem}
.pt-2{padding-top:.5rem}.pt-4{padding-top:1rem}.pt-6{padding-top:1.5rem}.pt-20{padding-top:5rem}
.pb-1{padding-bottom:.25rem}.pb-2{padding-bottom:.5rem}.pb-4{padding-bottom:1rem}

.gap-0\.5{gap:.125rem}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}
.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-10{gap:2.5rem}.gap-12{gap:3rem}
.gap-x-8{column-gap:2rem}.gap-y-2{row-gap:.5rem}

.space-y-1>:not([hidden])~:not([hidden]){margin-top:.25rem}
.space-y-2>:not([hidden])~:not([hidden]){margin-top:.5rem}
.space-y-3>:not([hidden])~:not([hidden]){margin-top:.75rem}
.space-y-4>:not([hidden])~:not([hidden]){margin-top:1rem}
.space-y-5>:not([hidden])~:not([hidden]){margin-top:1.25rem}
.space-y-6>:not([hidden])~:not([hidden]){margin-top:1.5rem}
.space-y-8>:not([hidden])~:not([hidden]){margin-top:2rem}
.space-y-12>:not([hidden])~:not([hidden]){margin-top:3rem}

/* ============================================================================
   TYPOGRAPHY
   ============================================================================ */
.font-body,.font-headline{font-family:Inter,sans-serif}
.font-light{font-weight:300}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}
.text-xs{font-size:.75rem;line-height:1rem}.text-sm{font-size:.875rem;line-height:1.25rem}
.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-xl{font-size:1.25rem;line-height:1.75rem}.text-2xl{font-size:1.5rem;line-height:2rem}
.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}
.text-5xl{font-size:3rem;line-height:1}.text-6xl{font-size:3.75rem;line-height:1}
.text-\[16px\]{font-size:16px}.text-\[18px\]{font-size:18px}
.text-center{text-align:center}
.leading-tight{line-height:1.25}.leading-relaxed{line-height:1.625}
.tracking-tight{letter-spacing:-.025em}.tracking-tighter{letter-spacing:-.05em}
.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}
.uppercase{text-transform:uppercase}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.whitespace-nowrap{white-space:nowrap}.whitespace-pre-line{white-space:pre-line}
.underline{text-decoration-line:underline}.align-middle{vertical-align:middle}
.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.line-clamp-3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}
.line-clamp-4{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}

/* ============================================================================
   TEXT COLORS
   ============================================================================ */
.text-primary{color:var(--c-primary)}.text-primary-fixed-dim{color:var(--c-primary-fixed-dim)}
.text-on-surface{color:var(--c-on-surface)}.text-on-surface-variant{color:var(--c-on-surface-variant)}
.text-on-surface-variant\/60{color:rgba(160,180,196,.6)}
.text-on-primary{color:var(--c-on-primary)}.text-tertiary{color:var(--c-tertiary)}
.text-error{color:var(--c-error)}.text-transparent{color:transparent}
.text-\[#001f2e\]{color:#001f2e}.text-\[#a0b4c4\]{color:#a0b4c4}
.text-\[#e0e8f0\]{color:#e0e8f0}.text-\[#ff6b6b\]{color:#ff6b6b}

/* ============================================================================
   BACKGROUND COLORS & GRADIENTS
   ============================================================================ */
.bg-background{background-color:var(--c-background)}.bg-background\/80{background-color:rgba(10,14,26,.8)}
.bg-primary{background-color:var(--c-primary)}
.bg-primary\/5{background-color:rgba(125,211,252,.05)}.bg-primary\/10{background-color:rgba(125,211,252,.1)}
.bg-primary\/15{background-color:rgba(125,211,252,.15)}.bg-primary\/20{background-color:rgba(125,211,252,.2)}
.bg-surface-container{background-color:var(--c-surface-container)}
.bg-surface-container\/30{background-color:rgba(20,28,46,.3)}.bg-surface-container\/50{background-color:rgba(20,28,46,.5)}
.bg-surface-container-high{background-color:var(--c-surface-container-high)}
.bg-surface-container-high\/40{background-color:rgba(26,36,56,.4)}
.bg-surface-container-highest{background-color:var(--c-surface-container-highest)}
.bg-surface-container-highest\/30{background-color:rgba(32,44,66,.3)}
.bg-surface-container-highest\/40{background-color:rgba(32,44,66,.4)}
.bg-surface-container-highest\/50{background-color:rgba(32,44,66,.5)}
.bg-surface-container-lowest{background-color:var(--c-surface-container-lowest)}
.bg-surface-container-lowest\/50{background-color:rgba(10,14,26,.5)}
.bg-surface\/60{background-color:rgba(15,21,36,.6)}.bg-surface\/70{background-color:rgba(15,21,36,.7)}
.bg-surface\/80{background-color:rgba(15,21,36,.8)}.bg-surface\/90{background-color:rgba(15,21,36,.9)}
.bg-tertiary\/10{background-color:rgba(200,160,240,.1)}.bg-tertiary\/20{background-color:rgba(200,160,240,.2)}
.bg-error\/10{background-color:rgba(255,107,107,.1)}
.bg-\[#202c42\]\/50{background-color:rgba(32,44,66,.5)}.bg-\[#7dd3fc\]{background-color:#7dd3fc}
.bg-\[#ff6b6b\]\/10{background-color:rgba(255,107,107,.1)}
.bg-clip-text{-webkit-background-clip:text;background-clip:text}

.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}
.bg-gradient-to-t{background-image:linear-gradient(to top,var(--tw-gradient-stops))}
.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}
.from-primary{--tw-gradient-from:#7dd3fc;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(125,211,252,0))}
.from-primary\/10{--tw-gradient-from:rgba(125,211,252,.1);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(125,211,252,0))}
.from-background{--tw-gradient-from:#0a0e1a;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(10,14,26,0))}
.via-background\/80{--tw-gradient-stops:var(--tw-gradient-from),rgba(10,14,26,.8),var(--tw-gradient-to,rgba(10,14,26,0))}
.via-transparent{--tw-gradient-stops:var(--tw-gradient-from),transparent,var(--tw-gradient-to,rgba(0,0,0,0))}
.to-tertiary{--tw-gradient-to:#c8a0f0}.to-tertiary\/10{--tw-gradient-to:rgba(200,160,240,.1)}
.to-background{--tw-gradient-to:#0a0e1a}.to-transparent{--tw-gradient-to:transparent}

/* ============================================================================
   BORDERS
   ============================================================================ */
.border{border-width:1px}.border-b{border-bottom-width:1px}.border-b-2{border-bottom-width:2px}
.border-t{border-top-width:1px}.border-r{border-right-width:1px}
.border-transparent{border-color:transparent}
.border-primary{border-color:var(--c-primary)}
.border-primary\/5{border-color:rgba(125,211,252,.05)}.border-primary\/10{border-color:rgba(125,211,252,.1)}
.border-primary\/15{border-color:rgba(125,211,252,.15)}.border-primary\/20{border-color:rgba(125,211,252,.2)}
.border-primary\/30{border-color:rgba(125,211,252,.3)}.border-primary\/50{border-color:rgba(125,211,252,.5)}
.border-outline-variant{border-color:var(--c-outline-variant)}
.border-outline-variant\/50{border-color:rgba(42,58,72,.5)}
.border-tertiary\/30{border-color:rgba(200,160,240,.3)}
.border-error\/30{border-color:rgba(255,107,107,.3)}
.border-\[#7dd3fc\]\/15{border-color:rgba(125,211,252,.15)}
.border-\[#ff6b6b\]\/40{border-color:rgba(255,107,107,.4)}

.rounded{border-radius:.5rem}.rounded-lg{border-radius:1rem}.rounded-xl{border-radius:1.5rem}
.rounded-2xl{border-radius:1rem}.rounded-3xl{border-radius:1.5rem}.rounded-full{border-radius:9999px}
.rounded-t-xl{border-top-left-radius:1.5rem;border-top-right-radius:1.5rem}

/* ============================================================================
   EFFECTS
   ============================================================================ */
.shadow-\[0_0_10px_rgba\(125\,211\,252\,0\.5\)\]{box-shadow:0 0 10px rgba(125,211,252,.5)}
.shadow-\[0_0_20px_rgba\(125\,211\,252\,0\.3\)\]{box-shadow:0 0 20px rgba(125,211,252,.3)}
.shadow-\[0_0_30px_rgba\(125\,211\,252\,0\.05\)\]{box-shadow:0 0 30px rgba(125,211,252,.05)}
.opacity-0{opacity:0}.opacity-40{opacity:.4}.opacity-80{opacity:.8}
.overflow-hidden{overflow:hidden}.overflow-x-hidden{overflow-x:hidden}
.object-cover{object-fit:cover}
.mix-blend-screen{mix-blend-mode:screen}.pointer-events-none{pointer-events:none}
.backdrop-blur,.backdrop-blur-lg{backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.backdrop-blur-xl{backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.blur-\[80px\]{filter:blur(80px)}.blur-\[120px\]{filter:blur(120px)}
.break-inside-avoid{break-inside:avoid}

/* Transitions & animation */
.transition-all{transition:all .15s cubic-bezier(.4,0,.2,1)}
.transition-colors{transition:color,background-color,border-color,fill,stroke .15s cubic-bezier(.4,0,.2,1)}
.transition-opacity{transition:opacity .15s cubic-bezier(.4,0,.2,1)}
.transition-transform{transition:transform .15s cubic-bezier(.4,0,.2,1)}
.duration-300{transition-duration:.3s}.duration-700{transition-duration:.7s}
.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}
@keyframes pulse{50%{opacity:.5}}

/* ============================================================================
   FORM FILE INPUT
   ============================================================================ */
.file\:bg-primary\/15::file-selector-button{background-color:rgba(125,211,252,.15)}
.file\:border-0::file-selector-button{border-width:0}
.file\:cursor-pointer::file-selector-button{cursor:pointer}
.file\:mr-3::file-selector-button{margin-right:.75rem}
.file\:px-4::file-selector-button{padding-left:1rem;padding-right:1rem}
.file\:py-2::file-selector-button{padding-top:.5rem;padding-bottom:.5rem}
.file\:rounded-lg::file-selector-button{border-radius:1rem}
.file\:text-primary::file-selector-button{color:var(--c-primary)}

/* ============================================================================
   SELECTION
   ============================================================================ */
.selection\:bg-primary\/30 ::selection{background-color:rgba(125,211,252,.3)}
.selection\:text-primary-fixed ::selection{color:var(--c-primary-fixed)}

/* ============================================================================
   STATE VARIANTS — hover / focus / group-hover
   ============================================================================ */
.hover\:text-primary:hover{color:var(--c-primary)}
.hover\:text-on-surface:hover{color:var(--c-on-surface)}
.hover\:text-primary-fixed-dim:hover{color:var(--c-primary-fixed-dim)}
.hover\:bg-primary\/10:hover{background-color:rgba(125,211,252,.1)}
.hover\:bg-primary\/30:hover{background-color:rgba(125,211,252,.3)}
.hover\:bg-primary-fixed:hover{background-color:var(--c-primary-fixed)}
.hover\:bg-error\/10:hover{background-color:rgba(255,107,107,.1)}
.hover\:bg-surface-container-high:hover{background-color:var(--c-surface-container-high)}
.hover\:bg-surface-container-highest:hover{background-color:var(--c-surface-container-highest)}
.hover\:border-primary\/30:hover{border-color:rgba(125,211,252,.3)}
.hover\:opacity-90:hover{opacity:.9}
.hover\:underline:hover{text-decoration-line:underline}
.active\:scale-95:active{transform:scale(.95)}

.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}
.focus\:ring-1:focus{box-shadow:0 0 0 1px var(--tw-ring-color,rgba(125,211,252,.3))}
.focus\:ring-primary\/30:focus{--tw-ring-color:rgba(125,211,252,.3);box-shadow:0 0 0 1px rgba(125,211,252,.3)}
.focus\:ring-\[#7dd3fc\]\/30:focus{--tw-ring-color:rgba(125,211,252,.3);box-shadow:0 0 0 1px rgba(125,211,252,.3)}
.focus\:border-primary\/50:focus{border-color:rgba(125,211,252,.5)}
.focus\:border-\[#7dd3fc\]\/50:focus{border-color:rgba(125,211,252,.5)}

.group:hover .group-hover\:opacity-100{opacity:1}
.group:hover .group-hover\:scale-105{transform:scale(1.05)}
.group:hover .group-hover\:translate-x-1{transform:translateX(.25rem)}
.group:hover .group-hover\:text-primary{color:var(--c-primary)}
.group:hover .group-hover\:bg-tertiary\/20{background-color:rgba(200,160,240,.2)}

/* ============================================================================
   PROSE (article body)
   ============================================================================ */
.prose-invert{color:var(--c-on-surface-variant)}
.prose-invert h1,.prose-invert h2,.prose-invert h3,.prose-invert h4{color:var(--c-on-surface);font-weight:700;margin:1.5em 0 .6em}
.prose-invert p{margin:0 0 1em}
.prose-invert a{color:var(--c-primary);text-decoration:underline}
.prose-invert ul{list-style:disc;padding-left:1.5em;margin:0 0 1em}
.prose-invert ol{list-style:decimal;padding-left:1.5em;margin:0 0 1em}
.prose-invert strong{color:var(--c-on-surface);font-weight:600}
.prose-invert img{border-radius:.75rem;margin:1em 0}

/* ============================================================================
   RESPONSIVE BREAKPOINTS
   ============================================================================ */
@media (min-width:640px){
  .sm\:w-24{width:6rem}.sm\:w-auto{width:auto}
  .sm\:flex-row{flex-direction:row}
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sm\:columns-2{columns:2}
}
@media (min-width:768px){
  .md\:flex{display:flex}.md\:hidden{display:none}
  .md\:flex-row{flex-direction:row}
  .md\:items-center{align-items:center}.md\:items-end{align-items:flex-end}
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .md\:p-10{padding:2.5rem}
  .md\:text-left{text-align:left}
  .md\:text-2xl{font-size:1.5rem;line-height:2rem}
  .md\:text-4xl{font-size:2.25rem;line-height:2.5rem}
  .md\:text-5xl{font-size:3rem;line-height:1}
  .md\:text-6xl{font-size:3.75rem;line-height:1}
  .md\:text-7xl{font-size:4.5rem;line-height:1}
}
@media (min-width:1024px){
  .lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lg\:columns-3{columns:3}
  .lg\:order-1{order:1}.lg\:order-2{order:2}
}
@media (min-width:1280px){
  .xl\:columns-4{columns:4}
}

/* ============================================================================
   CUSTOM COMPONENT CLASSES (previously inline <style> in header.php)
   ============================================================================ */
.material-symbols-outlined{font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24}
.glass,.glass-panel{background:rgba(15,21,36,.6);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(125,211,252,.1)}
.glass-panel-elevated{background:rgba(15,21,36,.75);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid rgba(125,211,252,.15);box-shadow:0 0 30px rgba(125,211,252,.05)}
.text-glow{text-shadow:0 0 20px rgba(125,211,252,.3)}
.glow-hover:hover{box-shadow:0 0 20px rgba(125,211,252,.15);border-color:rgba(125,211,252,.3)}
.no-scrollbar::-webkit-scrollbar{display:none}
.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}
body{background-color:#0a0e1a;color:#e0e8f0;background-image:radial-gradient(circle at 15% 50%,rgba(125,211,252,.03) 0%,transparent 50%),radial-gradient(circle at 85% 30%,rgba(200,160,240,.03) 0%,transparent 50%);background-attachment:fixed}