:root{--color-primary: #fceb78;--color-black: #000;--color-white: #fff;--color-pastel-white: #fef9e6;--color-error: #d32f2f;--color-success: #848f4b;--color-heart: #e34234;--color-blue: #3498db;--font-family-base: "Courier New", monospace;--font-size-xs: .95rem;--font-size-sm: 1rem;--font-size-md: 1.1rem;--font-size-lg: 1.2rem;--font-size-xl: 1.8rem;--font-size-xxl: 3rem;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--border-width: 1px;--border-basic: var(--border-width) solid var(--color-black);--border-radius-basic: .25rem;--shadow-sm: 3px 3px 0 0 var(--color-black);--shadow-md: 4px 4px 0 0 var(--color-black);--shadow-lg: 6px 6px 0 0 var(--color-black);--shadow-xl: 8px 8px 0 0 var(--color-black);--app-safe-bottom: env(safe-area-inset-bottom, 0px);--app-safe-top: env(safe-area-inset-top, 0px);--app-safe-left: env(safe-area-inset-left, 0px);--app-safe-right: env(safe-area-inset-right, 0px);--vh: 1vh;--app-height: calc(100 * var(--vh, 1vh));--breakpoint-sm: 380px;--breakpoint-md: 480px;--breakpoint-lg: 640px;--breakpoint-xl: 768px;--animation-duration-fast: .1s;--animation-duration-normal: .2s;--animation-duration-slow: .3s;--animation-timing: ease}.halftone{background-color:#fff;background-image:radial-gradient(#000 12%,transparent 13%);background-size:6px 6px;background-repeat:repeat;image-rendering:pixelated}.flex{display:flex}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.flex-grow{flex-grow:1}.flex-shrink-0{flex-shrink:0}.gap-xs{gap:var(--spacing-xs)}.gap-sm{gap:var(--spacing-sm)}.gap-md{gap:var(--spacing-md)}.gap-lg{gap:var(--spacing-lg)}.mt-sm{margin-top:var(--spacing-sm)}.mt-md{margin-top:var(--spacing-md)}.mt-lg{margin-top:var(--spacing-lg)}.mb-sm{margin-bottom:var(--spacing-sm)}.mb-md{margin-bottom:var(--spacing-md)}.mb-lg{margin-bottom:var(--spacing-lg)}.p-sm{padding:var(--spacing-sm)}.p-md{padding:var(--spacing-md)}.p-lg{padding:var(--spacing-lg)}.text-mono{font-family:var(--font-family-base)}.text-center{text-align:center}.text-uppercase{text-transform:uppercase}.text-lowercase{text-transform:lowercase}.font-bold{font-weight:700}.font-semibold{font-weight:600}.font-black{font-weight:900}.text-xs{font-size:var(--font-size-xs)}.text-sm{font-size:var(--font-size-sm)}.text-md{font-size:var(--font-size-md)}.text-lg{font-size:var(--font-size-lg)}.text-xl{font-size:var(--font-size-xl)}.text-xxl{font-size:var(--font-size-xxl)}.border-basic{border:var(--border-basic)}.shadow-sm{box-shadow:var(--shadow-sm)}.shadow-md{box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:var(--shadow-lg)}.shadow-xl{box-shadow:var(--shadow-xl)}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.bg-primary{background-color:var(--color-primary)}.bg-white{background-color:var(--color-white)}.bg-black{background-color:var(--color-black)}.text-black{color:var(--color-black)}.text-white{color:var(--color-white)}.text-error{color:var(--color-error)}.text-success{color:var(--color-success)}.z-1{z-index:1}.z-10{z-index:10}.z-1000{z-index:1000}.overflow-hidden{overflow:hidden}.cursor-pointer{cursor:pointer}.transition-all{transition:all var(--animation-duration-normal) var(--animation-timing)}@media (max-width: 768px){.xl\:flex-col{flex-direction:column}.xl\:text-lg{font-size:var(--font-size-lg)}}@media (max-width: 640px){.lg\:flex-col{flex-direction:column}.lg\:text-md{font-size:var(--font-size-md)}}@media (max-width: 480px){.md\:flex-col{flex-direction:column}.md\:text-sm{font-size:var(--font-size-sm)}}@media (max-width: 380px){.sm\:flex-col{flex-direction:column}.sm\:text-xs{font-size:var(--font-size-xs)}}@keyframes pulse{0%{transform:scale(.5);opacity:1}70%{transform:scale(1.5);opacity:0}to{transform:scale(.5);opacity:0}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes move-background{0%{background-position:0 0}to{background-position:800px 800px}}.animate-pulse{animation:pulse 2s infinite;will-change:transform,opacity}.animate-spin{animation:spin 1s linear infinite;will-change:transform}.animate-move-background{animation:move-background 80s linear infinite;will-change:background-position}.hover-lift{transition:transform var(--animation-duration-fast) var(--animation-timing)}.hover-lift:hover{transform:translate(-2px,-2px)}.hover-lift:active{transform:translate(1px,1px)}
