*{box-sizing:border-box}body{margin:0;background:#f2f7f5;color:#143e45;font-family:'Noto Sans KR',sans-serif}header,main{max-width:1000px;margin:auto;padding:26px 24px}header{padding-bottom:10px}header>span{font-size:12px;letter-spacing:2px;color:#49877f}h1{font-size:38px;margin:10px 0}header p,small{color:#648384}p{font-size:14px}.stats{display:flex;gap:16px;margin:10px 0 22px}.stats div{flex:1;background:white;border:1px solid #dce9e4;border-radius:16px;padding:18px;font-size:12px}.stats strong{display:block;font-size:26px;margin-top:7px}.sea-wrap{background:#126b85;border-radius:22px;overflow:hidden;box-shadow:0 14px 35px #16495716}.sea-title{padding:16px 22px;color:#e5ffff;font-size:13px;display:flex;justify-content:space-between}canvas{display:block;width:100%;height:330px;touch-action:manipulation;cursor:crosshair}.sea-wrap p{margin:0;padding:14px;text-align:center;background:#0d566d;color:white;min-height:48px}h2{font-size:19px;margin-top:30px}small{font-size:12px;font-weight:400;margin-left:10px}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.card{background:white;border:1px solid #dce9e4;border-radius:16px;padding:18px}.emoji{font-size:38px}.card h3{font-size:15px;margin:10px 0}.card p{color:#678482;font-size:12px;line-height:1.8}button{border:0;border-radius:9px;padding:12px;background:#137b70;color:white;cursor:pointer;font:inherit;font-size:12px;width:100%}button:disabled{background:#e6efeb;color:#8ba09a;cursor:default}footer{display:flex;align-items:center;justify-content:space-between;margin:28px 0;color:#77918b;font-size:12px}footer button{width:auto;background:transparent;color:#77918b;border:1px solid #d2dfd9}@media(max-width:650px){.grid{grid-template-columns:repeat(2,1fr)}header,main{padding:18px 14px}.stats{gap:8px}.stats div{padding:12px}.stats strong{font-size:21px}small{display:block;margin:6px 0}canvas{height:300px}h1{font-size:30px}}

.journey{background:#e1efe9;border-radius:14px;padding:18px;margin-top:18px}.journey>div{display:flex;justify-content:space-between;gap:12px;font-size:13px}.journey span{color:#648384}progress{width:100%;height:8px;margin-top:14px;accent-color:#137b70}.journey p{font-size:12px;color:#648384;margin-bottom:0}button:focus-visible,canvas:focus-visible{outline:3px solid #e5a93b;outline-offset:4px}
