:root{color-scheme:dark;font-family:'LaTale Thai',system-ui,"Segoe UI",sans-serif;color:#e5e7eb;background:#0f1220;line-height:1.6}*{box-sizing:border-box}body{margin:0}main{max-width:1200px;margin:auto;padding:24px}a{color:#fde047;text-underline-offset:4px}header,.section-head{display:flex;align-items:center;gap:18px;flex-wrap:wrap}header h1{flex:1;margin:0}h2{font-size:1.15rem}button,select,input{font:inherit;min-height:44px;border:1px solid #566078;border-radius:9px;padding:9px 14px;color:inherit;background:#171a2b}button{cursor:pointer;border-color:#fde047;color:#fde047}button:hover{background:#302b1f}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #38bdf8;outline-offset:3px}button:disabled{opacity:.4;cursor:not-allowed}.secondary{border-color:#64748b;color:#d1d5db}.notice{background:#22283b;border-left:4px solid #fde047;padding:14px}.footnote,p{overflow-wrap:anywhere}nav{display:flex;gap:16px;margin:22px 0}label{display:flex;flex-direction:column;gap:5px}.choose{flex:1;min-width:0}select{width:100%;max-width:100%}.simulator{display:grid;grid-template-columns:260px minmax(0,1fr);gap:22px}section{border:1px solid #2d2f45;background:#171a2b;border-radius:16px;padding:20px;margin-top:20px}aside{text-align:center}.image-button{padding:0;display:block;width:100%;border-color:#566078;overflow:hidden;background:#0f1220}.image-button img{width:100%;height:225px;object-fit:contain;display:block}.controls{display:flex;gap:10px;flex-wrap:wrap;padding-bottom:15px;border-bottom:1px solid #2d2f45}.results{display:grid;grid-template-columns:repeat(auto-fit,minmax(105px,1fr));gap:10px;margin-top:20px}.reward{border:1px solid #475569;border-radius:12px;padding:12px 8px;background:#0f1220;text-align:center;min-width:0;font-size:.85rem;overflow-wrap:anywhere}.reward[data-grade=S]{border-color:#38bdf8;box-shadow:inset 0 0 24px #38bdf815}.reward[data-grade=A]{border-color:#fde047}.reward img{width:60px;height:60px;object-fit:contain}.reward strong{display:block}.reward .bonus{color:#fde047;font-weight:700}.icon-button{padding:3px;border:0;background:transparent;display:inline-flex;align-items:center}.icon-button img{width:44px;height:44px;object-fit:contain}.section-head h2{flex:1}#history{max-height:360px;overflow:auto;padding-left:30px}#history li{padding:7px;border-bottom:1px solid #2d2f45}.search{max-width:500px}.table-scroll{overflow-x:auto}table{border-collapse:collapse;width:100%}th,td{text-align:left;border-bottom:1px solid #374151;padding:10px}th{background:#1f2233}td:first-child{min-width:220px}td:first-child>div{display:flex;gap:12px;align-items:center}details{font-size:.8rem;color:#b8c2d3}dialog{padding:24px;background:#0f1220;border:1px solid #64748b;border-radius:12px;max-width:95vw;max-height:95vh;color:inherit}dialog::backdrop{background:#000c}dialog img{display:block;max-width:85vw;max-height:75vh;object-fit:contain}#closeImage{position:absolute;right:4px;top:4px;background:#171a2b;font-size:24px}footer{padding:25px 0;color:#b8c2d3;font-size:.85rem}#error{color:#fca5a5}@media(max-width:680px){main{padding:12px}nav{flex-direction:column;gap:10px}.simulator{grid-template-columns:1fr;padding:14px}.image-button{max-width:260px;margin:auto}.results{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.reward{font-size:.75rem}.controls button{flex:1;padding:9px}.controls{gap:8px}section{padding:14px}header{gap:10px}header h1{font-size:1.5rem}td,th{padding:8px}.reward img{width:44px;height:44px}}