.bottom-nav{position:fixed;bottom:16px;left:50%;transform:translate(-50%);width:100%;max-width:270px;display:flex;justify-content:center;align-items:center;z-index:1000;padding:0 16px env(safe-area-inset-bottom);background:transparent;box-shadow:none}.bottom-nav-pill{width:90%;max-width:480px;height:40px;background:#4BAF79;border-radius:1.875rem;display:flex;justify-content:space-around;align-items:center;box-shadow:var(--shadow-lg)}.nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;text-decoration:none;color:#19331d;font-size:12px;font-weight:500;gap:3px;width:100%;height:100%;transition:color .2s ease;font-family:var(--font-heading)}.nav-item.active{color:#19331d;font-weight:600}.nav-item svg{transition:transform .2s cubic-bezier(.175,.885,.32,1.275)}.nav-item.active svg{transform:translateY(-16px);background-color:#4baf79;border-radius:100%;scale:1.4;padding:4px}.onboarding-container{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--spacing-lg);background:linear-gradient(135deg,#CB4343 0%,#E86969 100%);margin:0}.onboarding-content{max-width:380px;width:100%;background:var(--color-surface);border-radius:var(--radius-md);padding:var(--spacing-xl);box-shadow:var(--shadow-lg);text-align:center}.onboarding-header{margin-bottom:var(--spacing-xl)}.onboarding-title{font-size:32px;font-weight:700;color:var(--color-accent);margin-bottom:var(--spacing-sm)}.onboarding-subtitle{font-size:16px;color:var(--color-text-light);margin:0}.onboarding-features{display:flex;flex-direction:column;gap:var(--spacing-lg);margin-bottom:var(--spacing-xl)}.onboarding-feature{text-align:left;padding:var(--spacing-md);background:var(--color-bg);border-radius:var(--radius-sm);border-left:4px solid var(--color-primary)}.onboarding-feature-icon{font-size:32px;margin-bottom:var(--spacing-sm)}.onboarding-feature h3{font-size:18px;font-weight:600;color:var(--color-text);margin-bottom:var(--spacing-xs)}.onboarding-feature p{font-size:14px;color:var(--color-text-light);margin:0;line-height:1.5}.onboarding-button{width:100%;padding:16px;font-size:18px;font-weight:600;color:#fff;background:var(--color-primary);border:none;border-radius:var(--radius-md);cursor:pointer;transition:all .2s ease;box-shadow:var(--shadow-md)}.onboarding-button:hover{background:var(--color-primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.onboarding-button:active{transform:translateY(0)}:root{--color-primary: #4BAF79;--color-primary-dark: #3d8f63;--color-accent: #CB4343;--color-accent-soft: #ffebee;--color-secondary: #F2C94C;--color-bg: #F8F8F6;--color-surface: #FFFFFF;--color-text: #2B2B2B;--color-text-light: #757575;--color-border: #E0E0E0;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--font-heading: "Quicksand", sans-serif;--font-body: "Inter", sans-serif;--radius-sm: 8px;--radius-md: 12px;--radius-pill: 9999px;--shadow-sm: 0 1px 2px rgba(0,0,0,.05);--shadow-md: 0 4px 6px rgba(0,0,0,.05);--shadow-lg: 0 10px 15px rgba(0,0,0,.05)}*{box-sizing:border-box}body{margin:0;font-family:var(--font-body);background-color:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);margin:0;color:var(--color-text)}h1{font-size:24px;font-weight:700;margin-bottom:var(--spacing-xs)}h2{font-size:20px;font-weight:600;margin-bottom:var(--spacing-sm)}h3{font-size:16px;font-weight:600;margin-bottom:var(--spacing-sm)}p{line-height:1.5;margin-bottom:var(--spacing-md)}button{font-family:var(--font-heading);font-weight:600;cursor:pointer;transition:all .2s ease}.app-shell{max-width:430px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;background-color:#cb4343;box-shadow:0 0 20px #0000001f}.app-header{padding:20px 20px 16px;color:#fffdf6;display:flex;flex-direction:row;align-items:center;gap:12px}.app-header-tagline{font-size:20px;font-weight:700}.app-header-search{display:flex;gap:8px;align-items:center}.app-search-input{flex:1;padding:10px 4px 10px 16px;border-radius:20px;border:none;font-size:14px;font-family:var(--font-body);background:rgba(255,253,246,.95);color:var(--color-text);outline:none;transition:background .2s}.app-search-input::placeholder{color:#999}.app-search-input:focus{background:#FFFDF6}.app-search-button{width:40px;height:40px;border-radius:50%;border:none;background:rgba(255,253,246,.95);color:var(--color-primary);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;flex-shrink:0}.app-search-button:hover:not(:disabled){background:#FFFDF6;transform:scale(1.05)}.app-search-button:disabled{opacity:.5;cursor:not-allowed}.qa-answer-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease-out;padding:20px}.qa-answer-card{background:#FFFDF6;border-radius:16px;max-width:500px;width:100%;max-height:70vh;display:flex;flex-direction:column;box-shadow:0 8px 32px #0003;animation:slideUp .3s ease-out}.qa-answer-header{padding:20px 20px 16px;border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between}.qa-answer-title{font-size:18px;font-weight:600;color:var(--color-text)}.qa-close-button{background:none;border:none;color:var(--color-text-light);cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.qa-close-button:hover{background:var(--color-border);color:var(--color-text)}.qa-answer-content{padding:20px;overflow-y:auto;flex:1;line-height:1.6;color:var(--color-text)}.qa-loading{text-align:center;color:var(--color-text-light);font-style:italic}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.app-container{flex:1;background-color:#fffdf6;border-radius:2.5rem 2.5rem 0 0;box-shadow:0 -4px 16px #00000026;padding-bottom:80px;position:relative}.screen-container{padding:var(--spacing-md);animation:fadeIn .3s ease-out}.screen-header{margin-bottom:var(--spacing-lg);text-align:center}.screen-subtitle{color:var(--color-text-light);font-size:14px}.learn-screen{padding-bottom:var(--spacing-lg)}.learn-hero{background:#d84f4f;color:#fff;padding:22px 20px 32px;border-bottom-left-radius:32px;border-bottom-right-radius:32px}.learn-hero-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.learn-hero-greeting{font-family:var(--font-heading);font-weight:700;font-size:20px}.learn-hero-tagline{font-size:14px;margin-top:4px}.learn-hero-avatar{width:48px;height:48px;border-radius:50%;background:#ffe5e5}.learn-hero-heading{font-family:var(--font-heading);font-weight:700;font-size:24px;margin-bottom:4px}.learn-hero-subtitle{font-size:14px;opacity:.95}.learn-main-wrapper{padding:0 16px;margin-top:-24px}.learn-main-card{background:transparent;border-radius:32px;padding:18px 16px 24px}.learn-tabs{display:flex;background:#f3f3f3;border-radius:999px;padding:4px;margin-bottom:20px}.learn-tab{flex:1;border:none;background:transparent;border-radius:999px;padding:10px 8px;font-size:14px;font-weight:600;color:var(--color-text-light)}.learn-tab-active{background:#4b8cff;color:#fff;box-shadow:var(--shadow-md)}.learn-sections{display:flex;flex-direction:column;gap:1.6em;margin-top:2.2em}.learn-tile-section{position:relative;border-radius:24px;border:2px solid;padding:18px 14px 16px;background:#FFFDF5}.learn-tile-section-chip{position:absolute;top:-14px;left:18px;padding:6px 16px;border-radius:999px;color:#fff;font-size:13px;font-weight:600;box-shadow:var(--shadow-md)}.learn-tile-row{display:flex;gap:12px;overflow-x:auto;padding-top:8px;padding-bottom:4px;background:#FFFDF5}.learn-tile-row::-webkit-scrollbar{height:6px}.learn-tile-row::-webkit-scrollbar-thumb{background:transparent;border-radius:999px}.learn-tile-row-item{flex:0 0 auto;width:72px;display:flex;flex-direction:column;align-items:center;gap:4px}.learn-tile-label{text-align:center;color:#333;font-size:12px;line-height:1.2}.learn-tile-label-en{font-weight:600}.learn-tile-label-cn{font-size:12px;color:#333;font-weight:600}.learn-rules{margin-top:12px}.rules-search{margin-bottom:16px}.rules-search-label{display:block;font-size:13px;font-weight:600;margin-bottom:4px}.rules-search-input{width:100%;padding:10px 12px;border-radius:999px;border:1px solid var(--color-border);font-size:14px;font-family:var(--font-body);outline:none}.rules-search-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 2px #4baf792e}.rules-search-hint{margin-top:4px;font-size:11px;color:var(--color-text-light)}.rules-search-status{margin-top:4px;font-size:11px;color:var(--color-primary)}.learn-hand-section-title{margin-top:8px;margin-bottom:4px;font-size:13px;font-weight:600;color:var(--color-text)}.learn-hand-list{margin-top:4px;display:flex;flex-direction:column;gap:8px}.learn-hand-item{border-radius:var(--radius-sm);border:1px solid var(--color-border);padding:8px 10px;background:#ffffff}.learn-hand-item-highlighted{border-color:var(--color-primary);box-shadow:0 0 0 2px #4baf792e;background:#f3fff8}.learn-hand-header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}.learn-hand-name{font-size:14px;font-weight:600}.learn-hand-multiplier{font-size:12px;font-weight:600;padding:2px 8px;border-radius:999px;background:#f3f4ff;color:#4d5cff}.learn-hand-desc{font-size:13px;color:var(--color-text-light);line-height:1.4}.rule-description-content{padding-left:16px;padding-right:16px;font-size:14px;line-height:1.5;color:var(--color-text-light)}.card{background:var(--color-surface);border-radius:var(--radius-md);padding:var(--spacing-md);box-shadow:var(--shadow-sm);border:1px solid var(--color-border);margin-bottom:var(--spacing-md)}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-sm)}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-sm)}.flex-center{display:flex;align-items:center;justify-content:center}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}