/*
 * Saanraan public reset and foundation layer.
 * Owns design tokens, icon fallback, reset/base, accessibility helpers, and typography roles.
 */
/*
 * Saanraan public design tokens.
 * Loaded by public style profiles before public foundation and optional UI kit layers.
 * This file owns custom properties only; component selectors belong to a runtime layer.
 */
:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-emerald-500:oklch(69.6% .17 162.48);--color-rose-400:oklch(71.2% .194 13.428);--color-slate-950:oklch(12.9% .042 264.695);--color-slate-900:oklch(20.8% .042 265.755);--color-zinc-50:oklch(98.5% 0 0);--color-zinc-100:oklch(96.7% .001 286.375);--color-zinc-200:oklch(92% .004 286.32);--color-zinc-300:oklch(87.1% .006 286.286);--color-zinc-400:oklch(70.5% .015 286.067);--color-zinc-800:oklch(27.4% .006 286.033);--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-lg:32rem;--container-xl:36rem;--container-2xl:42rem;--container-3xl:48rem;--text-xs:.75rem;--text-xs--line-height:1.5;--text-sm:.875rem;--text-sm--line-height:1.5;--text-base:1rem;--text-base--line-height:1.5;--text-lg:1.125rem;--text-lg--line-height:1.5;--text-xl:1.25rem;--text-xl--line-height:1.5;--text-2xl:1.5rem;--text-2xl--line-height:1.5;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--leading-normal:1.5;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--shadow-sm:0 .0625rem .125rem #4c4c5c26;--ease-in-out:cubic-bezier(.4, 0, .2, 1);--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--shadow:0 1px 2px #393e5026;--radius:4px;--font-body:"Pretendard", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;--font-secondary:"Pretendard", -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;--text-md:15px;--text-body:16px;--text-md--line-height:1.5;--type-display-size:2rem;--type-display-max-size:3.5rem;--type-display-line-height:1.25;--type-page-title-size:1.625rem;--type-page-title-fluid-max-size:2.4rem;--type-page-title-line-height:1.35;--type-section-title-size:var(--text-lg);--type-section-title-line-height:1.4;--type-card-title-size:var(--text-md);--type-card-title-line-height:1.5;--type-body-size:var(--text-body);--type-body-line-height:var(--leading-normal);--type-small-size:var(--text-sm);--type-small-line-height:var(--text-sm--line-height);--type-meta-size:var(--text-xs);--type-meta-line-height:var(--text-xs--line-height);--type-caption-size:var(--text-xs);--type-caption-line-height:var(--text-xs--line-height);--type-code-size:var(--text-sm);--type-code-line-height:var(--text-sm--line-height);--color-body-bg:#f2f6fb;--color-body-color:#20242a;--color-card:#fff;--color-primary:#0a74ff;--color-primary-hover:#0857bf;--color-primary-ring:#0a74ff33;--color-secondary:#7b5af7;--color-secondary-hover:#5c44b9;--color-success:#6fcd1f;--color-success-hover:#539a17;--color-info:#1aa0e8;--color-info-hover:#1478ae;--color-warning:#ff8f1f;--color-warning-hover:#bf6b17;--color-danger:#f43f5e;--color-danger-hover:#b72f47;--color-light:#eef2f7;--color-light-hover:#8a969c;--color-dark:#313a46;--color-dark-hover:#343a40;--color-default-50:#fafbfd;--color-default-100:#f6f7fb;--color-default-200:#eef2f7;--color-default-300:#edf2f9;--color-default-400:#7a8492;--color-default-500:#5d6b7c;--color-default-600:#47505c;--color-default-700:#303741;--color-default-900:#20242a;--color-default-950:var(--color-slate-950);--text-strong:var(--color-default-900);--text-muted:var(--color-default-600);--text-subtle:var(--color-default-500);--ui-body-color:var(--color-body-color)}
:root{color-scheme:light}
[data-theme=dark],[data-color-scheme=dark]{color-scheme:dark;--color-body-bg:#17181e;--color-body-color:#aab8c5;--color-card:#1e1f27;--color-light:#252630;--color-light-hover:#8a969c;--color-dark:#4b4d5c;--color-dark-hover:#343a40;--color-primary-ring:#0a74ff4d;--color-chart-border-color:#242c31;--color-chart-gray:#40424f;--shadow:0px 0px 30px #0000004d;--color-default-50:#22232c;--color-default-100:#272832;--color-default-200:var(--color-zinc-800);--color-default-300:#293036;--color-default-400:#8391a2;--color-default-500:#a1a9b1;--color-default-600:var(--color-zinc-400);--color-default-700:var(--color-zinc-300);--color-default-800:var(--color-zinc-200);--color-default-900:var(--color-zinc-100);--color-default-950:var(--color-zinc-50)}
@media (prefers-color-scheme:dark){[data-color-scheme=system]{color-scheme:dark;--color-body-bg:#17181e;--color-body-color:#aab8c5;--color-card:#1e1f27;--color-light:#252630;--color-light-hover:#8a969c;--color-dark:#4b4d5c;--color-dark-hover:#343a40;--color-primary-ring:#0a74ff4d;--color-chart-border-color:#242c31;--color-chart-gray:#40424f;--shadow:0px 0px 30px #0000004d;--color-default-50:#22232c;--color-default-100:#272832;--color-default-200:var(--color-zinc-800);--color-default-300:#293036;--color-default-400:#8391a2;--color-default-500:#a1a9b1;--color-default-600:var(--color-zinc-400);--color-default-700:var(--color-zinc-300);--color-default-800:var(--color-zinc-200);--color-default-900:var(--color-zinc-100);--color-default-950:var(--color-zinc-50)}}

/*
 * Saanraan project icon layer.
 * Material Symbols is loaded from the bundled font for CSP-friendly shared hosting.
 */

@font-face{font-family:"Material Symbols Outlined";font-style:normal;font-weight:400;src:url("fonts/material-symbols-outlined.ttf") format("truetype");font-display:block}
.sr-icon,.material-symbols-outlined{font-family:"Material Symbols Outlined";font-weight:400;font-style:normal;font-size:1em;line-height:1;letter-spacing:normal;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;font-feature-settings:"liga";font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24;-webkit-font-feature-settings:"liga";-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
html:not(.sr-material-icons-ready) :is(.sr-icon,.material-symbols-outlined)[data-sr-material-icon]{color:transparent}

*,:before,:after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;tab-size:4;scroll-behavior:smooth;position:relative}
body{-webkit-tap-highlight-color:transparent;width:100%;min-height:100%;font-family:var(--font-body);font-size:var(--text-body);line-height:var(--leading-normal);font-weight:var(--font-weight-normal);color:var(--color-body-color);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
a{color:inherit;text-decoration:inherit}
button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1;border-radius:0}
button:not(:disabled),[role=button]:not(:disabled){cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.5}
input,textarea,select{max-width:100%}
textarea{resize:vertical}
table{text-indent:0;border-collapse:collapse}
ol,ul,menu{list-style:none}
img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}
img,video{max-width:100%;height:auto}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-family:var(--font-secondary);font-weight:var(--font-weight-medium)}
b,strong,label{font-weight:var(--font-weight-semibold)}
label{display:block}
small{font-size:.85em}
code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-size:1em}

[hidden]:where(:not([hidden=until-found])),.hidden{display:none!important}
.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}
.type-display{margin:0;font-family:var(--font-secondary);font-size:var(--type-display-size);line-height:var(--type-display-line-height);font-weight:var(--font-weight-bold)}
.type-display-fluid{margin:0;font-family:var(--font-secondary);font-size:clamp(var(--type-display-size),6vw,var(--type-display-max-size));line-height:var(--type-display-line-height);font-weight:var(--font-weight-bold)}
.type-page-title{margin:0;font-family:var(--font-secondary);font-size:var(--type-page-title-size);line-height:var(--type-page-title-line-height);font-weight:var(--font-weight-bold)}
.type-page-title-fluid{margin:0;font-family:var(--font-secondary);font-size:clamp(var(--type-page-title-size),4vw,var(--type-page-title-fluid-max-size));line-height:var(--type-page-title-line-height);font-weight:var(--font-weight-bold)}
.type-section-title{margin:0;font-family:var(--font-secondary);font-size:var(--type-section-title-size);line-height:var(--type-section-title-line-height);font-weight:var(--font-weight-semibold)}
.type-card-title{margin:0;font-family:var(--font-secondary);font-size:var(--type-card-title-size);line-height:var(--type-card-title-line-height);font-weight:var(--font-weight-semibold)}
:is(h1,h2,h3,h4,h5,h6).type-display,:is(h1,h2,h3,h4,h5,h6).type-display-fluid{line-height:var(--type-display-line-height)!important}
:is(h1,h2,h3,h4,h5,h6).type-page-title,:is(h1,h2,h3,h4,h5,h6).type-page-title-fluid{line-height:var(--type-page-title-line-height)!important}
:is(h1,h2,h3,h4,h5,h6).type-section-title{line-height:var(--type-section-title-line-height)!important}
:is(h1,h2,h3,h4,h5,h6).type-card-title{line-height:var(--type-card-title-line-height)!important}
.type-body{font-size:var(--type-body-size);line-height:var(--type-body-line-height)}
.type-small{font-size:var(--type-small-size);line-height:var(--type-small-line-height)}
.type-meta{font-size:var(--type-meta-size);line-height:var(--type-meta-line-height)}
.type-caption{font-size:var(--type-caption-size);line-height:var(--type-caption-line-height)}
.type-code{font-family:var(--default-mono-font-family);font-size:var(--type-code-size);line-height:var(--type-code-line-height)}
.relative{position:relative}