@font-face{font-family:'Jakarta';src:url('font/PlusJakartaSans-var.ttf');font-weight:200 800}
:root{--zemin:#FFF4E0;--kart:#FFFFFF;--yazi:#3B2A1A;--soluk:#8A6F52;--vurgu:#FF7A59;--ikincil:#2BB3A3;--sari:#FFC93C;--golge:0 6px 0 rgba(120,80,30,.15)}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{height:100%;background:var(--zemin);color:var(--yazi);font-family:'Jakarta',system-ui,sans-serif;overflow:hidden;touch-action:manipulation}
button{font-family:inherit;border:0;cursor:pointer;color:inherit}
.ekran{display:none;height:100%;flex-direction:column}
.ekran.aktif{display:flex}
.ust{display:flex;align-items:center;justify-content:space-between;padding:14px 18px}
.logo{font-weight:800;font-size:26px;display:flex;align-items:center;gap:4px}
.nokta{width:14px;height:14px;border-radius:50%;display:inline-block}
.n1{background:var(--vurgu)}.n2{background:var(--sari)}.n3{background:var(--ikincil);margin-right:8px}
.ebeveyn{width:44px;height:44px;border-radius:14px;background:#F3E3C6;font-size:20px;color:var(--soluk)}
.temalar{display:flex;gap:10px;padding:4px 18px 12px;overflow-x:auto;scrollbar-width:none}
.temalar::-webkit-scrollbar{display:none}
.tema{flex:none;padding:12px 18px;border-radius:999px;background:var(--kart);font-weight:700;font-size:18px;box-shadow:var(--golge)}
.tema.secili{background:var(--vurgu);color:#fff}
.izgara{flex:1;overflow-y:auto;overflow-x:hidden;display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));align-content:start;gap:16px;padding:6px 18px 30px}
.resim-kart{min-width:0;background:var(--kart);border-radius:26px;box-shadow:var(--golge);padding:14px;display:flex;flex-direction:column;align-items:center;gap:8px;transition:transform .1s}
.resim-kart:active{transform:scale(.96)}
.resim-kart .onizleme{position:relative;width:100%;aspect-ratio:1;display:flex;align-items:center;justify-content:center}
.resim-kart .onizleme svg{width:86%;height:86%;max-width:100%}
.resim-kart span{font-weight:700;font-size:17px}
.resim-kart .rozet{font-size:12px;color:var(--ikincil);font-weight:800}
.boya-ust{gap:10px}
.buyuk-btn{width:56px;height:56px;border-radius:18px;background:var(--kart);box-shadow:var(--golge);font-size:26px}
.baslik{flex:1;text-align:center;font-weight:800;font-size:24px}
.tuval-alan{flex:1;display:flex;align-items:center;justify-content:center;padding:6px 14px;min-height:0}
.tuval{position:relative;background:#fff;border-radius:28px;box-shadow:var(--golge);aspect-ratio:1;height:100%;max-width:100%}
.katman{position:absolute;inset:6%;width:88%;height:88%}
.katman svg{width:100%;height:100%;display:block}
.cizgi{pointer-events:none}
#firca{pointer-events:none}
.alt{padding:10px 12px 16px;display:flex;flex-direction:column;gap:12px}
.araclar{display:flex;justify-content:center;gap:10px}
.arac{display:flex;flex-direction:column;align-items:center;gap:2px;width:72px;padding:8px 0;border-radius:18px;background:var(--kart);box-shadow:var(--golge);font-size:26px}
.arac span{font-size:12px;font-weight:700;color:var(--soluk)}
.arac.secili{background:var(--ikincil)}.arac.secili span{color:#fff}
.palet{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.renk{width:46px;height:46px;border-radius:50%;border:4px solid #fff;box-shadow:0 3px 0 rgba(0,0,0,.12)}
.renk.secili{transform:scale(1.2);border-color:var(--yazi)}
.perde{position:fixed;inset:0;background:rgba(59,42,26,.45);display:flex;align-items:center;justify-content:center;padding:20px;z-index:10}
.perde[hidden]{display:none}
.kutu{background:var(--kart);border-radius:26px;padding:24px;width:min(380px,100%);display:flex;flex-direction:column;gap:12px}
.kutu h2{font-size:22px}.kutu h3{font-size:18px;margin-top:6px}
.soru{font-size:30px;font-weight:800;text-align:center}
.kutu input{font:inherit;font-size:24px;padding:10px;border-radius:14px;border:2px solid #E8D5B0;text-align:center}
.kutu-btn{display:flex;gap:10px}.kutu-btn button,.kutu>div>button{flex:1;padding:12px;border-radius:14px;background:#F3E3C6;font-weight:700;font-size:17px}
.ana-btn{background:var(--vurgu)!important;color:#fff}
.kucuk{font-size:13px;color:var(--soluk)}
.bildirim{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(120px);background:var(--yazi);color:#fff;padding:12px 20px;border-radius:999px;font-weight:700;transition:transform .25s;z-index:20}
.bildirim.goster{transform:translateX(-50%) translateY(0)}
@media (min-width:900px){.boya-ana{flex-direction:row}}
.acilis{position:fixed;inset:0;z-index:30;background:var(--zemin);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;transition:opacity .5s}
.acilis img{width:120px;height:120px;border-radius:28px;box-shadow:var(--golge)}
.acilis-ad{font-weight:800;font-size:30px}
.acilis-alt{font-size:15px;color:var(--soluk);font-weight:600}
.acilis.gizle{opacity:0;pointer-events:none}
.imza{display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 18px 14px;color:var(--soluk);font-size:13px;font-weight:600}
.imza img{height:30px}