.typing-test-container{max-width:800px;margin:0 auto}.language-selector{display:flex;justify-content:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-xl)}.lang-btn{padding:var(--spacing-sm) var(--spacing-xl);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);border:2px solid var(--color-border);border-radius:var(--border-radius-md);background-color:var(--color-white);color:var(--color-text-primary);cursor:pointer;transition:all var(--transition-fast)}.lang-btn:hover{border-color:var(--color-primary);background-color:var(--color-primary-light)}.lang-btn.active{background:var(--gradient-primary);color:var(--color-white);border-color:var(--color-primary)}.stats-bar .stat-value{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-primary)}.text-display{background-color:var(--color-bg-section);padding:var(--spacing-xl);border-radius:var(--border-radius-lg);margin-bottom:var(--spacing-lg)}.text-display .instruction{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-md)}.text-content{font-size:var(--font-size-xl);line-height:2;font-family:Noto Sans KR,sans-serif;word-break:keep-all}.text-content .char{position:relative;padding:2px 0}.text-content .char.correct{color:var(--color-primary)}.text-content .char.incorrect{color:#ef4444;background-color:#fecaca;border-radius:2px}.text-content .char.current{border-bottom:2px solid var(--color-primary);animation:blink 1s infinite}@keyframes blink{0%,50%{border-color:var(--color-primary)}51%,to{border-color:transparent}}.input-area{margin-bottom:var(--spacing-xl)}.input-area textarea{width:100%;height:120px;padding:var(--spacing-lg);font-size:var(--font-size-lg);font-family:Noto Sans KR,sans-serif;border:2px solid var(--color-border);border-radius:var(--border-radius-lg);resize:none;transition:border-color var(--transition-fast)}.input-area textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.input-area textarea::placeholder{color:var(--color-text-secondary)}.live-stats{display:flex;justify-content:center;gap:var(--spacing-xl);margin-bottom:var(--spacing-xl)}.live-stat{text-align:center;padding:var(--spacing-md) var(--spacing-xl);background-color:var(--color-white);border-radius:var(--border-radius-md);box-shadow:var(--shadow-sm)}.live-stat .label{display:block;font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-xs)}.live-stat .value{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary)}.result-section{background-color:var(--color-bg-section);padding:var(--spacing-2xl);border-radius:var(--border-radius-lg);text-align:center;margin-bottom:var(--spacing-xl)}.result-section h2{margin-top:0;margin-bottom:var(--spacing-xl);color:var(--color-primary)}.result-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-md);margin-bottom:var(--spacing-xl)}.result-item{background-color:var(--color-white);padding:var(--spacing-lg);border-radius:var(--border-radius-md);box-shadow:var(--shadow-sm)}.result-item.main{background:var(--gradient-primary);color:var(--color-white)}.result-item.main .result-value{font-size:3rem}.result-item .result-value{display:block;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-xs)}.result-item .result-label{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.result-item.main .result-label{color:#ffffffe6}.btn-secondary{padding:var(--spacing-md) var(--spacing-2xl);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);background-color:var(--color-white);color:var(--color-text-primary);border:2px solid var(--color-border);border-radius:var(--border-radius-md);cursor:pointer;transition:all var(--transition-fast)}.btn-secondary:hover{background-color:var(--color-border);transform:translateY(-2px)}@media(max-width:768px){.result-grid{grid-template-columns:repeat(2,1fr)}.live-stats{flex-wrap:wrap}.language-selector{flex-direction:column}.lang-btn{width:100%}.result-actions{flex-direction:column}.btn-primary,.btn-secondary{width:100%}}@media(max-width:480px){.text-content{font-size:var(--font-size-lg)}.stats-bar{flex-direction:column;gap:var(--spacing-md)}}.reaction-test-container{max-width:700px;margin:0 auto;text-align:center}.game-box{width:100%;min-height:350px;border-radius:var(--border-radius-xl);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;margin-bottom:var(--spacing-xl);-webkit-user-select:none;user-select:none}.game-box.waiting{background:linear-gradient(135deg,#3b82f6,#2563eb);color:var(--color-white)}.game-box.ready{background:linear-gradient(135deg,#ef4444,#dc2626);color:var(--color-white)}.game-box.go{background:linear-gradient(135deg,#10b981,#059669);color:var(--color-white);animation:pulse .5s infinite alternate}.game-box.result{background:linear-gradient(135deg,#6366f1,#4f46e5);color:var(--color-white)}.game-box.too-early{background:linear-gradient(135deg,#f59e0b,#d97706);color:var(--color-white)}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.02)}}.box-content{text-align:center;padding:var(--spacing-xl)}.box-content .icon{font-size:4rem;margin-bottom:var(--spacing-lg)}.box-content p{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin:0}.box-content small{display:block;margin-top:var(--spacing-md);font-size:var(--font-size-base);opacity:.9}.reaction-time{margin-bottom:var(--spacing-md)}.reaction-time .time-value{font-size:5rem;font-weight:var(--font-weight-bold);display:block;line-height:1}.reaction-time .time-unit{font-size:var(--font-size-2xl);opacity:.9}.rating{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);margin:var(--spacing-md) 0}.stats-section{background-color:var(--color-bg-section);padding:var(--spacing-xl);border-radius:var(--border-radius-lg);margin-bottom:var(--spacing-xl)}.stats-section h2{margin-top:0;margin-bottom:var(--spacing-lg);color:var(--color-primary)}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-md);margin-bottom:var(--spacing-lg)}.stat-card{background-color:var(--color-white);padding:var(--spacing-lg);border-radius:var(--border-radius-md);box-shadow:var(--shadow-sm)}.stat-card.best{background:var(--gradient-primary);color:var(--color-white)}.stat-card .stat-value{display:block;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-xs)}.stat-card .stat-label{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.stat-card.best .stat-label{color:#ffffffe6}.recent-results{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--spacing-sm);margin-bottom:var(--spacing-lg)}.result-badge{padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--border-radius-full);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-white)}.result-badge.excellent{background:linear-gradient(135deg,#10b981,#059669)}.result-badge.good{background:linear-gradient(135deg,#3b82f6,#2563eb)}.result-badge.average{background:linear-gradient(135deg,#6366f1,#4f46e5)}.result-badge.slow{background:linear-gradient(135deg,#f59e0b,#d97706)}.result-badge.very-slow{background:linear-gradient(135deg,#ef4444,#dc2626)}.btn-reset{padding:var(--spacing-md) var(--spacing-2xl);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);background-color:var(--color-white);color:var(--color-text-primary);border:2px solid var(--color-border);border-radius:var(--border-radius-md);cursor:pointer;transition:all var(--transition-fast)}.btn-reset:hover{background-color:var(--color-border);transform:translateY(-2px)}.info-section h3{margin-top:var(--spacing-xl);margin-bottom:var(--spacing-md);color:var(--color-text-primary)}.info-section p{color:var(--color-text-secondary);line-height:1.8}@media(max-width:768px){.game-box{min-height:280px}.reaction-time .time-value{font-size:4rem}.stats-grid{grid-template-columns:1fr}}@media(max-width:480px){.game-box{min-height:240px}.box-content .icon{font-size:3rem}.box-content p{font-size:var(--font-size-xl)}.reaction-time .time-value{font-size:3rem}}.memory-test-container{max-width:600px;margin:0 auto;text-align:center}.mode-selector{display:flex;justify-content:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-xl)}.mode-btn{padding:var(--spacing-sm) var(--spacing-xl);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);border:2px solid var(--color-border);border-radius:var(--border-radius-md);background-color:var(--color-white);color:var(--color-text-primary);cursor:pointer;transition:all var(--transition-fast)}.mode-btn:hover{border-color:var(--color-primary);background-color:var(--color-primary-light)}.mode-btn.active{background:var(--gradient-primary);color:var(--color-white);border-color:var(--color-primary)}.stats-bar{display:flex;justify-content:center;gap:var(--spacing-xl);margin-bottom:var(--spacing-xl);padding:var(--spacing-md);background-color:var(--color-bg-section);border-radius:var(--border-radius-lg)}.stats-bar .stat-item{text-align:center}.stats-bar .stat-label{display:block;font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-xs)}.stats-bar .stat-value{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-primary)}.game-area{min-height:400px;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:var(--color-bg-section);border-radius:var(--border-radius-lg);padding:var(--spacing-xl);margin-bottom:var(--spacing-xl)}.instruction{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--spacing-xl)}.btn-start{padding:var(--spacing-lg) var(--spacing-3xl);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);background:var(--gradient-primary);color:var(--color-white);border:none;border-radius:var(--border-radius-lg);cursor:pointer;transition:all var(--transition-fast)}.btn-start:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}.number-display{display:flex;justify-content:center;gap:var(--spacing-md);margin-bottom:var(--spacing-xl)}.number-item{width:60px;height:70px;display:flex;align-items:center;justify-content:center;font-size:2.5rem;font-weight:var(--font-weight-bold);background:var(--gradient-primary);color:var(--color-white);border-radius:var(--border-radius-md);animation:popIn .3s ease}@keyframes popIn{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.pattern-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-md);margin-bottom:var(--spacing-xl)}.grid-cell{width:80px;height:80px;background-color:var(--color-white);border:3px solid var(--color-border);border-radius:var(--border-radius-md);display:flex;align-items:center;justify-content:center;transition:all .3s ease}.grid-cell.active{background:var(--gradient-primary);border-color:var(--color-primary);animation:pulse .5s ease}.grid-cell.selected{background:linear-gradient(135deg,#10b981,#059669);border-color:#10b981}.pattern-grid.input-mode .grid-cell{cursor:pointer}.pattern-grid.input-mode .grid-cell:hover:not(.selected){border-color:var(--color-primary);background-color:var(--color-primary-light)}.order-num{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-white)}.user-input-display{display:flex;justify-content:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-xl)}.input-item{width:50px;height:60px;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);background-color:var(--color-white);border:2px solid var(--color-primary);border-radius:var(--border-radius-md);color:var(--color-primary)}.input-item.empty{border-style:dashed;color:var(--color-text-secondary)}.number-pad{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--spacing-sm);margin-bottom:var(--spacing-lg)}.num-btn{width:50px;height:50px;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);background-color:var(--color-white);border:2px solid var(--color-border);border-radius:var(--border-radius-md);cursor:pointer;transition:all var(--transition-fast)}.num-btn:hover{background:var(--gradient-primary);color:var(--color-white);border-color:var(--color-primary)}.btn-clear{padding:var(--spacing-sm) var(--spacing-xl);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);background-color:var(--color-white);color:var(--color-text-secondary);border:2px solid var(--color-border);border-radius:var(--border-radius-md);cursor:pointer;transition:all var(--transition-fast)}.btn-clear:hover{background-color:var(--color-border)}.result-screen{text-align:center}.result-icon{width:100px;height:100px;margin:0 auto var(--spacing-lg);display:flex;align-items:center;justify-content:center;font-size:3rem;border-radius:50%;color:var(--color-white)}.result-icon.correct{background:linear-gradient(135deg,#10b981,#059669)}.result-icon.wrong{background:linear-gradient(135deg,#ef4444,#dc2626)}.result-screen h2{margin-bottom:var(--spacing-lg);color:var(--color-text-primary)}.correct-answer{padding:var(--spacing-md);background-color:var(--color-white);border-radius:var(--border-radius-md);margin-bottom:var(--spacing-xl)}.correct-answer p{margin:0;color:var(--color-text-secondary)}.result-actions{display:flex;justify-content:center;gap:var(--spacing-md)}.btn-primary{padding:var(--spacing-md) var(--spacing-2xl);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);background:var(--gradient-primary);color:var(--color-white);border:none;border-radius:var(--border-radius-md);cursor:pointer;transition:all var(--transition-fast)}.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.btn-secondary{padding:var(--spacing-md) var(--spacing-xl);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);background-color:var(--color-white);color:var(--color-text-primary);border:2px solid var(--color-border);border-radius:var(--border-radius-md);cursor:pointer;transition:all var(--transition-fast)}.btn-secondary:hover{background-color:var(--color-border)}.info-section{background-color:var(--color-bg-section);padding:var(--spacing-xl);border-radius:var(--border-radius-lg);text-align:left;margin-top:var(--spacing-xl)}@media(max-width:480px){.mode-selector{flex-direction:column}.mode-btn{width:100%}.grid-cell{width:60px;height:60px}.number-item{width:45px;height:55px;font-size:2rem}.number-pad{grid-template-columns:repeat(5,1fr);gap:var(--spacing-xs)}.num-btn{width:45px;height:45px;font-size:var(--font-size-lg)}.result-actions{flex-direction:column}.btn-primary,.btn-secondary{width:100%}}.random-picker-container{max-width:900px;margin:0 auto;text-align:center}.random-picker-container h1,.random-picker-container .subtitle{text-align:center}.picker-layout{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xl);margin-bottom:var(--spacing-xl)}.input-section.hidden{display:none}.input-section{width:100%;max-width:500px;background-color:var(--color-bg-section);padding:var(--spacing-xl);border-radius:var(--border-radius-lg)}.input-section h3{margin-top:0;margin-bottom:var(--spacing-md);color:var(--color-text-primary)}.input-group{display:flex;gap:var(--spacing-sm);margin-bottom:var(--spacing-lg)}.input-group input{flex:1;padding:var(--spacing-md);font-size:var(--font-size-base);border:2px solid var(--color-border);border-radius:var(--border-radius-md);transition:border-color var(--transition-fast)}.input-group input:focus{outline:none;border-color:var(--color-primary)}.btn-add{padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);background:var(--gradient-primary);color:var(--color-white);border:none;border-radius:var(--border-radius-md);cursor:pointer;transition:all var(--transition-fast)}.btn-add:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.items-list{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);margin-bottom:var(--spacing-lg);max-height:150px;overflow-y:auto}.item-tag{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);background-color:var(--color-white);border-radius:var(--border-radius-full);border-left:4px solid;font-size:var(--font-size-sm)}.item-tag span{white-space:nowrap}.btn-remove{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:none;border:none;color:var(--color-text-secondary);font-size:var(--font-size-lg);cursor:pointer;border-radius:50%;transition:all var(--transition-fast)}.btn-remove:hover{background-color:#fee2e2;color:#ef4444}.btn-clear{width:100%;padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm);background-color:var(--color-white);color:var(--color-text-secondary);border:2px solid var(--color-border);border-radius:var(--border-radius-md);cursor:pointer;transition:all var(--transition-fast);margin-bottom:var(--spacing-lg)}.btn-clear:hover{background-color:#fee2e2;color:#ef4444;border-color:#ef4444}.pick-count-section{display:flex;align-items:center;gap:var(--spacing-md);margin-bottom:var(--spacing-lg)}.pick-count-section label{font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.pick-count-section select{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-base);border:2px solid var(--color-border);border-radius:var(--border-radius-md);background-color:var(--color-white);cursor:pointer}.wheel-section{display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0 auto}.wheel-container{position:relative;width:300px;height:300px;margin:0 auto var(--spacing-lg)}.wheel-pointer{position:absolute;top:-20px;left:50%;transform:translate(-50%);font-size:2rem;color:#ef4444;z-index:10;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}.wheel-canvas{width:100%;height:100%;border-radius:50%;box-shadow:var(--shadow-lg)}.wheel-placeholder{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:var(--color-bg-section);border-radius:50%;border:3px dashed var(--color-border)}.wheel-placeholder p{color:var(--color-text-secondary)}.btn-spin{padding:var(--spacing-md) var(--spacing-2xl);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);background:var(--gradient-primary);color:var(--color-white);border:none;border-radius:var(--border-radius-lg);cursor:pointer;transition:all var(--transition-fast);margin-bottom:var(--spacing-lg)}.btn-spin:hover:not(:disabled){transform:translateY(-3px);box-shadow:var(--shadow-lg)}.btn-spin:disabled{opacity:.5;cursor:not-allowed}.btn-spin.spinning{animation:shake .5s infinite}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.warning-text{color:#f59e0b;font-size:var(--font-size-sm);margin-top:var(--spacing-sm)}.winner-display{text-align:center;padding:var(--spacing-2xl);background:linear-gradient(135deg,#fef3c7,#fcd34d);border-radius:var(--border-radius-lg);animation:celebrate .5s ease;width:100%;max-width:300px}@keyframes celebrate{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}.winner-display h2{margin:0 0 var(--spacing-md);color:#92400e;font-size:var(--font-size-2xl)}.winner-name{font-size:2.5rem;font-weight:var(--font-weight-bold);color:#78350f;margin-bottom:var(--spacing-lg)}.btn-reset{padding:var(--spacing-sm) var(--spacing-xl);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);background-color:var(--color-white);color:#78350f;border:2px solid #78350f;border-radius:var(--border-radius-md);cursor:pointer;transition:all var(--transition-fast)}.btn-reset:hover{background-color:#78350f;color:var(--color-white)}.history-section{background-color:var(--color-bg-section);padding:var(--spacing-xl);border-radius:var(--border-radius-lg);margin-bottom:var(--spacing-xl)}.history-section h3{margin-top:0;margin-bottom:var(--spacing-lg);color:var(--color-text-primary)}.history-list{display:flex;flex-direction:column;gap:var(--spacing-sm);max-height:200px;overflow-y:auto}.history-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-white);border-radius:var(--border-radius-md)}.history-number{font-weight:var(--font-weight-bold);color:var(--color-primary);min-width:40px}.history-name{flex:1;font-weight:var(--font-weight-medium)}.history-time{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.info-section{background-color:var(--color-bg-section);padding:var(--spacing-xl);border-radius:var(--border-radius-lg);margin-top:var(--spacing-xl)}.info-section h2{margin-top:0;margin-bottom:var(--spacing-lg);color:var(--color-primary)}.info-section ul{list-style:none;padding:0;margin:0}.info-section ul li{padding:var(--spacing-md) var(--spacing-lg);margin-bottom:var(--spacing-sm);background-color:var(--color-white);border-radius:var(--border-radius-md);position:relative;padding-left:45px}.info-section ul li:before{content:"✓";position:absolute;left:var(--spacing-md);color:var(--color-primary);font-weight:var(--font-weight-bold)}@media(max-width:768px){.wheel-container{width:250px;height:250px}}@media(max-width:480px){.input-group{flex-direction:column}.btn-add{width:100%}.wheel-container{width:220px;height:220px}}
