@layer base{:root{--sat: env(safe-area-inset-top, 0px);--sab: env(safe-area-inset-bottom, 0px);--sal: env(safe-area-inset-left, 0px);--sar: env(safe-area-inset-right, 0px)}html,body{width:100vw;min-height:100vh;min-height:-webkit-fill-available;margin:0;padding:0;background-color:#fff7ed;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}body{overscroll-behavior:none}.pb-safe{padding-bottom:max(env(safe-area-inset-bottom,0px),16px)}.pt-safe{padding-top:max(env(safe-area-inset-top,0px),14px)}}::-webkit-scrollbar{display:none}*{font-family:Plus Jakarta Sans,sans-serif}.font-title-md,.font-display{font-family:Nunito Sans,sans-serif}.font-mono-xl{font-family:JetBrains Mono,monospace}.clay-card{background:#fff;border-radius:24px;box-shadow:0 12px 24px -4px #5c4a3d1f,0 4px 8px -2px #5c4a3d14,inset 0 3px 6px #fffffff2,inset 0 -3px 6px #b48c7329}.clay-hud{background:#fff;border-radius:24px;border:2px solid #F6E6D8;box-shadow:0 12px 28px -4px #5c4a3d24,inset 0 3px 6px #fffffff2,inset 0 -3px 6px #b48c732e}.clay-playmat{background:linear-gradient(180deg,#fff,#fff8f1);border-radius:28px;border:2.5px solid #F6E6D8;box-shadow:0 14px 30px -4px #5c4a3d1a,inset 0 3px 8px #fffffff2,inset 0 -3px 8px #d2af9626}.clay-card-item{background:#fff;border-radius:22px;box-shadow:0 10px 22px -3px #5c4a3d29,0 4px 8px -2px #5c4a3d1a,inset 0 3px 6px #fffffff2,inset 0 -3px 6px #b48c7333}.clay-btn{background:#fff;border-radius:20px;border:2px solid #F3E4D6;box-shadow:0 8px 18px -2px #5c4a3d24,inset 0 3px 5px #fffffff2,inset 0 -3px 5px #aa826933;transition:all .12s cubic-bezier(.34,1.56,.64,1)}.clay-btn:active{transform:translateY(2px) scale(.96);box-shadow:0 2px 6px #5c4a3d1a,inset 0 2px 4px #0000001f}.clay-btn-pink{background:linear-gradient(135deg,#ffa2b3,#ff8fa3);color:#fff;border-radius:9999px;border:2px solid #FFAEB9;box-shadow:0 10px 24px -2px #ff8fa38c,0 4px 10px #ff8fa359,inset 0 3px 6px #ffffffbf,inset 0 -3px 6px #a0284659;transition:all .12s cubic-bezier(.34,1.56,.64,1)}.clay-btn-pink:active{transform:translateY(2px) scale(.96);box-shadow:0 4px 10px #ff8fa366,inset 0 2px 5px #8c1e3c66}.clay-btn-cyan{background:linear-gradient(135deg,#7be4fc,#5ed7f4);color:#034a5e;border-radius:9999px;border:2px solid #9DEBFF;box-shadow:0 10px 22px -2px #5ed7f48c,0 4px 8px #5ed7f459,inset 0 3px 6px #ffffffd9,inset 0 -3px 6px #034a5e4d;transition:all .12s cubic-bezier(.34,1.56,.64,1)}.clay-btn-cyan:active{transform:translateY(2px) scale(.96);box-shadow:0 4px 10px #5ed7f466,inset 0 2px 5px #034a5e66}.clay-btn-yellow{background:linear-gradient(135deg,#e6ee46,#d7de04);color:#4a4e00;border-radius:9999px;border:2px solid #F0F666;box-shadow:0 8px 18px -2px #d7de0480,0 3px 6px #d7de044d,inset 0 3px 5px #ffffffd9,inset 0 -3px 5px #5055004d;transition:all .12s cubic-bezier(.34,1.56,.64,1)}.clay-btn-yellow:active{transform:translateY(2px) scale(.96);box-shadow:0 3px 8px #d7de0459,inset 0 2px 4px #50550059}.clay-pill-mint{background:linear-gradient(135deg,#9dd8c4,#80bda7);color:#074d3c;border-radius:9999px;box-shadow:0 5px 12px -2px #2c695638,inset 0 2px 5px #ffffffbf,inset 0 -2px 5px #14503c40}.clay-pill-amber{background:linear-gradient(135deg,#ffe480,#ffd6a5);color:#795b34;border-radius:9999px;box-shadow:0 5px 12px -2px #795b3438,inset 0 2px 5px #ffffffd9,inset 0 -2px 5px #8c5a1e40}.clay-pill-cream{background:#efe7dd;color:#544244;border-radius:9999px;box-shadow:0 5px 10px -2px #5c4a3d24,inset 0 2px 4px #fffffff2,inset 0 -2px 4px #a0826e33}.clay-sticker-circle{background:#fff;border-radius:9999px;border:2px solid #F3E4D6;box-shadow:0 6px 14px -2px #5c4a3d24,inset 0 2.5px 5px #fffffff2,inset 0 -2.5px 5px #b48c7333}.clay-slot-empty-circle{background:#faf2e9b3;border-radius:9999px;border:2px dashed #D6C2B4;box-shadow:inset 0 2px 4px #8c6e5a1a,inset 0 -1px 3px #fffc}.clay-nav{background:#fffffff2;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:28px;border:2px solid rgba(246,230,216,.9);box-shadow:0 12px 32px -4px #5c4a3d1f,inset 0 2px 5px #fffffff2,inset 0 -2px 5px #b48c731a}.clay-footer{background:#ffffffeb;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:24px 24px 0 0;border-top:2px solid rgba(246,230,216,.9);box-shadow:0 -8px 24px -4px #5c4a3d14,inset 0 2px 4px #fffffff2}
