@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300..800;1,300..800&display=swap";:root{--bg-main:#f8fafb;--bg-sidebar:#edf0f3;--card-bg:#ffffffd9;--card-border:#d3d9de99;--card-hover-border:#904cf066;--text-primary:#1d2330;--text-secondary:#525c6f;--text-muted:#818898;--accent-purple:#731ded;--accent-blue:#0b50da;--accent-cyan:#0492ae;--accent-green:#148f47;--accent-red:#cf1726;--accent-yellow:#ae7b04;--glass-gradient:linear-gradient(135deg, #ffffffe6 0%, #f0f2f5cc 100%);--btn-gradient:linear-gradient(135deg, var(--accent-purple) 0%, var(--accent-blue) 100%);--font-title:"Plus Jakarta Sans", sans-serif;--font-body:"Plus Jakarta Sans", sans-serif}*{box-sizing:border-box;margin:0;padding:0;font-family:Plus Jakarta Sans,sans-serif}body{background-color:var(--bg-main);color:var(--text-primary);background-image:radial-gradient(at 10% 20%,#9a5eed14 0,#0000 50%),radial-gradient(at 90% 80%,#5e8eed14 0,#0000 50%);background-attachment:fixed;min-height:100vh;overflow-x:hidden;font-family:Plus Jakarta Sans,sans-serif!important}button,input,select,textarea{font-family:Plus Jakarta Sans,sans-serif!important}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#b6bcc966;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#98a1b399}.glass-panel{background:var(--card-bg);-webkit-backdrop-filter:blur(12px);border:1px solid var(--card-border);border-radius:16px;transition:all .3s cubic-bezier(.4,0,.2,1)}.glass-panel-hover:hover{border-color:var(--card-hover-border);transform:translateY(-2px);box-shadow:0 12px 30px -10px #5814b833}h1,h2,h3,h4,h5{font-family:var(--font-title);letter-spacing:-.02em;font-weight:600}.main-layout{background-color:var(--bg-main);width:100vw;height:100vh;display:flex;overflow:hidden}.sidebar{background:var(--bg-sidebar);border-right:1px solid var(--card-border);z-index:10;shrink:0;flex-direction:column;width:270px;height:100vh;padding:24px 16px;display:flex;overflow-y:auto;box-shadow:2px 0 12px #00000008}.logo-container{shrink:0;align-items:center;gap:12px;margin-bottom:24px;padding:0 6px;display:flex}.logo-text{background:linear-gradient(135deg, var(--text-primary) 0%, var(--text-secondary) 100%);-webkit-text-fill-color:transparent;font-size:22px;font-weight:700;font-family:var(--font-title);-webkit-background-clip:text}.studio-badge{background:var(--accent-purple);color:#fff;letter-spacing:.05em;border-radius:6px;padding:2px 6px;font-size:10px;font-weight:600}.nav-links{flex-direction:column;flex:1;gap:6px;padding-right:4px;display:flex;overflow-y:auto}.nav-link{color:var(--text-secondary);cursor:pointer;border:1px solid #0000;border-radius:12px;align-items:center;gap:12px;padding:12px 16px;font-size:14px;font-weight:500;text-decoration:none;transition:all .2s;display:flex}.nav-link:hover{color:var(--text-primary);background:#d3d7de80}.nav-link.active{border-color:#0000;box-shadow:0 4px 14px #904cf040;background:var(--btn-gradient)!important;color:#fff!important}.nav-link.active *{color:#fff!important}.content-wrapper{background:var(--bg-main);flex-direction:column;flex:1;height:100vh;display:flex;overflow:hidden}.header{border-bottom:1px solid var(--card-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffd9;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;min-height:76px;padding:12px 24px;display:flex}.header-title-container{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.header-title{color:var(--text-primary);font-size:18px}.header-stats{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.header-stat-item{color:var(--text-secondary);border:1px solid var(--card-border);background:#ffffffd9;border-radius:8px;align-items:center;gap:8px;padding:6px 12px;font-size:12px;display:flex;box-shadow:0 2px 6px #c2ccd60d}.header-stat-value{color:var(--text-primary);font-weight:600}.page-container{flex:1;padding:24px;overflow-y:auto}input,select,textarea{border:1px solid var(--card-border);color:var(--text-primary);font-family:var(--font-body);background:#ffffffe6;border-radius:8px;width:100%;padding:10px 14px;font-size:14px;transition:border-color .2s}input:focus,select:focus,textarea:focus{border-color:var(--accent-purple);outline:none;box-shadow:0 0 0 2px #904cf033}label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;font-size:12px;font-weight:600;display:block}.btn{font-family:var(--font-body);cursor:pointer;border:1px solid #0000;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-size:14px;font-weight:600;transition:all .2s;display:inline-flex}.btn-primary{background:var(--btn-gradient);color:#fff}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 15px #904cf066}.btn-secondary{border-color:var(--card-border);background:#e2e6e999;color:var(--text-primary)!important}.btn-secondary:hover{background:#d3d9ded9}.btn-danger{background:var(--accent-red);color:#fff}.btn-danger:hover{transform:translateY(-1px);box-shadow:0 4px 15px #e8304066}.grid-cols-2{grid-template-columns:repeat(2,1fr);gap:24px;display:grid}.grid-cols-3{grid-template-columns:repeat(3,1fr);gap:24px;display:grid}.grid-cols-4{grid-template-columns:repeat(4,1fr);gap:24px;display:grid}.flex-between{justify-content:space-between;align-items:center;display:flex}.flex-gap-8{align-items:center;gap:8px;display:flex}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:.3s cubic-bezier(.4,0,.2,1) forwards fadeIn}.tab-container{border-bottom:1px solid var(--card-border);gap:8px;margin-bottom:24px;display:flex}.tab-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;padding:10px 16px;font-size:13px;font-weight:600;transition:all .2s}.content-wrapper h1,.content-wrapper h2,.content-wrapper h3,.content-wrapper h4,.content-wrapper h5,.content-wrapper h6,.content-wrapper label,.content-wrapper p,.content-wrapper strong:not([style*="color: var(--accent)"]):not(.btn-primary *):not(.btn-danger *),.content-wrapper span:not(.studio-badge):not(.badge):not(.nav-link *):not(.btn *):not([style*="color: var(--accent)"]):not([style*="color: var(--accent-cyan)"]){color:var(--text-primary)!important}.content-wrapper [style*="color: var(--accent-cyan)"]{color:var(--accent-cyan)!important}.content-wrapper [style*="color: var(--accent-purple)"]{color:var(--accent-purple)!important}.content-wrapper [style*="color: var(--accent-blue)"]{color:var(--accent-blue)!important}.content-wrapper [style*="color: var(--accent-red)"]{color:var(--accent-red)!important}.content-wrapper [style*="color: var(--accent-green)"]{color:var(--accent-green)!important}.content-wrapper [style*="color: var(--accent-yellow)"]{color:var(--accent-yellow)!important}.content-wrapper [style*="background: hsla(230, 20%"],.content-wrapper [style*="background: hsl(230, 25%"],.content-wrapper [style*="background-color: hsla(230, 20%"],.content-wrapper [style*="background-color: hsl(230, 25%"],.content-wrapper [style*="background: rgba(0, 0, 0, 0."],.content-wrapper [style*="background: rgba(0,0,0,0."],.content-wrapper [style*="background-color: rgba(0, 0, 0, 0."],.content-wrapper [style*="background-color: rgba(0,0,0,0."]{border-color:var(--card-border)!important;background:#e2e6e973!important}.content-wrapper [style*="background: rgba(0, 0, 0, 0.3)"],.content-wrapper [style*="background: rgba(0,0,0,0.3)"],.content-wrapper [style*="background-color: rgba(0, 0, 0, 0.3)"],.content-wrapper [style*="background-color: rgba(0,0,0,0.3)"]{background:#dce0e580!important}.content-wrapper [style*="background: rgba(0, 0, 0, 0.2)"],.content-wrapper [style*="background: rgba(0,0,0,0.2)"],.content-wrapper [style*="background-color: rgba(0, 0, 0, 0.2)"],.content-wrapper [style*="background-color: rgba(0,0,0,0.2)"]{background:#e2e6e973!important}.content-wrapper [style*="background: rgba(0, 0, 0, 0.15)"],.content-wrapper [style*="background: rgba(0,0,0,0.15)"],.content-wrapper [style*="background-color: rgba(0, 0, 0, 0.15)"],.content-wrapper [style*="background-color: rgba(0,0,0,0.15)"]{background:#e8ebee66!important}.content-wrapper [style*="background: rgba(0, 0, 0, 0.1)"],.content-wrapper [style*="background: rgba(0,0,0,0.1)"],.content-wrapper [style*="background-color: rgba(0, 0, 0, 0.1)"],.content-wrapper [style*="background-color: rgba(0,0,0,0.1)"]{background:#edf0f259!important}.content-wrapper input,.content-wrapper select,.content-wrapper textarea{color:var(--text-primary)!important;background-color:#fff!important}.glass-panel{background:var(--card-bg)!important;border:1px solid var(--card-border)!important;box-shadow:0 8px 32px #1f26870a!important}.glass-panel-hover:hover{border-color:var(--card-hover-border)!important;box-shadow:0 12px 30px -10px #1f268714!important}.btn-primary,.btn-danger,.btn-primary *,.btn-danger *{color:#fff!important}.tab-btn{color:var(--text-secondary)!important}.tab-btn:hover{color:var(--text-primary)!important}.tab-btn.active{color:var(--accent-purple)!important;border-bottom-color:var(--accent-purple)!important}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}.guidebook-renderer-container{text-align:left;color:#0f172a;flex-direction:column;gap:20px;font-family:Outfit,Inter,system-ui,-apple-system,sans-serif;display:flex}.guidebook-intro-card{color:#0f172a;background:linear-gradient(135deg,#f0f9ff 0%,#e0f2fe 100%);border:2px solid #bae6fd;border-bottom:5px solid #7dd3fc;border-radius:24px;flex-direction:column;gap:10px;padding:24px 28px;display:flex;box-shadow:0 4px 16px #0284c70f}.guidebook-intro-header{justify-content:space-between;align-items:center;gap:16px;display:flex}.guidebook-intro-title{color:#0c4a6e;margin:0;font-size:22px;font-weight:900;line-height:1.25}.guidebook-intro-text{color:#0284c7;margin:0;font-size:15px;font-weight:600;line-height:1.6}.guidebook-mascot-wrapper{flex-shrink:0}.guidebook-audio-card{background:#fff;border:2px solid #e2e8f0;border-bottom:4px solid #cbd5e1;border-radius:18px;align-items:center;gap:12px;padding:12px 18px;display:inline-flex}.guidebook-audio-btn{color:#fff;cursor:pointer;background:#1cb0f6;border-bottom:4px solid #1899d6;border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;width:42px;height:42px;display:flex}.guidebook-section-heading{text-transform:uppercase;letter-spacing:.08em;align-items:center;gap:8px;margin-top:6px;margin-bottom:6px;font-size:13px;font-weight:900;display:flex}.guidebook-section-heading.purple{color:#9333ea}.guidebook-section-heading.emerald{color:#059669}.guidebook-section-heading.blue{color:#2563eb}.guidebook-key-concept-card{color:#0f172a;background:#fff;border:2px solid #e2e8f0;border-bottom:4px solid #cbd5e1;border-radius:20px;flex-direction:column;gap:6px;padding:18px 22px;display:flex;box-shadow:0 2px 8px #00000008}.guidebook-concept-title{color:#0f172a;margin:0;font-size:17px;font-weight:900}.guidebook-concept-desc{color:#475569;margin:0;font-size:14px;font-weight:500;line-height:1.6}.guidebook-example-card{color:#0f172a;background:#fff;border:2px solid #e2e8f0;border-bottom:4px solid #cbd5e1;border-radius:20px;flex-direction:column;gap:12px;padding:22px;display:flex;box-shadow:0 2px 8px #00000008}.guidebook-example-title{color:#0f172a;margin:0;font-size:17px;font-weight:900}.guidebook-example-explanation{color:#475569;margin:0;font-size:14px;font-weight:500;line-height:1.6}.guidebook-emoji-row{flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;padding-top:8px;display:flex}.guidebook-emoji-item{background:#f8fafc;border:2px solid #e2e8f0;border-bottom:3px solid #cbd5e1;border-radius:18px;justify-content:center;align-items:center;padding:10px 18px;font-size:34px;display:inline-flex;box-shadow:0 2px 6px #00000005}.guidebook-parent-tip-card{color:#334155;background:#fff;border:2px solid #e2e8f0;border-bottom:4px solid #cbd5e1;border-radius:18px;align-items:flex-start;gap:12px;padding:16px 20px;font-size:14px;font-weight:500;line-height:1.6;display:flex;box-shadow:0 2px 8px #00000008}.guidebook-parent-tip-bullet{color:#2563eb;font-size:18px;font-weight:900;line-height:1}.guidebook-unsupported-card{color:#991b1b;background:#fff5f5;border:2px dashed #fca5a5;border-radius:18px;align-items:center;gap:10px;padding:16px 20px;font-size:13px;font-weight:600;display:flex}.guidebook-cpa-container{color:#0f172a;background:#fff;border:2px solid #e2e8f0;border-bottom:5px solid #cbd5e1;border-radius:24px;flex-direction:column;gap:20px;padding:24px;display:flex;box-shadow:0 4px 20px #0000000a}.guidebook-cpa-stepper{border-bottom:2px solid #f1f5f9;align-items:center;gap:8px;padding-bottom:14px;display:flex}.guidebook-cpa-step-pill{text-align:center;color:#64748b;background:#f1f5f9;border:1px solid #e2e8f0;border-radius:12px;flex:1;padding:8px 12px;font-size:12px;font-weight:800;transition:all .2s}.guidebook-cpa-step-pill.active{color:#fff;background:#0284c7;border-color:#0284c7;box-shadow:0 2px 8px #0284c74d}.guidebook-cpa-step-pill.completed{color:#15803d;background:#dcfce7;border-color:#86efac}.guidebook-cpa-instruction-row{background:#f0f9ff;border:2px solid #bae6fd;border-radius:18px;justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;display:flex}.guidebook-cpa-instruction-text{color:#0c4a6e;margin:0;font-size:16px;font-weight:800}.guidebook-cpa-listen-btn{color:#fff;cursor:pointer;background:#1cb0f6;border:none;border-bottom:3px solid #1899d6;border-radius:12px;flex-shrink:0;align-items:center;gap:6px;padding:8px 14px;font-size:12px;font-weight:800;display:inline-flex}.guidebook-cpa-listen-btn:active{border-bottom-width:1px;transform:translateY(2px)}.guidebook-cpa-interaction-area{flex-direction:column;align-items:center;gap:20px;display:flex}.guidebook-cpa-source-area{justify-content:center;align-items:center;gap:16px;width:100%;min-height:80px;display:flex}.guidebook-cpa-draggable-object{cursor:grab;-webkit-user-select:none;user-select:none;background:#fff;border:3px solid #38bdf8;border-bottom:5px solid #0284c7;border-radius:20px;justify-content:center;align-items:center;padding:12px 20px;font-size:40px;transition:transform .15s;display:flex;box-shadow:0 4px 12px #0284c726}.guidebook-cpa-draggable-object:active{cursor:grabbing;transform:scale(1.1)}.guidebook-cpa-basket{max-w:420px;background:#fffbe6;border:3px dashed #f59e0b;border-radius:24px;flex-direction:column;justify-content:center;align-items:center;gap:10px;width:100%;min-height:120px;padding:20px;display:flex}.guidebook-cpa-basket-title{color:#b45309;text-transform:uppercase;letter-spacing:.05em;font-size:13px;font-weight:800}.guidebook-cpa-basket-items{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;display:flex}.guidebook-cpa-pictorial-box{justify-content:center;align-items:center;gap:20px;padding:20px;display:flex}.guidebook-cpa-pictorial-item{flex-direction:column;align-items:center;gap:8px;display:flex}.guidebook-cpa-pictorial-number{color:#fff;background:#0284c7;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:14px;font-weight:900;display:flex}.guidebook-cpa-abstract-box{flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:24px;display:flex}.guidebook-cpa-numeral-badge{color:#0284c7;background:#f0f9ff;border:4px solid #38bdf8;border-bottom:8px solid #0284c7;border-radius:32px;justify-content:center;align-items:center;width:120px;height:120px;font-size:72px;font-weight:900;display:flex;box-shadow:0 10px 25px #0284c733}.guidebook-cpa-footer{border-top:2px solid #f1f5f9;justify-content:space-between;align-items:center;margin-top:8px;padding-top:16px;display:flex}.guidebook-cpa-next-btn{color:#fff;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;background:#22c55e;border:none;border-bottom:4px solid #15803d;border-radius:16px;align-items:center;gap:8px;padding:12px 28px;font-size:14px;font-weight:900;transition:all .15s;display:inline-flex;box-shadow:0 4px 12px #22c55e4d}.guidebook-cpa-next-btn:disabled{color:#64748b;cursor:not-allowed;box-shadow:none;background:#cbd5e1;border-bottom-color:#94a3b8}.guidebook-cpa-next-btn:not(:disabled):active{border-bottom-width:2px;transform:translateY(2px)}.guidebook-cpa-success-banner{color:#15803d;text-align:center;background:#dcfce7;border:2px solid #86efac;border-radius:16px;width:100%;padding:12px 18px;font-size:14px;font-weight:800}