html,body,#root{width:100%;min-height:100%;margin:0;overflow-x:hidden}body{color:#1f2937;background:#f5f7fb;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}header{box-sizing:border-box;width:100%}.page{background:#f5f7fb;width:100%;min-height:100vh}.main{width:100%;padding:0 20px 48px}.category-section{max-width:1800px;margin:0 auto}.header.header-inside{margin-bottom:24px}.title{color:#1f2937;margin:0;font-size:36px;font-weight:800;line-height:1.3}.category-card.menu-card{background:#fff;border:1px solid #dbe5f5;border-radius:26px;min-height:0;padding:56px 24px 24px;transition:transform .2s,box-shadow .2s,border-color .2s;position:relative;box-shadow:0 8px 24px #0f172a0a}.category-link:hover .category-card.menu-card{transform:translateY(-4px);box-shadow:0 14px 30px #0f172a14}.category-card.menu-card-normal{border-color:#d8e5f7}.category-card.menu-card-choice{border-color:#d5eadc}.category-card.menu-card-marathon{border-color:#efd6bf}.menu-card-body{flex-direction:column;align-items:center;display:flex}.menu-badge{border-radius:999px;justify-content:center;align-items:center;min-height:32px;padding:0 12px;font-size:13px;font-weight:800;line-height:1;display:inline-flex;position:absolute;top:10px;left:5px}.menu-badge-normal{color:#356fb2;background:#e8f1ff}.menu-badge-choice{color:#2f7a51;background:#e5f6eb}.menu-badge-marathon{color:#b85f17;background:#ffead8}.card-title{text-align:center;color:#1f2937;margin:0;font-size:26px;font-weight:800;line-height:1.4}.card-icon{width:100%;max-width:260px;height:80px;box-shadow:none;background:0 0;border-radius:0;justify-content:center;align-items:center;margin:0 auto 10px;padding:0;display:flex}.card-icon img{object-fit:contain;width:auto;max-width:110px;height:auto;max-height:110px;display:block}.card-text{text-align:center;color:#5b6472;max-width:94%;margin:0;font-size:17px;line-height:1.7}.back-link{color:#356fb2;margin-top:8px;font-size:16px;font-weight:700;text-decoration:none;display:inline-block}.radicals-container{width:min(100%,720px);max-width:720px;margin:0 auto;overflow:hidden}.radicals-container h1{word-break:keep-all;overflow-wrap:break-word;text-align:center!important;margin-bottom:18px!important;font-size:clamp(22px,4.5vw,40px)!important;line-height:1.35!important}#progress{margin-bottom:8px!important;font-size:clamp(16px,2.8vw,26px)!important}#timer{margin-bottom:22px!important;font-size:clamp(18px,3.5vw,30px)!important}#question-box{justify-content:center!important;align-items:center!important;width:100%!important;max-width:100%!important;padding:8px 0 16px!important;font-size:clamp(16px,3.5vw,30px)!important;display:flex!important;overflow:auto hidden!important}#question-box mjx-container{max-width:100%!important;overflow:auto hidden!important}#choice-area{grid-template-columns:1fr 1fr!important;gap:12px!important;width:100%!important;max-width:100%!important;display:grid!important}.choice-button{border-radius:18px!important;width:100%!important;min-width:0!important;max-width:100%!important;min-height:72px!important;padding:10px!important;overflow:hidden!important}.choice-button>div{font-size:clamp(15px,2.6vw,24px)!important}.choice-button mjx-container{max-width:100%!important;overflow:auto hidden!important}.answer-input{padding:12px!important;font-size:clamp(16px,3.5vw,24px)!important}.answer-preview{font-size:clamp(16px,3.5vw,26px)!important}.app-root{box-sizing:border-box;background:#f5f7fb;justify-content:center;align-items:flex-start;min-height:100vh;padding:32px 16px;display:flex}.app-container{background:#fff;border-radius:16px;width:100%;max-width:800px;padding:24px 24px 32px;box-shadow:0 10px 30px #0f172a1f}.app-title{text-align:center;margin-top:0;margin-bottom:8px;font-size:24px;font-weight:700}.app-subtitle{color:#64748b;text-align:center;margin:0 0 24px;font-size:14px}.question-box{text-align:center;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;margin:16px 0;padding:24px}.question-math{font-size:32px}.input-row{gap:8px;margin:16px 0;display:flex}.input-row input{border:1px solid #cbd5f5;border-radius:8px;outline:none;flex:1;padding:10px 12px;font-size:18px}.input-row input:focus{border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f633}.input-row button{color:#fff;cursor:pointer;background:#3b82f6;border:none;border-radius:8px;padding:0 16px;font-size:16px}.input-row button:hover{background:#2563eb}.preview-box{background:#eef2ff;border:1px solid #e0e7ff;border-radius:12px;justify-content:center;align-items:center;min-height:60px;margin-top:8px;padding:16px;display:flex}.result-text{text-align:center;margin-top:16px;font-size:16px}.result-text.correct{color:#16a34a}.result-text.wrong{color:#dc2626}.judge-mark{opacity:0;pointer-events:none;z-index:1000;font-size:96px;font-weight:700;transition:opacity .15s,transform .15s;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)scale(.5)}.judge-mark.judge-correct{color:#e53935}.judge-mark.judge-wrong{color:#1e88e5}.countdown-overlay{z-index:900;background:#00000059;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.countdown-number{color:#fff;text-shadow:0 0 10px #00000080;font-size:80px;font-weight:700}.mypage-wrapper{max-width:1040px;margin:32px auto;padding:20px}.mypage-panel{background:#fff;border-radius:24px;padding:28px;box-shadow:0 12px 30px #00000014}.mypage-header{justify-content:space-between;align-items:center;gap:16px;margin-bottom:40px;display:flex}.mypage-header-text{text-align:center;flex:1}.mypage-header-text h1{margin:0;font-size:46px;line-height:1.2}.mypage-header-text p{color:#666;margin-top:18px;font-size:20px;font-weight:700}.mypage-logout-button{cursor:pointer;background:#fff;border:1px solid #ddd;border-radius:999px;width:112px;padding:10px 18px;font-weight:700}.mypage-section{margin-top:32px}.mypage-section h2{margin:0 0 20px;font-size:34px}.mypage-card-list{gap:12px;display:grid}.mypage-record-card{background:#f9fafb;border:1px solid #e5e7eb;border-radius:18px;grid-template-columns:70px minmax(180px,1.8fr) minmax(330px,3fr) 120px;align-items:center;gap:12px;padding:14px;display:grid}.mypage-marathon-card{grid-template-columns:minmax(220px,2fr) minmax(300px,3fr) 150px}.mypage-rank-area{justify-content:center;align-items:center;display:flex}.mypage-rank-beginner,.mypage-rank-image-space{justify-content:center;align-items:center;width:54px;height:54px;font-size:34px;display:flex}.mypage-rank-image{object-fit:contain;width:54px;height:54px}.mypage-record-title{font-size:17px;font-weight:700;line-height:1.45}.mypage-rank-name{color:#d32f2f;margin-top:4px;font-size:16px;font-weight:700}.mypage-stats-grid{grid-template-columns:1fr 1fr 1fr 1.8fr;gap:8px;display:grid}.mypage-marathon-card .mypage-stats-grid{grid-template-columns:repeat(4,minmax(70px,1fr))}.mypage-stat{text-align:center;background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:8px}.mypage-stat span{color:#666;margin-bottom:4px;font-size:12px;display:block}.mypage-stat strong{font-size:15px}.mypage-red{color:#d32f2f}.mypage-challenge-button{text-align:center;color:#fff;background:#2563eb;border-radius:999px;padding:10px 12px;font-weight:700;text-decoration:none}.mypage-footer-link{text-align:center;margin-top:28px}.mypage-footer-link a{color:#2563eb;font-weight:700}.mypage-loading,.mypage-login-message{padding:40px}@media (max-width:1400px){.card-grid{grid-template-columns:repeat(2,minmax(320px,1fr))}}@media (max-width:900px){.main{padding:0 16px 40px}.title{font-size:30px}.card-grid{grid-template-columns:1fr;gap:24px}.category-card.menu-card{min-height:auto;padding:52px 20px 24px}.card-title{font-size:24px}.card-text{max-width:100%;font-size:17px}.mypage-wrapper{margin:20px auto;padding:14px}.mypage-panel{padding:22px}.mypage-header{text-align:center;flex-direction:column}.mypage-header-text h1{font-size:38px}.mypage-header-text p{font-size:17px}.mypage-record-card,.mypage-marathon-card{grid-template-columns:64px 1fr}.mypage-stats-grid{grid-column:1/-1;grid-template-columns:repeat(3,1fr)}.mypage-marathon-card .mypage-stats-grid{grid-template-columns:repeat(2,1fr)}.mypage-challenge-button{grid-column:1/-1}}@media (max-width:560px){.main{padding:0 0 36px!important}header{padding-left:12px!important;padding-right:12px!important}.title{font-size:26px}.category-card.menu-card{border-radius:20px;padding:50px 16px 20px}.card-title{font-size:21px}.card-text{font-size:15px}.radicals-container{border-radius:0!important;width:100vw!important;max-width:100vw!important;margin:0!important;padding:18px 14px!important}.radicals-container h1{margin-bottom:14px!important;font-size:clamp(18px,6vw,26px)!important;line-height:1.45!important}#progress{font-size:15px!important}#timer{margin-bottom:16px!important;font-size:17px!important}#question-box{justify-content:flex-start!important;padding:4px 0 12px!important;font-size:clamp(15px,5.2vw,23px)!important}#choice-area{grid-template-columns:1fr!important;gap:10px!important}.choice-button{border-radius:15px!important;min-height:60px!important;padding:9px!important}.choice-button>div{font-size:clamp(14px,4.5vw,20px)!important}.answer-input{font-size:17px!important}.answer-preview,.back-link{font-size:18px!important}.mypage-wrapper{margin:12px auto;padding:10px}.mypage-panel{border-radius:18px;padding:18px}.mypage-header-text h1{font-size:32px}.mypage-header-text p{font-size:15px;line-height:1.6}.mypage-section h2{font-size:26px}.mypage-record-card,.mypage-marathon-card{grid-template-columns:54px 1fr;gap:10px;padding:12px}.mypage-rank-beginner,.mypage-rank-image-space,.mypage-rank-image{width:44px;height:44px}.mypage-rank-beginner{font-size:28px}.mypage-record-title{font-size:16px}.mypage-stats-grid,.mypage-marathon-card .mypage-stats-grid{grid-template-columns:1fr 1fr}.mypage-stat{padding:9px 6px}.mypage-stat strong{font-size:15px}.mypage-challenge-button{grid-column:1/-1;padding:12px;display:block}}.rank-help-button{color:#fff;cursor:pointer;background:#2563eb;border:none;border-radius:999px;margin-top:16px;padding:10px 18px;font-weight:700}.rank-modal-backdrop{z-index:3000;background:#0f172a73;justify-content:center;align-items:center;padding:18px;display:flex;position:fixed;inset:0}.rank-modal{background:#fff;border-radius:24px;width:min(92vw,620px);max-height:86vh;padding:24px;overflow-y:auto;box-shadow:0 20px 50px #00000040}.rank-modal-header{justify-content:space-between;align-items:center;gap:12px;display:flex}.rank-modal-header h2{margin:0;font-size:26px}.rank-modal-close{cursor:pointer;background:#f3f4f6;border:none;border-radius:999px;width:38px;height:38px;font-size:24px;font-weight:700}.rank-modal-text{color:#666;margin:14px 0 18px;line-height:1.7}.rank-modal-list{gap:10px;display:grid}.rank-modal-item{background:#f9fafb;border:1px solid #e5e7eb;border-radius:16px;grid-template-columns:60px 1fr 1.2fr;align-items:center;gap:12px;padding:10px 12px;display:grid}.rank-modal-image{justify-content:center;align-items:center;display:flex}.rank-modal-image img{object-fit:contain;width:48px;height:48px}.rank-modal-image span{font-size:34px}.rank-modal-name{font-size:18px;font-weight:700}.rank-modal-count{color:#555;text-align:right;font-weight:700}@media (max-width:560px){.rank-modal{border-radius:18px;padding:18px}.rank-modal-header h2{font-size:22px}.rank-modal-item{grid-template-columns:50px 1fr}.rank-modal-count{text-align:left;grid-column:2;font-size:14px}.rank-modal-image img{width:42px;height:42px}}*{box-sizing:border-box}body{color:#222;background:#f5f5f7;margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.container{background-color:#fff;border-radius:12px;max-width:520px;margin:40px auto;padding:24px;box-shadow:0 4px 12px #00000014}h1{text-align:center;margin-top:0}.menu{flex-direction:column;gap:12px;margin-top:24px;display:flex}.menu-item,.menu-item100{color:#333;text-align:center;border-radius:8px;padding:12px 16px;font-size:18px;text-decoration:none;transition:transform .1s,box-shadow .1s;display:block}.menu-item{background-color:#e8f0fe}.menu-item100{background-color:#fee8e8}.menu-item:hover,.menu-item100:hover{transform:translateY(-1px);box-shadow:0 2px 6px #0000001f}.menu-item.disabled,.menu-item100.disabled{color:#999;cursor:default;box-shadow:none;background-color:#eee;transform:none}#intro{margin-top:8px}#intro ul{padding-left:20px}#intro li{margin-bottom:4px}#start-button{cursor:pointer;margin:16px auto 0;padding:10px 24px;font-size:18px;display:block}#question-box{text-align:center;min-height:60px;margin:20px 0;font-size:32px}#input-area{justify-content:center;gap:8px;margin-bottom:8px;display:flex}#answer-input{flex:1;padding:8px 12px;font-size:18px}#answer-button{cursor:pointer;padding:8px 16px;font-size:18px}#progress{text-align:center;margin-bottom:4px}#timer{text-align:center;color:#d32f2f;margin-bottom:8px;font-size:18px;font-weight:700}#answer-preview{text-align:center;color:#222;background-color:#f0f3ff;border:1px solid #c3d4ff;border-radius:8px;justify-content:center;align-items:center;min-height:84px;margin:8px 0 16px;padding:10px;font-size:32px;font-weight:700;line-height:1.6;display:flex}#answer-preview .mjx-container,#answer-preview mjx-math,.demo-preview-box mjx-math{line-height:1.6!important}#result{text-align:center;min-height:24px;margin-bottom:8px}#score{text-align:center;margin-bottom:8px;font-weight:700}.back-link{color:#3367d6;margin-top:12px;text-decoration:none;display:inline-block}.back-link:hover{text-decoration:underline}#countdown-overlay{z-index:999;background-color:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#countdown-number{color:#fff;font-size:72px;font-weight:700;animation:1s ease-out infinite pop}@keyframes pop{0%{opacity:1;transform:scale(1)}70%{opacity:1;transform:scale(1.2)}to{opacity:0;transform:scale(.8)}}.judge-mark{pointer-events:none;opacity:0;z-index:1100;font-size:120px;font-weight:700;transition:opacity .12s ease-out,transform .12s ease-out;position:fixed;top:250px;left:50%;transform:translate(-50%)scale(.7)}.judge-mark.show{opacity:1;transform:translate(-50%)scale(1)}.judge-correct{color:#e53935}.judge-wrong{color:#1e88e5}.result-card{text-align:center;background:#f5f7ff;border:1px solid #d6ddff;border-radius:12px;margin-top:16px;padding:20px 16px}.result-title{margin:0 0 12px;font-size:22px;font-weight:700}.result-main{flex-wrap:wrap;justify-content:center;gap:16px;margin-bottom:12px;display:flex}.result-main-item{background:#fff;border-radius:10px;min-width:90px;padding:8px 10px;box-shadow:0 2px 4px #0000000a}.result-main-label{color:#666;margin-bottom:4px;font-size:12px}.result-main-value{font-size:22px;font-weight:700}.result-main-value.score{color:#1976d2}.result-main-value.accuracy{color:#388e3c}.result-main-value.time{color:#d32f2f}.result-message{margin:8px 0 4px}.result-sub{color:#555;margin:0 0 8px;font-size:14px}.result-wrong-title{margin:12px 0 4px;font-weight:600}.result-wrong-list{text-align:left;margin:0;padding-left:20px;display:inline-block}.result-wrong-list li{margin-bottom:4px}.page{justify-content:center;align-items:flex-start;min-height:100vh;padding:24px;display:flex}.header,.main{width:100%;max-width:1150px}.header{text-align:center;margin-bottom:16px}.title{margin:0 0 8px;font-size:32px}.subtitle{color:#666;margin:0}.category-section,.sub-section{background:#fff;border-radius:16px;margin-bottom:16px;padding:20px 20px 24px;box-shadow:0 8px 24px #0000000a}.section-title{margin:0 0 8px;font-size:20px}.section-text{color:#666;margin:0 0 16px}.card-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;display:grid}.category-card{text-align:center;background:#fff;border:1px solid #e3e7ff;border-radius:16px;flex-direction:column;align-items:center;padding:20px 16px 22px;transition:transform 80ms,box-shadow 80ms,border 80ms;display:flex;box-shadow:0 4px 12px #0000000f}.category-card:hover{border-color:#c1cbff;transform:translateY(-3px);box-shadow:0 8px 20px #0000001a}.card-icon{justify-content:center;width:100%;margin-bottom:12px;display:flex}.card-icon img{object-fit:contain;width:96px;height:96px}.card-icon-math{background:#e3f2fd}.card-icon-english{background:#e8f5e9}.card-icon-exam{background:#fff3e0}.card-title{margin:0 0 12px;font-size:18px;font-weight:700}.card-text{color:#555;margin:0;font-size:14px;line-height:1.6}.button-list{flex-direction:column;gap:8px;display:flex}.btn{text-align:center;cursor:pointer;border:none;border-radius:999px;justify-content:center;align-items:center;width:100%;padding:10px 16px;font-size:15px;transition:transform 50ms,box-shadow 50ms,background .2s;display:inline-flex}.btn-category,.btn-sub{color:#1f3a7b;background:#e4efff}.btn-sub-special{color:#7b1f3a;background:#ffe5ea}.btn:hover{transform:translateY(-1px);box-shadow:0 4px 10px #3d5afe26}.btn:active{box-shadow:none;transform:translateY(0)}@media (max-width:768px){.title{font-size:26px}.category-section,.sub-section{padding:16px 14px 20px}.card-grid{grid-template-columns:repeat(1,minmax(0,1fr))}}.category-link{color:inherit;text-decoration:none;display:block}.demo-modal{z-index:1000;pointer-events:auto;justify-content:center;align-items:flex-start;padding-top:56px;display:flex;position:fixed;inset:0}.demo-modal.hidden{display:none}.demo-modal-backdrop{background:#00000073;position:absolute;inset:0}.demo-modal-content{z-index:1;background:#fff;border-radius:16px;width:92%;max-width:520px;padding:20px 24px;position:relative;box-shadow:0 10px 30px #00000026}.demo-modal-title{margin:0 0 6px;font-size:20px}.demo-modal-text{color:#555;margin:0 0 12px;font-size:14px}.demo-modal-close{display:none}.demo-screen{text-align:center;background:#fafafa;border:1px solid #e0e0e0;border-radius:12px;padding:16px 12px 14px;position:relative}.demo-progress{margin-bottom:8px;font-size:24px}.demo-question-box{min-height:40px;margin-bottom:12px;font-size:32px}.demo-input-row{justify-content:center;gap:8px;margin-bottom:8px;display:flex}.demo-input-row input{border:2px solid #90caf9;border-radius:6px;outline:none;flex:1;max-width:320px;padding:8px 10px;font-size:18px}.demo-enter-button{cursor:default;background:#eee;border:1px solid #b0bec5;border-radius:6px;padding:8px 16px;font-size:18px;transition:background .2s,transform .1s}.demo-enter-button.pressed{background:#d0d0d0;transform:translateY(1px)}.demo-preview-box{text-align:center;background-color:#f0f3ff;border:1px solid #c3d4ff;border-radius:8px;justify-content:center;align-items:center;min-height:72px;margin-top:4px;padding:10px;font-size:24px;line-height:1.6;display:flex}.demo-preview-box .mjx-container{line-height:1.6!important}.demo-judge{pointer-events:none;opacity:0;font-size:120px;font-weight:700;transition:opacity .12s ease-out,transform .12s ease-out;position:absolute;top:0;left:50%;transform:translate(-50%)scale(.7)}.demo-judge.correct{color:#e53935;opacity:1;transform:translate(-50%)scale(1)}#demo-judge.judge-mark{z-index:2;position:absolute;top:70px;left:50%;transform:translate(-50%)scale(.7)}.demo-footer{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-top:12px;display:flex}.demo-hide-label{color:#555;align-items:center;gap:4px;font-size:13px;display:flex}.secondary-button{cursor:pointer;background:#f5f5f5;border:1px solid #ccc;border-radius:6px;margin-right:12px;padding:8px 16px}.secondary-button:hover{background:#eee}.demo-screen{position:relative}#demo-judge.demo-judge-pos{position:absolute!important;inset:auto 180px 0 auto!important;transform:none!important}.mjx-sandbox{visibility:hidden;pointer-events:none;visibility:hidden;visibility:hidden;width:0;height:0;position:absolute;top:-9999px;left:-9999px;overflow:hidden}