:root{--background: #f6f7f4;--surface: #ffffff;--text: #172b28;--text-muted: #667571;--primary: #087f78;--primary-soft: #e6f3f0;--border: #d9e0dd;--warning: #9a5a16;--warning-soft: #fff5e7;--success: #167267;--error: #a33b35;--radius: 14px;--space: 4px;font-family:Pretendard,Noto Sans KR,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--text);background:var(--background);font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html{min-width:320px;background:var(--background)}body{min-width:320px;min-height:100vh;margin:0}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a,button{color:inherit}:focus-visible{outline:3px solid rgba(8,127,120,.38);outline-offset:3px}.app-shell{width:min(100%,640px);min-height:100vh;min-height:100dvh;margin:0 auto;padding:max(20px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) calc(112px + env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));background:var(--surface)}.skip-link{position:fixed;z-index:20;top:8px;left:50%;padding:10px 14px;border-radius:8px;background:var(--text);color:#fff;transform:translate(-50%,-160%)}.skip-link:focus{transform:translate(-50%)}.page-header{padding-top:2px}.service-name{display:block;font-size:1.125rem;font-weight:800;letter-spacing:-.02em}.page-header__eyebrow{margin:36px 0 8px;color:var(--primary);font-size:.875rem;font-weight:750}.page-header h1{max-width:14ch;margin:36px 0 0;font-size:clamp(2rem,9vw,2.75rem);line-height:1.16;letter-spacing:-.045em;word-break:keep-all}.page-header__eyebrow+h1{margin-top:0}.home-intro{max-width:29rem;margin:16px 0 0;color:#435753;font-size:1rem;line-height:1.65;word-break:keep-all}.today-label{margin:12px 0 0;color:var(--text-muted);font-size:.8125rem}.page-section{margin-top:42px}.page-section>h2,.section-heading h2{margin:0 0 12px;font-size:1.25rem;letter-spacing:-.025em}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}.section-heading h2{margin:0}.section-heading a{min-height:44px;display:inline-flex;align-items:center;color:var(--primary);font-size:.875rem;font-weight:700;text-decoration:none}.location-group{margin-top:24px}.location-group h3{margin:0;padding-bottom:8px;color:var(--text-muted);font-size:.8125rem;letter-spacing:.01em}.location-list{margin:0;padding:0;list-style:none;border-top:1px solid var(--border)}.location-list li{border-bottom:1px solid var(--border)}.location-link{display:flex;min-height:72px;align-items:center;justify-content:space-between;gap:16px;text-decoration:none}.location-link>span:first-child{min-width:0}.location-link strong{display:block;font-size:1rem;line-height:1.4}.location-link small{display:block;margin-top:4px;overflow:hidden;color:var(--text-muted);font-size:.8125rem;line-height:1.4;text-overflow:ellipsis;white-space:nowrap}.location-link__action{flex:none;color:var(--primary);font-size:.8125rem;font-weight:700}.location-list--compact .location-link{min-height:54px}.bottom-navigation{position:fixed;z-index:10;bottom:0;left:50%;display:grid;width:min(100%,640px);grid-template-columns:repeat(3,1fr);padding:8px max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));border-top:1px solid var(--border);background:#fffffff5;transform:translate(-50%)}.bottom-navigation__item{display:flex;min-height:56px;align-items:center;justify-content:center;flex-direction:column;gap:3px;border-radius:10px;color:var(--text-muted);font-size:.75rem;font-weight:650;text-decoration:none}.bottom-navigation__item svg{width:22px;height:22px}.bottom-navigation__item[data-active=true]{color:var(--primary);font-weight:800}.detail-actions{display:flex;min-height:48px;align-items:center;justify-content:space-between;gap:12px}.back-button,.favorite-button{display:inline-flex;min-height:44px;align-items:center;gap:6px;padding:0;border:0;background:transparent;font-size:.875rem;font-weight:750;cursor:pointer}.back-button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2}.favorite-button{padding-inline:8px;color:var(--primary)}.favorite-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8}.favorite-button[data-active=true] svg{fill:currentColor}.detail-header{padding:28px 0 26px}.detail-header p{margin:0 0 6px;color:var(--text-muted);font-size:.875rem}.detail-header h1{margin:0 0 12px;font-size:clamp(2rem,9vw,2.625rem);letter-spacing:-.045em}.mock-badge{display:inline-flex;align-items:center;min-height:26px;padding:3px 9px;border:1px solid #d7ad6f;border-radius:999px;background:#fff8ec;color:#80531b;font-size:.75rem;font-weight:750}.source-badge,.live-badge{display:inline-flex;min-height:26px;align-items:center;padding:3px 9px;border:1px solid #9abfba;border-radius:999px;color:#2f6862;font-size:.75rem;font-weight:750}.live-badge{border-color:#70b2a9;background:#eaf6f3;color:#116d64}.section-label-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}.section-label-row .section-kicker{margin-bottom:0}.recommendation{padding:24px;border-left:4px solid var(--primary);border-radius:0 var(--radius) var(--radius) 0;background:var(--primary-soft)}.section-kicker{margin:0 0 7px;color:var(--primary);font-size:.8125rem;font-weight:800}.recommendation h2{margin:0;font-size:1.625rem;line-height:1.28;letter-spacing:-.035em;word-break:keep-all}.recommendation>p:not(.section-kicker){margin:10px 0 0;color:#3b5b57;line-height:1.58;word-break:keep-all}.recommendation--unavailable{border-left-color:#94a49f;background:#f1f4f2}.recommendation--unavailable .section-kicker{color:#526964}.score{display:flex;align-items:center;gap:8px;margin-top:20px}.score__label{color:var(--text-muted);font-size:.75rem;font-weight:700}.score__dots{display:flex;gap:4px}.score__dots i{width:9px;height:9px;border:1px solid #77a49f;border-radius:50%;background:#fff}.score__dots i[data-filled=true]{border-color:var(--primary);background:var(--primary)}.score strong{color:#245e58;font-size:.8125rem}.experience-time{margin-top:38px;padding:0 0 28px;border-bottom:1px solid var(--border)}.experience-time h2{margin:0;font-size:clamp(2rem,10vw,3rem);line-height:1.18;letter-spacing:-.045em}.time-details{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:12px;margin-top:22px}.time-details>div{min-width:0}.time-details span{display:block;margin-bottom:5px;color:var(--text-muted);font-size:.8125rem}.time-details strong{display:block;font-size:1.05rem;line-height:1.35}.time-details .exit-time{padding-left:16px;border-left:3px solid #d78120}.time-details .exit-time span,.time-details .exit-time strong{color:var(--warning)}.time-details .exit-time strong{font-size:1.25rem}.experience-time .unavailable-title{max-width:14ch;font-size:clamp(1.65rem,8vw,2.25rem);line-height:1.3}.unavailable-description{margin:12px 0 0;color:var(--text-muted);font-size:.875rem;line-height:1.65;word-break:keep-all}.warning-message{margin-top:28px;padding:18px 18px 18px 20px;border-left:3px solid #db963d;background:var(--warning-soft)}.warning-message h2{margin:0 0 10px;color:#754410;font-size:1rem}.warning-message ul{margin:0;padding-left:19px;color:#684c2d;font-size:.9rem;line-height:1.6}.warning-message li+li{margin-top:4px}.summary-section{margin-top:46px}.summary-section>.state-message{margin-top:12px}.section-heading-text{margin-bottom:18px}.section-heading-text h2{margin:0;font-size:1.25rem;line-height:1.4;letter-spacing:-.025em;word-break:keep-all}.weather-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:0;border-top:1px solid var(--border)}.weather-grid>div{min-width:0;padding:16px 4px;border-bottom:1px solid var(--border)}.weather-grid>div:nth-child(odd){padding-right:16px}.weather-grid>div:nth-child(2n){padding-left:16px;border-left:1px solid var(--border)}.weather-grid dt,.tide-list dt{color:var(--text-muted);font-size:.8125rem}.weather-grid dd{margin:5px 0 0;font-size:1.075rem;font-weight:750}.weather-grid dd small{display:block;margin-top:3px;color:var(--text-muted);font-size:.75rem;font-weight:550}.forecast-time{margin:8px 0 0;color:var(--text-muted);font-size:.8125rem}.data-warning{margin:0 0 12px;padding:10px 12px;border-left:3px solid #d8a35e;background:var(--warning-soft);color:#745024;font-size:.8125rem;line-height:1.5}.tide-list{margin:0;border-top:1px solid var(--border)}.tide-list>div{display:flex;min-height:58px;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--border)}.tide-list dd{margin:0;font-size:1.05rem;font-weight:750}.detail-more{margin-top:42px;border-block:1px solid var(--border)}.detail-more summary{min-height:54px;display:flex;align-items:center;justify-content:space-between;font-weight:750;cursor:pointer}.detail-more summary:after{content:"+";color:var(--primary);font-size:1.5rem;font-weight:400}.detail-more[open] summary:after{content:"−"}.detail-more p{margin:0 0 14px;color:var(--text-muted);font-size:.875rem;line-height:1.6}.data-status{margin-top:34px}.data-status>div{display:flex;align-items:center;justify-content:space-between;gap:12px}.data-status h2{margin:0;font-size:1rem}.data-status dl{margin:14px 0 0;color:var(--text-muted);font-size:.8125rem}.data-status dl div{display:flex;justify-content:space-between;gap:20px;padding:5px 0}.data-status dd{margin:0;color:#43534f;text-align:right}.safety-footer{margin:28px 0 0;color:var(--text-muted);font-size:.8125rem;line-height:1.65;word-break:keep-all}.text-link{display:inline-flex;min-height:44px;align-items:center;margin-top:8px;color:var(--primary);font-size:.875rem;font-weight:750}.state-message{margin-top:52px;padding-top:24px;border-top:1px solid var(--border)}.state-message[data-state=loading]{border-top-color:#8ebeb8}.state-message[data-state=stale]{border-top-color:#d8a35e}.state-message[data-state=error]{border-top-color:#d9aaa6}.state-message h2{margin:0;font-size:1.25rem}.state-message p{margin:10px 0 0;color:var(--text-muted);line-height:1.6}.primary-link{display:inline-flex;min-height:46px;align-items:center;margin-top:22px;padding:0 18px;border-radius:10px;background:var(--primary);color:#fff;font-weight:750;text-decoration:none}.secondary-button{min-height:44px;margin-top:18px;padding:0 15px;border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--primary);font-weight:750;cursor:pointer}.favorite-list{margin-top:38px}.list-note{margin:0 0 10px;color:var(--text-muted);font-size:.8125rem}.favorite-list ul{margin:0;padding:0;border-top:1px solid var(--border);list-style:none}.favorite-list li{display:flex;min-height:78px;align-items:center;gap:12px;border-bottom:1px solid var(--border)}.favorite-list li a{display:flex;min-width:0;min-height:60px;flex:1;justify-content:center;flex-direction:column;text-decoration:none}.favorite-list li a strong,.favorite-list li a span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.favorite-list li a span{margin-top:4px;color:var(--text-muted);font-size:.8125rem}.favorite-list button{min-width:54px;min-height:44px;padding:0 10px;border:1px solid var(--border);border-radius:9px;background:transparent;color:var(--text-muted);font-size:.8125rem;font-weight:700;cursor:pointer}.settings-list{margin-top:38px;border-top:1px solid var(--border)}.settings-list div{display:flex;min-height:64px;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--border)}.settings-list strong{color:var(--text-muted);font-size:.8125rem;text-align:right}.settings-note{margin:24px 0 0;color:var(--text-muted);font-size:.8125rem;line-height:1.6}@media(max-width:359px){.app-shell{padding-inline:max(16px,env(safe-area-inset-left))}.recommendation{padding:20px 18px}.experience-time h2{font-size:1.95rem}.favorite-button{font-size:.8125rem}}@media(min-width:641px){body{background:#e9eeeb}.app-shell{padding-inline:40px;box-shadow:0 0 0 1px #223f3b0f}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important}}
