/* Cutout Banana - Compiled Tailwind CSS */
/* Custom theme: banana, sage, shell, coal, bark, stone, sand */
/* Fonts: Space Grotesk (display), Plus Jakarta Sans (body), IBM Plex Mono (mono) */

/* === RESET === */
*,*::before,*::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}
html{line-height:1.5;-webkit-text-size-adjust:100%;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif}
body{margin:0;line-height:inherit}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}
a{color:inherit;text-decoration:inherit}
b,strong{font-weight:bolder}
code,pre{font-family:ui-monospace,monospace;font-size:1em}
small{font-size:80%}
button,input,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}
button{cursor:pointer;background:transparent;background-image:none}
img,svg,video{display:block;max-width:100%;height:auto}
[hidden]{display:none}
summary{cursor:pointer}

/* === SR-ONLY === */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* === LAYOUT === */
.fixed{position:fixed}
.absolute{position:absolute}
.relative{position:relative}
.sticky{position:sticky}
.inset-0{inset:0}
.top-0{top:0}
.top-20{top:5rem}
.bottom-0{bottom:0}
.right-0{right:0}
.z-10{z-index:10}
.z-50{z-index:50}
.z-\[55\]{z-index:55}
.z-\[56\]{z-index:56}
.z-\[60\]{z-index:60}
.block{display:block}
.flex{display:flex}
.inline-flex{display:inline-flex}
.grid{display:grid}
.hidden{display:none}
.flex-col{flex-direction:column}
.flex-1{flex:1 1 0%}
.flex-grow{flex-grow:1}
.flex-shrink-0{flex-shrink: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\.5{gap:.375rem}
.gap-2{gap:.5rem}
.gap-2\.5{gap:.625rem}
.gap-3{gap:.75rem}
.gap-4{gap:1rem}
.gap-5{gap:1.25rem}
.gap-6{gap:1.5rem}
.gap-8{gap:2rem}
.gap-\[5px\]{gap:5px}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.col-span-2{grid-column:span 2/span 2}
.overflow-hidden{overflow:hidden}
.scroll-mt-24{scroll-margin-top:6rem}

/* === SIZING === */
.w-1\.5{width:.375rem}
.w-2{width:.5rem}
.w-3\.5{width:.875rem}
.w-4{width:1rem}
.w-5{width:1.25rem}
.w-6{width:1.5rem}
.w-9{width:2.25rem}
.w-10{width:2.5rem}
.w-11{width:2.75rem}
.w-14{width:3.5rem}
.w-full{width:100%}
.min-h-screen{min-height:100vh}
.min-h-\[1rem\]{min-height:1rem}
.max-w-full{max-width:100%}
.max-w-lg{max-width:32rem}
.max-w-xl{max-width:36rem}
.max-w-2xl{max-width:42rem}
.max-w-3xl{max-width:48rem}
.max-w-5xl{max-width:64rem}
.max-w-6xl{max-width:72rem}
.max-h-full{max-height:100%}
.h-1\.5{height:.375rem}
.h-2{height:.5rem}
.h-3\.5{height:.875rem}
.h-4{height:1rem}
.h-5{height:1.25rem}
.h-6{height:1.5rem}
.h-9{height:2.25rem}
.h-10{height:2.5rem}
.h-11{height:2.75rem}
.h-14{height:3.5rem}
.h-full{height:100%}
.h-\[220px\]{height:220px}
.h-\[2px\]{height:2px}

/* === SPACING === */
.p-3{padding:.75rem}
.p-5{padding:1.25rem}
.p-6{padding:1.5rem}
.p-7{padding:1.75rem}
.p-8{padding:2rem}
.px-3\.5{padding-left:.875rem;padding-right:.875rem}
.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\.5{padding-top:.375rem;padding-bottom:.375rem}
.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-10{padding-top:2.5rem;padding-bottom:2.5rem}
.py-12{padding-top:3rem;padding-bottom:3rem}
.py-14{padding-top:3.5rem;padding-bottom:3.5rem}
.py-16{padding-top:4rem;padding-bottom:4rem}
.py-20{padding-top:5rem;padding-bottom:5rem}
.pt-5{padding-top:1.25rem}
.pt-6{padding-top:1.5rem}
.pt-16{padding-top:4rem}
.pb-4{padding-bottom:1rem}
.pb-12{padding-bottom:3rem}
.pb-14{padding-bottom:3.5rem}
.pb-20{padding-bottom:5rem}
.mb-1{margin-bottom:.25rem}
.mb-1\.5{margin-bottom:.375rem}
.mb-3{margin-bottom:.75rem}
.mb-4{margin-bottom:1rem}
.mb-5{margin-bottom:1.25rem}
.mb-6{margin-bottom:1.5rem}
.mb-7{margin-bottom:1.75rem}
.mb-10{margin-bottom:2.5rem}
.mb-12{margin-bottom:3rem}
.mb-14{margin-bottom:3.5rem}
.mt-0\.5{margin-top:.125rem}
.mt-2\.5{margin-top:.625rem}
.mt-4{margin-top:1rem}
.mt-5{margin-top:1.25rem}
.mt-7{margin-top:1.75rem}
.mt-12{margin-top:3rem}
.mt-14{margin-top:3.5rem}
.ml-1{margin-left:.25rem}
.ml-3{margin-left:.75rem}
.mx-auto{margin-left:auto;margin-right:auto}
.space-y-1>:not([hidden])~:not([hidden]){margin-top:.25rem}
.space-y-2>:not([hidden])~:not([hidden]){margin-top:.5rem}
.space-y-2\.5>:not([hidden])~:not([hidden]){margin-top:.625rem}
.space-y-3>:not([hidden])~:not([hidden]){margin-top:.75rem}
.space-y-5>:not([hidden])~:not([hidden]){margin-top:1.25rem}
.space-y-6>:not([hidden])~:not([hidden]){margin-top:1.5rem}
.space-y-10>:not([hidden])~:not([hidden]){margin-top:2.5rem}

/* === TYPOGRAPHY === */
.font-display{font-family:'Space Grotesk',system-ui,sans-serif}
.font-body{font-family:'Plus Jakarta Sans',system-ui,sans-serif}
.font-mono{font-family:'IBM Plex Mono',monospace}
.font-bold{font-weight:700}
.font-semibold{font-weight:600}
.font-medium{font-weight:500}
.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-2xl{font-size:1.5rem;line-height:2rem}
.text-3xl{font-size:1.875rem;line-height:2.25rem}
.text-\[11px\]{font-size:11px}
.text-\[12px\]{font-size:12px}
.text-\[13px\]{font-size:13px}
.text-\[14px\]{font-size:14px}
.text-\[15px\]{font-size:15px}
.text-\[clamp\(2rem\2c 6vw\2c 3\.75rem\)\]{font-size:clamp(2rem,6vw,3.75rem)}
.text-center{text-align:center}
.uppercase{text-transform:uppercase}
.leading-\[1\.08\]{line-height:1.08}
.leading-\[1\.1\]{line-height:1.1}
.leading-\[1\.75\]{line-height:1.75}
.leading-\[1\.8\]{line-height:1.8}
.leading-relaxed{line-height:1.625}
.tracking-tight{letter-spacing:-.025em}
.tracking-wider{letter-spacing:.05em}
.tracking-widest{letter-spacing:.1em}
.tracking-\[-0\.035em\]{letter-spacing:-.035em}
.underline{text-decoration-line:underline}
.underline-offset-2{text-underline-offset:2px}
.decoration-banana-200{text-decoration-color:#FFF9C4}

/* === COLORS === */
.text-coal{color:#1A1814}
.text-bark{color:#3E3A34}
.text-stone{color:#78746C}
.text-sand{color:#B5AFA6}
.text-banana-600{color:#F9A825}
.text-banana-700{color:#F57F17}
.text-banana-800{color:#E65100}
.text-sage-500{color:#7CB342}
.text-sage-600{color:#558B2F}
.text-white\/20{color:rgba(255,255,255,.2)}
.text-white\/25{color:rgba(255,255,255,.25)}
.text-white\/30{color:rgba(255,255,255,.3)}
.text-white\/50{color:rgba(255,255,255,.5)}
.text-success{color:#558B2F}
.text-warn{color:#E65100}
.bg-white{background-color:#fff}
.bg-white\/50{background-color:rgba(255,255,255,.5)}
.bg-coal{background-color:#1A1814}
.bg-sand{background-color:#B5AFA6}
.bg-banana-50{background-color:#FFFEF7}
.bg-banana-100{background-color:#FFFDE8}
.bg-banana-100\/60{background-color:rgba(255,253,232,.6)}
.bg-banana-100\/70{background-color:rgba(255,253,232,.7)}
.bg-banana-200{background-color:#FFF9C4}
.bg-banana-500{background-color:#FFD600}
.bg-sage-50{background-color:#F1F8E9}
.bg-sage-50\/40{background-color:rgba(241,248,233,.4)}
.bg-sage-100{background-color:#DCEDC8}
.bg-sage-500{background-color:#7CB342}
.bg-shell-50\/30{background-color:rgba(255,251,245,.3)}
.bg-shell-50\/40{background-color:rgba(255,251,245,.4)}
.bg-shell-50\/60{background-color:rgba(255,251,245,.6)}
.bg-shell-50\/80{background-color:rgba(255,251,245,.8)}
.bg-shell-50\/95{background-color:rgba(255,251,245,.95)}
.bg-shell-100{background-color:#FFF3E0}
.bg-\[\#FFD600\]{background-color:#FFD600}
.bg-\[url\(\'data\:image\/svg\+xml\;base64\2c PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0iI2Y5ZmRmZCI+PHJlY3Qgd2lkdGg9IjEwIiBoZWlnaHQ9IjEwIiBmaWxsPSIjZjVmNGYyIi8+PHJlY3QgeD0iMTAiIHk9IjEwIiB3aWR0aD0iMTAiIGhlaWdodD0iMTAiIGZpbGw9IiNmNWY0ZjIiLz48L3N2Zz4\=\'\)\]{background-image:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0iI2Y5ZmRmZCI+PHJlY3Qgd2lkdGg9IjEwIiBoZWlnaHQ9IjEwIiBmaWxsPSIjZjVmNGYyIi8+PHJlY3QgeD0iMTAiIHk9IjEwIiB3aWR0aD0iMTAiIGhlaWdodD0iMTAiIGZpbGw9IiNmNWY0ZjIiLz48L3N2Zz4=')}

/* === BORDERS === */
.border{border-width:1px}
.border-2{border-width:2px}
.border-\[1\.5px\]{border-width:1.5px}
.border-\[3px\]{border-width:3px}
.border-t{border-top-width:1px}
.border-b{border-bottom-width:1px}
.border-dashed{border-style:dashed}
.border-black\/\[0\.04\]{border-color:rgba(0,0,0,.04)}
.border-black\/\[0\.06\]{border-color:rgba(0,0,0,.06)}
.border-sand\/60{border-color:rgba(181,175,166,.6)}
.border-sage-100{border-color:#DCEDC8}
.border-sage-200\/60{border-color:rgba(197,225,165,.6)}
.border-banana-200{border-color:#FFF9C4}
.border-banana-200\/60{border-color:rgba(255,249,196,.6)}
.border-banana-500{border-color:#FFD600}
.border-white\/\[0\.06\]{border-color:rgba(255,255,255,.06)}
.border-\[\#E0DCD6\]{border-color:#E0DCD6}
.border-t-transparent{border-top-color:transparent}
.rounded{border-radius:.25rem}
.rounded-lg{border-radius:.5rem}
.rounded-xl{border-radius:.75rem}
.rounded-2xl{border-radius:1rem}
.rounded-full{border-radius:9999px}
.ring-2{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}
.ring-sage-100{--tw-ring-color:#DCEDC8}

/* === SHADOWS === */
.shadow-card{box-shadow:0 1px 2px rgba(0,0,0,.04),0 8px 24px -4px rgba(0,0,0,.06)}
.shadow-\[0_1px_3px_rgba\(0\2c 0\2c 0\2c 0\.04\)\2c 0_4px_12px_rgba\(0\2c 0\2c 0\2c 0\.03\)\]{box-shadow:0 1px 3px rgba(0,0,0,.04),0 4px 12px rgba(0,0,0,.03)}
.shadow-\[0_6px_20px_-4px_rgba\(255\2c 214\2c 0\2c 0\.35\)\]{box-shadow:0 6px 20px -4px rgba(255,214,0,.35)}

/* === EFFECTS === */
.opacity-60{opacity:.6}
.backdrop-blur-2xl{-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px)}
.backdrop-blur-xl{-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}
.origin-center{transform-origin:center}

/* === TRANSITIONS === */
.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:150ms}
.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:150ms}
.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:150ms}
.duration-300{transition-duration:300ms}

/* === ANIMATIONS === */
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes ping{75%,100%{transform:scale(2);opacity:0}}
.animate-spin{animation:spin 1s linear infinite}
.animate-ping{animation:ping 1s cubic-bezier(0,0,.2,1) infinite}

/* === RESPONSIVE sm:640px === */
@media(min-width:640px){
  .sm\:block{display:block}
  .sm\:flex{display:flex}
  .sm\:hidden{display:none}
  .sm\:inline{display:inline}
  .sm\:col-span-1{grid-column:span 1/span 1}
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* === RESPONSIVE md:768px === */
@media(min-width:768px){
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .md\:h-\[480px\]{height:480px}
  .md\:text-base{font-size:1rem;line-height:1.5rem}
  .md\:text-\[2rem\]{font-size:2rem}
  .md\:text-\[2\.5rem\]{font-size:2.5rem}
  .md\:text-3xl{font-size:1.875rem;line-height:2.25rem}
  .md\:pt-24{padding-top:6rem}
  .md\:pb-16{padding-bottom:4rem}
  .md\:pb-20{padding-bottom:5rem}
  .md\:py-14{padding-top:3.5rem;padding-bottom:3.5rem}
  .md\:py-16{padding-top:4rem;padding-bottom:4rem}
  .md\:py-20{padding-top:5rem;padding-bottom:5rem}
  .md\:py-28{padding-top:7rem;padding-bottom:7rem}
}

/* === RESPONSIVE lg:1024px === */
@media(min-width:1024px){
  .lg\:flex-row{flex-direction:row}
  .lg\:w-64{width:16rem}
}

/* === HOVER STATES === */
.hover\:text-coal:hover{color:#1A1814}
.hover\:text-white:hover{color:#fff}
.hover\:text-banana-600:hover{color:#F9A825}
.hover\:text-banana-700:hover{color:#F57F17}
.hover\:bg-white:hover{background-color:#fff}
.hover\:bg-\[\#F9A825\]:hover{background-color:#F9A825}
.hover\:bg-banana-50:hover{background-color:#FFFEF7}
.hover\:border-sand:hover{border-color:#B5AFA6}
.hover\:shadow-card:hover{box-shadow:0 1px 2px rgba(0,0,0,.04),0 8px 24px -4px rgba(0,0,0,.06)}

/* === GROUP HOVER === */
.group:hover .group-hover\:bg-banana-200{background-color:#FFF9C4}
.group:hover .group-hover\:scale-105{transform:scale(1.05)}

/* === GROUP OPEN (details) === */
.group[open] .group-open\:rotate-180{transform:rotate(180deg)}
details.group summary{list-style:none}
details.group summary::-webkit-details-marker{display:none}

/* === CUSTOM CLASSES (from site styles) === */
.badge-glow{box-shadow:0 0 0 1px rgba(255,214,0,.2),0 2px 8px -2px rgba(255,214,0,.15)}
.hero-mesh{background:radial-gradient(ellipse 70% 55% at 15% 0%,rgba(255,241,118,.35) 0%,transparent 70%),radial-gradient(ellipse 50% 40% at 85% 10%,rgba(255,224,178,.3) 0%,transparent 60%),radial-gradient(ellipse 40% 35% at 50% 95%,rgba(197,225,165,.18) 0%,transparent 60%),#FFFBF5}
.upload-zone{transition:all .35s cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden}
.upload-zone::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,rgba(255,214,0,.06) 0%,transparent 70%);opacity:0;transition:opacity .4s ease}
.upload-zone:hover::before{opacity:1}
.upload-zone:hover{border-color:#FFD600;transform:translateY(-2px);box-shadow:0 12px 40px -12px rgba(255,214,0,.15)}
.dragover{border-color:#FFD600!important;background:#FFFDE8!important;transform:translateY(-2px)!important;box-shadow:0 12px 40px -12px rgba(255,214,0,.25)!important}
.feat-card{transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s ease}
.feat-card:hover{transform:translateY(-3px);box-shadow:0 12px 32px -8px rgba(0,0,0,.08)}
.btn-banana{background:#FFD600;color:#1A1814;font-weight:600;transition:all .25s cubic-bezier(.16,1,.3,1)}
.btn-banana:hover{background:#F9A825;transform:translateY(-1px);box-shadow:0 6px 20px -4px rgba(255,214,0,.35)}
.btn-outline{border:1.5px solid #E0DCD6;color:#78746C;font-weight:600;transition:all .25s ease}
.btn-outline:hover{border-color:#B5AFA6;color:#3E3A34;background:rgba(0,0,0,.015)}
.grain::after{content:'';position:absolute;inset:0;opacity:.018;pointer-events:none;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E")}

/* === ANIMATIONS (site custom) === */
@keyframes rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
.anim{animation:rise .7s cubic-bezier(.16,1,.3,1) forwards;opacity:0}
.d1{animation-delay:.06s}.d2{animation-delay:.14s}.d3{animation-delay:.22s}.d4{animation-delay:.3s}.d5{animation-delay:.38s}

/* === BODY/LOADING === */


/* === MISC === */
.cursor-pointer{cursor:pointer}

/* === BATCH PROCESSING (dynamic classes from app.js) === */
.shadow-soft{box-shadow:0 1px 3px rgba(0,0,0,.04),0 4px 12px rgba(0,0,0,.03)}
.flex-wrap{flex-wrap:wrap}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.inline-block{display:inline-block}
.min-w-0{min-width:0}
.w-24{width:6rem}
.max-h-24{max-height:6rem}
.bg-\[\#FAF9F7\]{background-color:#FAF9F7}
.border-black\/\[0\.03\]{border-color:rgba(0,0,0,.03)}

@media(min-width:768px){
  .md\:w-auto{width:auto}
  .md\:w-48{width:12rem}
  .md\:h-\[140px\]{height:140px}
  .md\:max-h-full{max-height:100%}
  .md\:p-4{padding:1rem}
  .md\:text-sm{font-size:.875rem;line-height:1.25rem}
}

/* === ADDITIONAL MISSING UTILITY CLASSES === */
.text-warn{color:#E65100}
.text-success{color:#558B2F}