/* CardMint — Complete Utility CSS (no Tailwind CDN needed) */

/* === Reset === */
*,::before,::after{box-sizing:border-box;border:0 solid #e5e7eb}
html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:system-ui,-apple-system,sans-serif;-moz-tab-size:4;tab-size:4}
body{margin:0;line-height:inherit}
img,svg,video{display:block;max-width:100%;height:auto}
button,input,textarea,select{font:inherit;color:inherit;margin:0;padding:0;background:transparent}
a{color:inherit;text-decoration:inherit}
h1,h2,h3,p{margin:0}
button{cursor:pointer}
::-webkit-search-decoration{-webkit-appearance:none}
textarea{resize:vertical}
input::placeholder,textarea::placeholder{color:#9ca3af}
[type='checkbox']{appearance:none;padding:0;width:auto;display:inline-block;vertical-align:middle;background-origin:border-box;user-select:none;flex-shrink:0}

/* === Layout === */
.block{display:block} .inline-block{display:inline-block} .inline-flex{display:inline-flex}
.flex{display:flex} .grid{display:grid} .hidden{display:none!important}
.flex-col{flex-direction:column} .flex-wrap{flex-wrap:wrap} .flex-1{flex:1 1 0%}
.items-center{align-items:center} .items-start{align-items:flex-start}
.justify-center{justify-content:center} .justify-between{justify-content:space-between}
.gap-1{gap:.25rem} .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}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}

/* === Positioning === */
.relative{position:relative} .absolute{position:absolute} .fixed{position:fixed} .sticky{position:sticky}
.inset-0{inset:0} .top-0{top:0} .top-2{top:.5rem} .top-6{top:1.5rem}
.right-0{right:0} .right-2{right:.5rem} .left-0{left:0} .bottom-0{bottom:0}
.-top-0\.5{top:-.125rem} .-bottom-0\.5{bottom:-.125rem} .-left-0\.5{left:-.125rem} .-right-0\.5{right:-.125rem}
.z-10{z-index:10} .z-50{z-index:50}
.overflow-hidden{overflow:hidden}

/* === Sizing === */
.w-full{width:100%} .w-6{width:1.5rem} .w-9{width:2.25rem} .w-12{width:3rem}
.w-14{width:3.5rem} .w-16{width:4rem} .w-20{width:5rem} .w-24{width:6rem} .w-40{width:10rem}
.h-5{height:1.25rem} .h-6{height:1.5rem} .h-12{height:3rem} .h-14{height:3.5rem}
.h-16{height:4rem} .h-20{height:5rem} .h-full{height:100%}
.min-h-screen{min-height:100vh} .max-w-xs{max-width:20rem}
.object-cover{object-fit:cover}

/* === Spacing === */
.p-3{padding:.75rem} .p-4{padding:1rem} .p-6{padding:1.5rem}
.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}
.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-6{padding-top:1.5rem;padding-bottom:1.5rem} .py-24{padding-top:6rem;padding-bottom:6rem}
.pt-6{padding-top:1.5rem} .pb-3{padding-bottom:.75rem} .pb-4{padding-bottom:1rem}
.pb-8{padding-bottom:2rem} .pb-10{padding-bottom:2.5rem}
.mt-0\.5{margin-top:.125rem} .mt-1{margin-top:.25rem} .mt-2{margin-top:.5rem}
.mt-4{margin-top:1rem} .mt-6{margin-top:1.5rem} .mt-10{margin-top:2.5rem} .mt-16{margin-top:4rem}
.mb-1{margin-bottom:.25rem} .mb-2{margin-bottom:.5rem} .mb-3{margin-bottom:.75rem}
.mb-4{margin-bottom:1rem} .mb-5{margin-bottom:1.25rem}
.ml-2{margin-left:.5rem} .ml-4{margin-left:1rem} .mx-auto{margin-left:auto;margin-right:auto}

/* === Typography === */
.text-xs{font-size:.75rem;line-height:1rem} .text-sm{font-size:.875rem;line-height:1.25rem}
.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-5xl{font-size:3rem;line-height:1} .text-6xl{font-size:3.75rem;line-height:1}
.text-\[10px\]{font-size:10px}
.font-medium{font-weight:500} .font-semibold{font-weight:600} .font-bold{font-weight:700}
.font-mono{font-family:ui-monospace,monospace}
.text-center{text-align:center} .text-right{text-align:right}
.uppercase{text-transform:uppercase} .truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.whitespace-nowrap{white-space:nowrap} .break-all{word-break:break-all}
.leading-none{line-height:1} .leading-tight{line-height:1.25}
.tracking-tight{letter-spacing:-.025em} .tracking-widest{letter-spacing:.1em}
.underline{text-decoration:underline} .italic{font-style:italic}
.outline-none{outline:none} .resize-none{resize:none}

/* === Colors — Text === */
.text-white{color:#fff}
.text-slate-200{color:#e2e8f0} .text-slate-300{color:#cbd5e1} .text-slate-400{color:#94a3b8}
.text-slate-500{color:#64748b} .text-slate-600{color:#475569}
.text-blue-300{color:#93c5fd} .text-blue-400{color:#60a5fa} .text-blue-500{color:#3b82f6}
.text-green-300{color:#86efac} .text-green-300\/50{color:rgba(134,239,172,.5)}
.text-green-400{color:#4ade80} .text-red-400{color:#f87171}

/* === Colors — Background === */
.bg-black{background:#000} .bg-black\/60{background:rgba(0,0,0,.6)} .bg-white{background:#fff}
.bg-white\/20{background:rgba(255,255,255,.2)}
.bg-slate-600{background:#475569} .bg-slate-700{background:#334155}
.bg-slate-700\/50{background:rgba(51,65,85,.5)} .bg-slate-800{background:#1e293b}
.bg-slate-900{background:#0f172a} .bg-slate-900\/95{background:rgba(15,23,42,.95)}
.bg-blue-600{background:#2563eb} .bg-blue-600\/30{background:rgba(37,99,235,.3)}
.bg-green-600{background:#16a34a} .bg-green-700{background:#15803d}
.bg-green-900\/40{background:rgba(20,83,45,.4)}
.bg-red-900\/50{background:rgba(127,29,29,.5)}

/* === Borders === */
.border{border-width:1px} .border-2{border-width:2px} .border-4{border-width:4px}
.border-b{border-bottom-width:1px} .border-t-3{border-top-width:3px}
.border-b-3{border-bottom-width:3px} .border-l-3{border-left-width:3px} .border-r-3{border-right-width:3px}
.border-dashed{border-style:dashed}
.border-slate-600{border-color:#475569} .border-slate-700{border-color:#334155}
.border-slate-800{border-color:#1e293b} .border-slate-900{border-color:#0f172a}
.border-green-700{border-color:#15803d} .border-white{border-color:#fff}
.border-white\/70{border-color:rgba(255,255,255,.7)}
.rounded-lg{border-radius:.5rem} .rounded-xl{border-radius:.75rem} .rounded-2xl{border-radius:1rem}
.rounded-full{border-radius:9999px}
.rounded-tl-lg{border-top-left-radius:.5rem} .rounded-tr-lg{border-top-right-radius:.5rem}
.rounded-bl-lg{border-bottom-left-radius:.5rem} .rounded-br-lg{border-bottom-right-radius:.5rem}

/* === Effects === */
.shadow-xl{box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1)}
.backdrop-blur{backdrop-filter:blur(8px)} .pointer-events-none{pointer-events:none}
.cursor-pointer{cursor:pointer} .cursor-zoom-in{cursor:zoom-in}
.transition-all{transition:all .15s ease} .transition-colors{transition:color .15s,background-color .15s,border-color .15s}
.transition-transform{transition:transform .15s} .transition-opacity{transition:opacity .15s}
.opacity-0{opacity:0}

/* === Hover === */
.hover\:bg-blue-500:hover{background:#3b82f6} .hover\:bg-blue-600\/50:hover{background:rgba(37,99,235,.5)}
.hover\:bg-green-500:hover{background:#22c55e} .hover\:bg-green-600:hover{background:#16a34a}
.hover\:bg-slate-600:hover{background:#475569} .hover\:bg-red-800\/60:hover{background:rgba(153,27,27,.6)}
.hover\:text-white:hover{color:#fff} .hover\:ring-2:hover{box-shadow:0 0 0 2px var(--ring-color,#3b82f6)}
.hover\:ring-blue-500:hover{--ring-color:#3b82f6}
.group:hover .group-hover\:opacity-100{opacity:1}

/* === Focus === */
.focus\:border-blue-500:focus{border-color:#3b82f6}
.focus\:ring-2:focus{box-shadow:0 0 0 2px var(--ring-color,#3b82f6)}

/* === Active === */
.active\:bg-green-700:active{background:#15803d} .active\:scale-95:active{transform:scale(.95)}

/* === Peer (toggle switch) === */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border-width:0}
.peer:checked~.peer-checked\:after\:translate-x-full::after{transform:translateX(100%)}
.peer:checked~.peer-checked\:bg-blue-600{background:#2563eb}
.peer:focus~.peer-focus\:ring-2{box-shadow:0 0 0 2px var(--ring-color,#3b82f6)}
.peer:focus~.peer-focus\:ring-blue-500{--ring-color:#3b82f6}

/* === After pseudo (toggle switch knob) === */
.after\:absolute::after{position:absolute} .after\:bg-white::after{background:#fff}
.after\:rounded-full::after{border-radius:9999px}
.after\:h-4::after{height:1rem} .after\:w-4::after{width:1rem}
.after\:top-\[2px\]::after{top:2px} .after\:left-\[2px\]::after{left:2px}
.after\:content-\[\'\'\]::after{content:''} .after\:transition-all::after{transition:all .15s}

/* === Responsive === */
@media(min-width:640px){.sm\:flex-row{flex-direction:row}}
