@import"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Sans+TC:wght@100..900&display=swap";@import"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-25..200";hr{border:none;border-top:1px solid var(--gray-200)}body{padding:0;margin:0}header{height:var(--line-height-text-md)}.w-100{width:100%}.space-between{display:flex;align-items:center;justify-content:space-between;gap:var(--space-1)}.text-center{text-align:center}.text-start{text-align:start}.text-end{text-align:end}:root{--primary-color: #3498db;--secondary-color: #2980b9;--accent-color: #27ae60;--dark-color: #2c3e50;--light-color: #ecf0f1;--success-color: #2ecc71;--error-color: #e74c3c;--warning-color: #f39c12;--info-color: #3498db;--spacing-xs: .5rem;--spacing-sm: 1rem;--spacing-md: 1.5rem;--spacing-lg: 2rem}.header-right{display:flex;align-items:center;gap:15px}.question-counter{color:#fff;font-weight:500;font-size:.9rem;white-space:nowrap}.btn-icon{background-color:transparent;color:#fff;border:none;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s}.btn-close{background-color:#ffffff1a}.btn-close:hover{background-color:#fff3}.feedback-container{position:fixed;bottom:0;left:0;right:0;background-color:#fff;padding:1.5rem;box-shadow:0 -2px 10px #0000001a;border-radius:12px 12px 0 0;z-index:1000}.feedback-container.show{transform:translateY(0)}.feedback{max-width:900px;margin:0 auto;padding:1rem;border-radius:8px;margin-bottom:1rem}.feedback.correct{display:block;background-color:#2ecc711a;border:1px solid var(--success-color)}.feedback.incorrect{display:block;background-color:#e74c3c1a;border:1px solid var(--error-color)}.feedback-title{font-weight:700;margin-bottom:.5rem}.feedback.correct .feedback-title{color:var(--success-color)}.feedback.incorrect .feedback-title{color:var(--error-color)}.explanation{margin-top:.5rem}.btn-container{display:flex;justify-content:center}.btn-next{background-color:var(--secondary-color);color:#fff;padding:.8rem 2rem;font-size:1rem;border-radius:4px;cursor:pointer;transition:all .3s;border:none;font-weight:500;min-width:150px}.btn-next:hover{background-color:#1a6aa8}.btn-next:disabled{background-color:#ccc;cursor:not-allowed}.btn-result{background-color:var(--accent-color)}.btn-result:hover{background-color:#219653}.stat{display:flex;align-items:center;font-size:.9rem;color:#666}.stat-value{font-weight:700;margin-left:.3rem;color:var(--dark-color)}.stat-correct .stat-value{color:var(--success-color)}.stat-incorrect .stat-value{color:var(--error-color)}@media (max-width: 768px){.quiz-header{flex-direction:column;align-items:flex-start;gap:1rem}.quiz-control{width:100%;justify-content:space-between}}.mt-025{margin-top:var(--space-025)}.mt-05{margin-top:var(--space-05)}.mt-075{margin-top:var(--space-075)}.mt-1{margin-top:var(--space-1)}.mt-n1{margin-top:calc(var(--space-1)*-1)}.mt-2{margin-top:var(--space-2)}.mt-3{margin-top:var(--space-3)}.mb-025{margin-bottom:var(--space-025)}.mb-05{margin-bottom:var(--space-05)}.mb-075{margin-bottom:var(--space-075)}.mb-1{margin-bottom:var(--space-1)}.mb-n1{margin-bottom:calc(var(--space-1)*-1)}.mb-2{margin-bottom:var(--space-2)}.mb-3{margin-bottom:var(--space-3)}.ml-025{margin-left:var(--space-025)}.ml-05{margin-left:var(--space-05)}.ml-075{margin-left:var(--space-075)}.ml-1{margin-left:var(--space-1)}.ml-n1{margin-left:calc(var(--space-1)*-1)}.ml-2{margin-left:var(--space-2)}.ml-3{margin-left:var(--space-3)}.mr-025{margin-right:var(--space-025)}.mr-05{margin-right:var(--space-05)}.mr-075{margin-right:var(--space-075)}.mr-1{margin-right:var(--space-1)}.mr-n1{margin-right:calc(var(--space-1)*-1)}.mr-2{margin-right:var(--space-2)}.mr-3{margin-right:var(--space-3)}.mx-0{margin-left:0;margin-right:0}.mx-1{margin-left:var(--space-1);margin-right:var(--space-1)}.mx-n1{margin-left:calc(var(--space-n1)*-1);margin-right:calc(var(--space-n1)*-1)}.my-0{margin-top:0;margin-bottom:0}.my-1{margin-top:var(--space-1);margin-bottom:var(--space-1)}.pt-0{padding-top:0}.pt-025{padding-top:var(--space-025)}.pt-05{padding-top:var(--space-05)}.pt-075{padding-top:var(--space-075)}.pt-1{padding-top:var(--space-1)}.pt-125{padding-top:var(--space-125)}.pt-150{padding-top:var(--space-150)}.pb-0{padding-bottom:0}.pb-025{padding-bottom:var(--space-025)}.pb-05{padding-bottom:var(--space-05)}.pb-075{padding-bottom:var(--space-075)}.pb-1{padding-bottom:var(--space-1)}.pb-125{padding-bottom:var(--space-125)}.pb-150{padding-bottom:var(--space-150)}.pl-0{padding-left:0}.pl-025{padding-left:var(--space-025)}.pl-05{padding-left:var(--space-05)}.pl-075{padding-left:var(--space-075)}.pl-1{padding-left:var(--space-1)}.pl-125{padding-left:var(--space-125)}.pl-150{padding-left:var(--space-150)}.pr-0{padding-right:0}.pr-025{padding-right:var(--space-025)}.pr-05{padding-right:var(--space-05)}.pr-075{padding-right:var(--space-075)}.pr-1{padding-right:var(--space-1)}.pr-125{padding-right:var(--space-125)}.pr-150{padding-right:var(--space-150)}.px-0{padding-left:0;padding-right:0}.px-025{padding-left:var(--space-025);padding-right:var(--space-025)}.px-05{padding-left:var(--space-05);padding-right:var(--space-05)}.px-075{padding-left:var(--space-075);padding-right:var(--space-075)}.px-1{padding-left:var(--space-1);padding-right:var(--space-1)}.px-125{padding-left:var(--space-125);padding-right:var(--space-125)}.px-150{padding-left:var(--space-150);padding-right:var(--space-150)}.py-0{padding-left:0;padding-right:0}.py-025{padding-top:var(--space-025);padding-bottom:var(--space-025)}.py-05{padding-top:var(--space-05);padding-bottom:var(--space-05)}.py-075{padding-top:var(--space-075);padding-bottom:var(--space-075)}.py-1{padding-top:var(--space-1);padding-bottom:var(--space-1)}.py-125{padding-top:var(--space-125);padding-bottom:var(--space-125)}.py-150{padding-top:var(--space-150);padding-bottom:var(--space-150)}.btn{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:8px;border-radius:1000px}.btn-primary{background:var(--primary-800);border:1px solid var(--primary-800);box-shadow:0 1px 2px #0a0d120d;color:var(--gray-0)}.btn-primary:active{background:var(--primary-700)}.btn-gray{background:var(--gray-0);border:1px solid var(--gray-300);box-shadow:0 1px 2px #0a0d120d;color:var(--gray-600)}.btn-gray:active{background:var(--primary-800);border:1px solid var(--primary-800);box-shadow:0 1px 2px #0a0d120d;color:var(--gray-0)}.btn-secondary{background-color:transparent;color:var(--gray-0);border:1px solid var(--primary-200)}.btn-secondary:active{background:var(--primary-700)}.btn-tertiary{background:var(--primary-600);border:1px solid var(--primary-600);box-shadow:0 1px 2px #0a0d120d;color:var(--gray-0)}.btn-selected{background:var(--primary-800);border:1px solid var(--primary-800);box-shadow:0 1px 2px #0a0d120d;color:var(--gray-0)}.btn-selected:active{background:var(--primary-700)}.btn-sm{padding:var(--space-025) var(--space-05)}.btn-md{padding:var(--space-025) var(--space-075)}.btn-lg{padding:var(--space-05) var(--space-1)}.btn-xl{padding:var(--space-05) var(--space-125)}.display-xl{font-size:var(--font-size-display-xl);line-height:var(--line-height-display-xl)}.display-lg{font-size:var(--font-size-display-lg);line-height:var(--line-height-display-lg)}.display-md{font-size:var(--font-size-display-md);line-height:var(--line-height-display-md)}.display-sm{font-size:var(--font-size-display-sm);line-height:var(--line-height-display-sm)}.display-xs{font-size:var(--font-size-display-xs);line-height:var(--line-height-display-xs)}.text-xl{font-size:var(--font-size-text-xl);line-height:var(--line-height-text-xl)}.text-lg{font-size:var(--font-size-text-lg);line-height:var(--line-height-text-lg)}.text-md{font-size:var(--font-size-text-md);line-height:var(--line-height-text-md)}.text-sm{font-size:var(--font-size-text-sm);line-height:var(--line-height-text-sm)}.text-xs{font-size:var(--font-size-text-xs);line-height:var(--line-height-text-xs)}.font-weight-100{font-weight:100}.font-weight-200{font-weight:200}.font-weight-300{font-weight:300}.font-weight-400{font-weight:400}.font-weight-500{font-weight:500}.font-weight-600{font-weight:600}.font-weight-700{font-weight:700}.font-weight-800{font-weight:800}.font-weight-900{font-weight:900}.text-color-0{color:var(--gray-0)}.text-color-25{color:var(--gray-25)}.text-color-50{color:var(--gray-50)}.text-color-100{color:var(--gray-100)}.text-color-200{color:var(--gray-200)}.text-color-300{color:var(--gray-300)}.text-color-400{color:var(--gray-400)}.text-color-500{color:var(--gray-500)}.text-color-600{color:var(--gray-600)}.text-color-700{color:var(--gray-700)}.text-color-800{color:var(--gray-800)}.text-color-900{color:var(--gray-900)}.text-error-color-900{color:var(--error-900)}.text-success-color-900{color:var(--success-900)}.bg-color-primary-25{background-color:var(--primary-25)}.bg-color-primary-50{background-color:var(--primary-50)}.bg-color-primary-100{background-color:var(--primary-100)}.bg-color-primary-200{background-color:var(--primary-200)}.bg-color-primary-300{background-color:var(--primary-300)}.bg-color-primary-400{background-color:var(--primary-400)}.bg-color-primary-500{background-color:var(--primary-500)}.bg-color-primary-600{background-color:var(--primary-600)}.bg-color-primary-700{background-color:var(--primary-700)}.bg-color-primary-800{background-color:var(--primary-800)}.bg-color-primary-900{background-color:var(--primary-900)}.bg-color-gray-0{background-color:var(--gray-0)}.bg-color-gray-25{background-color:var(--gray-25)}.bg-color-gray-50{background-color:var(--gray-50)}.bg-color-gray-100{background-color:var(--gray-100)}.bg-color-gray-200{border-color:var(--gray-200)}.bg-color-gray-300{border-color:var(--gray-300)}.bg-color-gray-400{border-color:var(--gray-400)}.bg-color-gray-500{border-color:var(--gray-500)}.bg-color-gray-600{border-color:var(--gray-600)}.bg-color-gray-700{border-color:var(--gray-700)}.bg-color-gray-800{border-color:var(--gray-800)}.bg-color-gray-900{border-color:var(--gray-900)}.border-top{border-top:solid 1px var(--gray-200)}.border-bottom{border-bottom:solid 1px var(--gray-200)}.border-left{border-left:solid 1px var(--gray-200)}.border-right{border-right:solid 1px var(--gray-200)}:root{--primary-25: #FCFAFF;--primary-50: #F9F5FF;--primary-100: #F4EBFF;--primary-200: #E9D7FE;--primary-300: #D6BBFB;--primary-400: #B692F6;--primary-500: #9E77ED;--primary-600: #7F56D9;--primary-700: #6941C6;--primary-800: #53389E;--primary-900: #42307D;--error-25: #FFFBFA;--error-50: #FEF3F2;--error-100: #FEE4E2;--error-200: #FECDCA;--error-300: #FDA29B;--error-400: #F97066;--error-500: #F04438;--error-600: #D92D20;--error-700: #B42318;--error-800: #912018;--error-900: #7A271A;--success-25: #F6FEF9;--success-50: #ECFDF3;--success-100: #D1FADF;--success-200: #A6F4C5;--success-300: #6CE9A6;--success-400: #32D583;--success-500: #12B76A;--success-600: #039855;--success-700: #027A48;--success-800: #05603A;--success-900: #054F31;--gray-0: #FFFFFF;--gray-25: #FDFDFD;--gray-50: #FAFAFA;--gray-100: #F5F5F5;--gray-200: #E9EAEB;--gray-300: #D5D7DA;--gray-400: #A4A7AE;--gray-500: #717680;--gray-600: #535862;--gray-700: #414651;--gray-800: #252B37;--gray-900: #101828;--font-size-display-2xl: 4.5rem;--line-height-display-2xl: 5.625rem;--font-size-display-xl: 3.75rem;--line-height-display-xl: 4.5rem;--font-size-display-lg: 3rem;--line-height-display-lg: 3.75rem;--font-size-display-md: 2.25rem;--line-height-display-md: 2.75rem;--font-size-display-sm: 1.875rem;--line-height-display-sm: 2.375rem;--font-size-display-xs: 1.5rem;--line-height-display-xs: 2rem;--font-size-text-xl: 1.25rem;--line-height-text-xl: 1.875rem;--font-size-text-lg: 1.125rem;--line-height-text-lg: 1.75rem;--font-size-text-md: 1rem;--line-height-text-md: 1.5rem;--font-size-text-sm: .875rem;--line-height-text-sm: 1.25rem;--font-size-text-xs: .75rem;--line-height-text-xs: 1.125rem;--space-unit: var(--line-height-text-md);--space-025: calc(var(--space-unit)*.25);--space-05: calc(var(--space-unit)*.5);--space-075: calc(var(--space-unit)*.75);--space-1: var(--space-unit);--space-125: calc(var(--space-unit)*1.25);--space-150: calc(var(--space-unit)*1.5);--space-2: calc(var(--space-unit)*2);--space-3: calc(var(--space-unit)*3);--font-family-ja: "Noto Sans JP", sans-serif;--font-family-zh-tw: "Noto Sans TC", sans-serif;--font-family-en-us: "sans-serif"}:lang(ja){font-family:Noto Sans JP,sans-serif}:lang(zh-tw){font-family:Noto Sans TC,sans-serif}:lang(en-us){font-family:"sans-serif"}
