@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Be+Vietnam+Pro:wght@400;500;600;700&display=swap');
*{margin:0;padding:0;box-sizing:border-box;}
.tz-root{direction:rtl;font-family:'Be Vietnam Pro',sans-serif;color:#322e25;background:#fef6e7;width:100%;height:100dvh;max-height:100dvh;overflow:hidden;display:flex;flex-direction:column;position:relative;-webkit-tap-highlight-color:transparent;user-select:none;}
.tz-root *{box-sizing:border-box;}
.tz-root ::-webkit-scrollbar{display:none;}

/* Framed mode */
.tzabari-framed .tz-root{border-radius:36px;border:3px solid #322e25;box-shadow:0 20px 60px rgba(50,46,37,0.15);}
.tzabari-framed{position:relative;}
.tzabari-framed::before{content:'';position:absolute;top:8px;left:50%;transform:translateX(-50%);width:80px;height:6px;background:#322e25;border-radius:9999px;z-index:200;opacity:0.25;}

/* Screens */
.tz-screen{flex:1;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.tz-screen-center{justify-content:center;align-items:center;text-align:center;padding:24px;}

/* Typography */
.tz-h1{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:2.5rem;color:#005ab1;}
.tz-h2{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:1.4rem;color:#322e25;}
.tz-h3{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:1rem;}
.tz-body{font-family:'Be Vietnam Pro',sans-serif;font-size:13px;color:#605b50;line-height:1.6;}
.tz-small{font-family:'Be Vietnam Pro',sans-serif;font-size:11px;color:#7c766a;}
.tz-stat{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:2rem;color:#322e25;}

/* Buttons */
.tz-btn{width:100%;border:none;border-radius:9999px;padding:16px 24px;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:transform 0.15s;-webkit-tap-highlight-color:transparent;}
.tz-btn:active{transform:scale(0.96);}
.tz-btn-primary{background:linear-gradient(135deg,#005ab1,#63a1ff);color:#fff;box-shadow:0 6px 20px rgba(0,90,177,0.3);}
.tz-btn-secondary{background:#e5dcc9;color:#322e25;}
.tz-btn-small{width:auto;padding:10px 18px;font-size:13px;}
.tz-btn:disabled{opacity:0.4;cursor:default;transform:none!important;}

/* Cards */
.tz-card{background:#f0e7d6;border-radius:1.5rem;padding:20px;}
.tz-card-glass{background:rgba(229,220,201,0.6);backdrop-filter:blur(16px);border-radius:1.5rem;padding:20px;}
.tz-card-blue{background:linear-gradient(135deg,#005ab1,#63a1ff);color:#fff;border-radius:1.5rem;padding:20px;}

/* Progress bar */
.tz-bar{width:100%;height:8px;border-radius:9999px;background:#e5dcc9;overflow:hidden;}
.tz-bar-fill{height:100%;border-radius:9999px;transition:width 0.4s ease;}

/* Timer bar */
.tz-timer-bar{height:5px;border-radius:9999px;background:#e5dcc9;overflow:hidden;}
.tz-timer-fill{height:100%;border-radius:9999px;transition:width 1s linear;}

/* Option buttons */
.tz-opt{background:#f0e7d6;border-radius:1.2rem;padding:14px 16px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;direction:rtl;transition:all 0.2s;width:100%;-webkit-tap-highlight-color:transparent;}
.tz-opt:active:not(.tz-opt-done){transform:scale(0.98);}
.tz-opt-correct{background:linear-gradient(135deg,#005ab1,#63a1ff)!important;color:#fff!important;transform:scale(1.02);}
.tz-opt-wrong{background:#fb515130!important;color:#b31b25!important;}
.tz-opt-revealed{background:linear-gradient(135deg,#51621b,#88d9a0)!important;color:#fff!important;}
.tz-opt-letter{width:30px;height:30px;border-radius:50%;background:#e5dcc9;display:flex;align-items:center;justify-content:center;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:12px;color:#605b50;flex-shrink:0;}

/* Power-up buttons */
.tz-pu{border:none;border-radius:9999px;padding:9px 14px;font-family:'Be Vietnam Pro',sans-serif;font-weight:600;font-size:11px;cursor:pointer;display:flex;align-items:center;gap:4px;-webkit-tap-highlight-color:transparent;transition:transform 0.15s;}
.tz-pu:active{transform:scale(0.95);}
.tz-pu:disabled{opacity:0.4;cursor:default;transform:none!important;}

/* Auth form */
.tz-input{width:100%;padding:14px 18px;border:2px solid #e5dcc9;border-radius:1rem;font-family:'Be Vietnam Pro',sans-serif;font-size:15px;color:#322e25;background:#fef6e7;direction:rtl;outline:none;transition:border-color 0.2s;}
.tz-input:focus{border-color:#005ab1;}

/* Animations */
@keyframes tz-fadeIn{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}
@keyframes tz-pulse{0%,100%{opacity:1;}50%{opacity:0.6;}}
@keyframes tz-bounce{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
.tz-fade{animation:tz-fadeIn 0.4s ease;}
.tz-pulse{animation:tz-pulse 1s infinite;}
.tz-bounce{animation:tz-bounce 1.5s ease-in-out infinite;}

/* Mobile fullscreen */
@media(max-width:480px){
  .tzabari-container[data-fullscreen="1"]{position:fixed!important;top:0!important;left:0!important;right:0!important;bottom:0!important;max-width:100%!important;z-index:99999;}
  .tzabari-container[data-fullscreen="1"] .tz-root{border-radius:0!important;border:none!important;}
  .tzabari-framed .tz-root{border-radius:0!important;border:none!important;}
  .tzabari-framed::before{display:none;}
}