/* Local copy of the original portfolio stylesheet, bundled for standalone use. */
@import url("./source.css");

/* Tailwind's preflight reset was generated at build time in the React app. */
*,::before,::after { box-sizing: border-box; border: 0 solid #e5e7eb; }
html { line-height: 1.5; -webkit-text-size-adjust: 100%; tab-size: 4; font-family: Poppins, Kalpurush, sans-serif; }
body { margin: 0; line-height: inherit; }
hr { height: 0; color: inherit; border-top-width: 1px; }
h1,h2,h3,h4,h5,h6 { margin: 0; font-size: inherit; font-weight: inherit; }
a { color: inherit; text-decoration: inherit; }
b,strong { font-weight: bolder; }
small { font-size: 80%; }
sub,sup { position: relative; vertical-align: baseline; font-size: 75%; line-height: 0; }
sub { bottom: -.25em; } sup { top: -.5em; }
table { text-indent: 0; border-color: inherit; border-collapse: collapse; }
button,input,optgroup,select,textarea { margin: 0; padding: 0; color: inherit; font: inherit; letter-spacing: inherit; }
button,select { text-transform: none; }
button,[type=button],[type=reset],[type=submit] { background-color: transparent; background-image: none; }
button,[role=button] { cursor: pointer; }
ol,ul,menu { margin: 0; padding: 0; list-style: none; }
img,svg,video,canvas,audio,iframe,embed,object { display: block; vertical-align: middle; }
img,video { max-width: 100%; height: auto; }
[hidden]:not([hidden="until-found"]) { display: none !important; }

/* Utility classes originally supplied by Tailwind in the React build. */
.min-h-screen { min-height: 100vh; }
.max-w-screen-xl { max-width: 1280px; }
.mx-auto { margin-left: auto; margin-right: auto; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.text-center { text-align: center; }
.text-justify { text-align: justify; }
.justify-center { justify-content: center; }
.mb-8 { margin-bottom: 2rem; }
.pb-16 { padding-bottom: 4rem; }
@media (min-width: 640px) { .sm\:px-6 { padding-left: 1.5rem; padding-right: 1.5rem; } }
/* React Icons renders every SVG at 1em; preserve those intrinsic icon sizes. */
.site-main svg { width: 1em; height: 1em; }
svg { width: 1em; height: 1em; }
.mobile-tabbar svg { width: 1.2rem; height: 1.2rem; }
.nav-links > .nav-item > span:first-child:not(:last-child) { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 1rem; height: 1rem; font-size: 1rem; line-height: 1; }
.drawer-backdrop[hidden] { display: none !important; }
@media (max-width: 900px) { .nav-links > a.nav-item span:first-child:not(:last-child), .nav-links > button.nav-item span:first-child:not(:last-child) { padding: .55rem; border-radius: .65rem; background: color-mix(in srgb,var(--accent) 12%,transparent); color: var(--accent); box-sizing: content-box; } }
.sonner-toaster { position: fixed; top: 16px; right: 16px; z-index: 100; display: grid; gap: 8px; width: min(356px,calc(100vw - 32px)); }
.sonner-toast { position: relative; display: flex; gap: 12px; padding: 16px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--text); box-shadow: 0 4px 12px #0002; animation: toast-in .2s ease-out; }
.sonner-toast.success { border-color: #22c55e; }
.sonner-toast.error { border-color: #ef4444; }
.sonner-toast strong { display: block; font-size: 14px; font-weight: 600; }
.sonner-toast p { margin: 3px 24px 0 0; color: var(--muted); font-size: 13px; line-height: 1.4; }
.sonner-toast button { position: absolute; top: 8px; right: 8px; border: 0; background: transparent; color: var(--muted); font-size: 17px; }
@keyframes toast-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }

/* Keep the standalone display controls readable and consistent at small widths. */
.settings-nav-item > svg { width: 1.25rem; height: 1.25rem; flex: 0 0 1.25rem; }
.display-mode-icon { width: 1.1rem; height: 1.1rem; flex: 0 0 1.1rem; }
.drawer-footer-row > svg { width: 1rem; height: 1rem; flex: 0 0 1rem; }
@media (max-width: 380px) {
	.drawer-mode-options { justify-content: flex-start; gap: .35rem; overflow: visible; }
	.drawer-mode-options button { width: auto; min-width: 0; height: 38px; flex: 1 1 0; gap: .25rem; border-radius: 999px; padding: .35rem .4rem; font-size: .72rem; }
	.drawer-mode-options button span { display: inline; }
	.drawer-mode-options .display-mode-icon { width: .95rem; height: .95rem; flex-basis: .95rem; }
}