/*
SOURCE: lssm-tech/contractspec-studio@89cd701c550f539b7a96163044cbbd98dbb7cbd3
Marketing: packages/apps/web-marketing/src/app/index.css;
  HomeHero, EditorialPageHero and CompactProofRow.
App: packages/apps/web-application/src/app/globals.css;
  studio-presentation/src/presentation/components/pm/organisms/PmBoard,
  PmBoardColumn, PmBoardCard and PmPortfolioFiltersPanel.
TODO(MONOREPO-COMPONENT-REUSE): replace scoped copies with the source components
and each app's own theme/provider. Native selects, heading levels, scoped names,
embed padding and container breakpoints are intentional portfolio adaptations.
*/
@font-face{font-family:"Studio PM Newsreader";src:url('/assets/portfolio/source-studio/tellshift-newsreader.ttf') format('truetype');font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"Studio PM Manrope";src:url('/assets/source-previews/tafio/fonts/manrope-0.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"Studio PM DM Sans";src:url('/assets/source-previews/tafio/fonts/dmsans-0.woff2') format('woff2');font-weight:100 1000;font-style:normal;font-display:swap}
.spm-frame{container:studio-pm / inline-size;isolation:isolate;min-width:0;width:100%;overflow:hidden;border:1px solid #e8e6e1;text-align:left;color-scheme:light}
.spm-frame *{box-sizing:border-box}
.spm-frame :is(h2,h3,h4,h5,p){margin:0}
.spm-frame [hidden]{display:none!important}
.spm-frame .spm-caption{margin:18px 0 0;font:400 11px/1.5 "Studio PM Manrope",system-ui,sans-serif;letter-spacing:0;color:#6b6860}

/* Source marketing's warm editorial theme. Deliberately independent of app. */
.spm-marketing{
  --spm-background:hsl(36 34% 96%);
  --spm-foreground:hsl(22 26% 14%);
  --spm-card:hsl(38 40% 98%);
  --spm-primary:hsl(214 18% 27%);
  --spm-secondary:hsl(36 28% 90%);
  --spm-muted:hsl(34 22% 92%);
  --spm-muted-foreground:hsl(21 12% 40%);
  --spm-accent:hsl(38 45% 83%);
  --spm-border:hsl(30 18% 80%);
  padding:20px;
  background:var(--spm-background);
  color:var(--spm-foreground);
  font:400 16px/1.6 "Studio PM Manrope",Manrope,system-ui,-apple-system,sans-serif;
  letter-spacing:-.01em;
  font-feature-settings:"cv02","cv03","cv04","cv11";
}
.spm-marketing .spm-hero-shell{
  position:relative;overflow:hidden;border-radius:1.75rem;border:1px solid color-mix(in srgb,var(--spm-border) 80%,transparent);
  padding:24px 20px;background-color:color-mix(in srgb,var(--spm-card) 92%,transparent);
  background-image:linear-gradient(135deg,color-mix(in oklab,var(--spm-accent) 22%,transparent),transparent 38%),linear-gradient(180deg,color-mix(in oklab,var(--spm-card) 96%,white),color-mix(in oklab,var(--spm-card) 90%,var(--spm-secondary) 10%));
  box-shadow:0 22px 70px -42px rgba(62,49,34,.28);
}
.spm-marketing .spm-hero-grid{display:grid;gap:40px;max-width:896px}
.spm-marketing .spm-kicker{margin:0 0 20px;color:var(--spm-muted-foreground);font:400 11px/1.5 "JetBrains Mono",monospace;letter-spacing:.22em;text-transform:uppercase}
.spm-marketing .spm-editorial-display{max-width:896px;color:var(--spm-foreground);font-family:"Studio PM Newsreader",Newsreader,"Iowan Old Style",Georgia,serif;font-size:36px;font-style:normal;font-weight:600;line-height:.95;letter-spacing:-.035em;text-transform:none;text-wrap:pretty}
.spm-marketing .spm-editorial-body{margin:20px 0 0;max-width:672px;color:var(--spm-muted-foreground);font-family:inherit;font-size:15px;font-weight:400;line-height:28px;letter-spacing:-.01em}
.spm-marketing .spm-proof-row{display:flex;flex-wrap:wrap;gap:10px;margin:32px 0 0}
.spm-marketing .spm-proof-row span{border:1px solid color-mix(in srgb,var(--spm-border) 60%,transparent);border-radius:.95rem;padding:8px 12px;background:color-mix(in srgb,var(--spm-card) 90%,transparent);color:var(--spm-muted-foreground);font-size:12px;line-height:16px}

/* Source app's cream/forest PM theme, DM Sans typography, exact lane structure. */
.spm-app{
  --spm-background:#fafaf8;--spm-foreground:#1a1917;--spm-primary:#2c5f2d;
  --spm-muted:#f6f5f3;--spm-muted-foreground:#9c978e;--spm-border:#e8e6e1;--spm-input:#deddd9;
  padding:24px;background:var(--spm-background);color:var(--spm-foreground);
  font:400 14px/1.5 "Studio PM DM Sans","DM Sans",system-ui,-apple-system,sans-serif;
  letter-spacing:normal;
}
.spm-app .spm-board-header{display:grid;gap:4px;margin:0 0 16px}
.spm-app .spm-board-header h3{color:var(--spm-foreground);font-family:inherit;font-size:18px;font-weight:600;line-height:28px;letter-spacing:normal}
.spm-app .spm-board-header p{color:var(--spm-muted-foreground);font:400 14px/20px "Studio PM DM Sans","DM Sans",system-ui,sans-serif}
.spm-app .spm-board-scroll{max-width:100%;overflow-x:auto;scrollbar-color:var(--spm-input) transparent;scrollbar-width:thin;padding:0 0 6px}
.spm-app .spm-board-scroll:focus-visible,.spm-app select:focus-visible{outline:2px solid var(--spm-primary);outline-offset:3px}
.spm-app .spm-board{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;min-width:850px}
.spm-app .spm-lane{min-width:0;border:1px solid var(--spm-border);border-radius:12px;padding:12px;background:color-mix(in srgb,var(--spm-muted) 40%,transparent)}
.spm-app .spm-lane>header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.spm-app .spm-lane h4{color:var(--spm-foreground);font:500 14px/20px "Studio PM DM Sans","DM Sans",system-ui,sans-serif;letter-spacing:normal}
.spm-app .spm-lane>header>span{font-size:12px;line-height:16px;color:var(--spm-muted-foreground)}
.spm-app .spm-lane-items{display:grid;align-content:start;gap:8px;min-height:32px}
.spm-app .spm-issue{min-width:0;margin:0;border:1px solid var(--spm-border);border-radius:8px;padding:8px;background:var(--spm-background);box-shadow:none}
.spm-app .spm-issue h5{color:var(--spm-foreground);font:500 14px/1.25 "Studio PM DM Sans","DM Sans",system-ui,sans-serif;letter-spacing:normal;overflow-wrap:normal}
.spm-app .spm-issue-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:4px 0 0;color:var(--spm-muted-foreground);font-size:12px;line-height:16px}
.spm-app .spm-issue-meta span{overflow-wrap:anywhere}
.spm-app .spm-filter-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:460px;border:1px solid var(--spm-border);border-radius:12px;padding:16px;margin:0 0 24px}
.spm-app .spm-filter-panel>div{display:grid;gap:4px;min-width:0}
.spm-app .spm-filter-panel label{display:block;margin:0;color:var(--spm-foreground);font:500 14px/20px "Studio PM DM Sans","DM Sans",system-ui,sans-serif}
.spm-app .spm-filter-panel select{width:100%;min-width:0;height:36px;margin:0;border:1px solid var(--spm-input);border-radius:6px;background:transparent;color:var(--spm-foreground);padding:6px 28px 6px 12px;font:400 14px/20px "Studio PM DM Sans","DM Sans",system-ui,sans-serif;cursor:pointer}
.spm-app .spm-caption{font-family:"Studio PM DM Sans","DM Sans",system-ui,sans-serif}
@container studio-pm (min-width:640px){
  .spm-marketing{padding:28px}
  .spm-marketing .spm-hero-shell{padding:32px 28px}
}
@container studio-pm (min-width:768px){
  .spm-marketing .spm-hero-shell{padding:40px}
  .spm-marketing .spm-editorial-display{font-size:60px}
  .spm-marketing .spm-editorial-body{font-size:17px}
}
@container studio-pm (max-width:430px){
  .spm-marketing,.spm-app{padding:16px}
  .spm-marketing .spm-hero-shell{padding:24px 18px}
  .spm-marketing .spm-editorial-display{font-size:32px}
  .spm-marketing .spm-proof-row{gap:8px}
  .spm-marketing .spm-proof-row span{padding:7px 10px}
}