:root{--g:#173f35;--l:#316d54;--bg:#f7f8f3;--line:#e2e9e2;--muted:#75837a}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#26372f;font:15px system-ui,'Noto Sans KR',sans-serif}header{background:#fff;border-bottom:1px solid var(--line);padding:16px max(18px,calc((100vw - 740px)/2));font-weight:750;color:var(--g)}main{max-width:740px;margin:auto;padding:24px 18px 60px}.hero{background:var(--g);color:white;border-radius:22px;padding:28px 30px;margin-bottom:16px}.hero p{color:#c8d9cc;font-size:12px}.hero h1{font-size:27px;line-height:1.4;margin:8px 0 0}nav{display:flex;gap:6px;border-bottom:1px solid var(--line);margin-bottom:24px}button{border:0;border-radius:10px;background:#edf3ed;color:var(--g);padding:11px 14px;font-weight:700;cursor:pointer}nav button{background:transparent;color:var(--muted);border-radius:0}nav button.active{color:var(--g);border-bottom:2px solid var(--l)}h2{color:var(--g);font-size:20px}.card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:23px}.card>span{background:#edf3ed;color:var(--l);font-size:12px;padding:5px 9px;border-radius:30px}.card #question{font-weight:700;font-size:22px;line-height:1.5}.card #example,.hint{color:var(--muted);font-size:13px}.row{display:flex;gap:8px;margin-top:22px}input,textarea{width:100%;min-width:0;border:1px solid var(--line);border-radius:10px;padding:12px;font:inherit;background:white}textarea{resize:vertical}button#check,form button,#export{background:var(--g);color:#fff}.hidden{display:none!important}form{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;display:grid;gap:12px}label{font-size:13px;color:#53635a}label input,label textarea{display:block;margin-top:6px}.item{background:#fff;border-bottom:1px solid var(--line);padding:14px 4px;display:flex;justify-content:space-between;gap:8px}.item strong{color:var(--g)}.item p{margin:4px 0;color:#56665c;font-size:13px}.item small{color:var(--muted)}.item button{font-size:11px;padding:7px}.file{display:inline-block;padding:10px;margin-left:8px;color:var(--g);cursor:pointer}.file input{width:1px}#feedback{min-height:22px;font-weight:700;color:var(--l)}footer{color:var(--muted);font-size:11px;text-align:center;padding:25px 0}.hint{line-height:1.6}@media(max-width:500px){main{padding:16px 14px 40px}.hero{padding:24px}.hero h1{font-size:24px}.card,form{padding:17px}.card #question{font-size:20px}.row{flex-direction:column}}