html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;font-family:Pretendard,-apple-system,serif;scrollbar-width:thin}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{font-family:Pretendard,sans-serif;background:#f9fafb;display:flex;justify-content:center;align-items:center;height:100vh;margin:0;line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}strong{font-weight:600}.r_header{padding:0 16px 16px}.tabs{display:flex;gap:16px;margin-top:16px}.tab{color:#cbd5e1;cursor:pointer;font-size:20px;position:relative}.tab.active{color:#000;font-weight:600}.tab-underline{display:none;width:100%;height:2px;background-color:#000;position:absolute;bottom:-5px}.active .tab-underline{display:block}.top3{display:flex;justify-content:center;align-items:flex-end;gap:20px;margin-top:12px;margin-bottom:24px;padding:20px 0}.rank{display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;gap:4px}.avatar-wrapper{position:relative;display:inline-block}.me-indicator{width:4px;height:50px;background-color:#219aff;border-radius:5px;position:absolute;left:-10px}.rank_number{margin:0 5px}.avatar{width:70px;height:70px;border-radius:50%;overflow:hidden;border:3px solid #7bb6ff;display:grid;place-items:center;background:#f5f9ff}.info .avatar{width:50px;height:50px}.avatar img{width:100%;height:100%;object-fit:cover;margin:0}.badge{position:absolute;right:5px;bottom:95px;width:26px;height:26px;border-radius:50%;color:#fff;font-size:18px;font-weight:600;display:flex;align-items:center;justify-content:center}.badge-1{background-color:#f97316;right:-7px}.badge-2,.badge-3{background-color:#f97316}.list{border:1px solid #e6eef9;border-radius:12px;margin:0 16px 16px;overflow-y:auto;flex-grow:1;background:#fff}.list-item{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid #ccc}.list-item.me:first-child{border-bottom:1.5px solid #5AAAEF;background-color:#eff8ff;position:sticky;z-index:1;top:0}.list-item:last-child{border-bottom:none}.info{display:flex;align-items:center;gap:8px;position:relative}.info-text{display:flex;flex-direction:column}.info-text .name{font-size:14px;font-weight:500}.info-text .meta{font-size:12px;color:#94a3b8}.value{color:#165cf6;font-size:14px;font-weight:500}body{font-family:Pretendard,sans-serif;background:#f9fafb;display:flex;justify-content:center;align-items:center;height:100vh;margin:0}.container{background:#fff;box-shadow:0 4px 12px #0000001a;width:375px;overflow:hidden;display:flex;flex-direction:column;height:100%}.header{border-bottom:1px solid #f1f5f9;padding:16px;display:flex;align-items:center;justify-content:space-between}.logo{width:120px;height:auto}.profile-card{display:flex;align-items:center;background:#fff;border-radius:16px;padding:16px;margin:16px;box-shadow:0 2px 8px #0000000d}.profile-img{width:80px;height:80px;border-radius:50%;object-fit:cover;margin-right:16px}.profile-info{flex:1}.name{font-weight:500;margin:4px 0 2px}.gender{font-weight:400;margin-left:2px}.owner{color:#aaa;font-weight:400;font-size:14px;margin-left:4px}.details{list-style:none;padding:0;margin:0;font-size:15px;color:#444}.details li{margin-bottom:4px}.details span{color:#888;margin-right:4px}.dog_info{display:flex;align-items:center;width:auto;height:130px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000d;border:1px solid #e2e8f0;margin:16px 16px 0}.dog_img{width:112px;height:112px;border-radius:56px;object-fit:cover;margin:9px 12px}.dog_text{display:flex;flex-direction:column;font-size:16px;color:#444}.dog_name{font-size:22px;margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid #dddddd;font-weight:700;display:flex}.dog_gender{font-size:16px}.guardian_name{display:inline-block;vertical-align:bottom;font-size:14px;align-self:end;margin-left:2px;margin-bottom:3px;font-weight:500;color:#888}img{width:18px;height:18px;margin-right:4px;margin-bottom:2px;vertical-align:middle;align-items:baseline}.today{display:flex;align-items:center;width:160px;height:80px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000d;border:1px solid #e2e8f0;margin-top:8px;font-size:10px;flex-direction:column;justify-content:space-around;padding:16px;gap:6px}.today .time,.today .distance,.today .kcal,.today .days{display:flex;font-size:16px;font-weight:700;color:#ef895a}.today .timebox,.today .distancebox,.today .kcalbox,.today .daysbox{display:flex;align-items:center;justify-content:space-between;width:100%}.today_text{color:#000;font-size:12px;font-weight:500}.today .time,.today .distance,.today .kcal,.today .days{font-size:18px;font-weight:700;color:#ef895a}.distance{margin-top:3px}.bottom_box{display:flex;justify-content:space-between;align-items:stretch;padding:0 16px;margin-top:2px}.consecutive_days_box{display:flex;flex-direction:column;justify-content:center;align-items:center;width:140px;height:auto;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000d;border:1px solid #e2e8f0;margin-top:8px;margin-left:5px;line-height:1.4;font-size:14px;font-weight:500}.consecutive_days{font-size:24px;font-weight:700;color:#ef895a}.walk_button{display:flex;justify-content:center;align-items:center}.button{width:340px;height:50px;background-color:#5aaaef;color:#fff;border:none;border-radius:10px;font-size:18px;font-weight:700;display:flex;justify-content:center;align-items:center;text-decoration:none;margin-top:10px;cursor:pointer}.walk-record{background:#fff;border-radius:12px;border:1px solid #e2e8f0;width:300px;height:auto;box-shadow:0 2px 6px #0000001a;padding:16px 20px;margin:10px 18px;font-family:Apple SD Gothic Neo,Noto Sans KR,sans-serif}.walk-title{font-size:16px;font-weight:600;color:#222;margin-top:0;margin-bottom:16px}.days{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;align-items:flex-start}.day{text-align:center}.circle{width:100%;aspect-ratio:1 / 1;border-radius:50%;display:flex;justify-content:center;align-items:center;font-weight:500;font-size:16px;margin-bottom:6px;transition:transform .2s ease}.inactive .circle{background:#e5e5e5;color:#888}.active .circle{background:#4da3ff;color:#fff}.time{font-size:13px;color:#333}.distance{font-size:11px;color:#888}.walk-record img{width:16px;height:16px;transform:translate(2px);object-fit:contain}.walk-history{background:#fff;border-radius:12px;border:1px solid #e2e8f0;width:300px;height:auto;box-shadow:0 2px 6px #0000001a;padding:16px 20px;margin-left:18px;font-family:Apple SD Gothic Neo,Noto Sans KR,sans-serif}.title{font-size:16px;font-weight:600;color:#222;margin-top:0;margin-bottom:4px}.history-card{width:100px;height:100px;background:#fff;border:1px solid #eee;border-radius:16px;padding:4px 7px 9px;flex-shrink:0;cursor:pointer}.route-image{height:80px;width:100%;border-radius:12px;object-fit:contain}.info-row{display:flex;justify-content:space-between;font-size:14px}.date{font-weight:600}.minutes{font-weight:700;color:#e58c58}.history-list{display:flex;gap:16px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.history-list::-webkit-scrollbar{display:none}