/* 오늘의 공원 v0.3 · Daylight UI — bright, friendly, accessible */
:root {
  font-family: -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Malgun Gothic', system-ui, sans-serif;
  color:#27374a; background:#f7f9fc; font-synthesis:none;line-height:1.55;
  --ink:#26334a; --muted:#718196; --green:#13a58b; --green-dark:#087963;
  --coral:#ff7166;--yellow:#ffda7c;--mint:#e6faf2;--border:#ecedf2;
  --shadow:0 12px 35px rgba(47,67,96,.07);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;min-width:320px;background:linear-gradient(120deg,#f8fafc,#fffaf4 65%,#f4fbfa)}
button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #49c9ae;outline-offset:3px}
a{color:inherit}p,h1,h2,h3{margin:0}
h2{font-size:clamp(1.3rem,2.5vw,1.65rem);letter-spacing:-.055em;line-height:1.38}
h3{font-size:1.13rem;letter-spacing:-.04em}
[hidden]{display:none!important}
.svg-defs{position:absolute;width:0;height:0;overflow:hidden}
.icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;vertical-align:middle}
.app-shell{max-width:1160px;min-height:100dvh;margin:0 auto;background:#fff;box-shadow:0 0 100px rgba(28,64,91,.045);overflow:clip}
main{padding-bottom:140px}
/* Fresh, spacious header */
.topbar{height:90px;display:flex;justify-content:space-between;align-items:center;padding:0 clamp(22px,4.3vw,64px);background:#fff}
.brand{display:flex;align-items:center;gap:13px;text-decoration:none;min-width:0}
.brand-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:17px;background:#d9f7e9;color:#159e7f;flex-shrink:0;transform:rotate(-5deg)}
.brand-icon .icon{width:26px;height:26px;stroke-width:2.5}
.brand-copy{display:flex;flex-direction:column;line-height:1.3}.brand-copy strong{font-size:1.25rem;letter-spacing:-.07em;color:#23384b}
.brand-copy small{font-size:.76rem;color:#9aa5b3;margin-top:4px;letter-spacing:-.02em}
.location-button{display:flex;align-items:center;gap:8px;border:1px solid #c4eadd;background:#e7fbf4;color:#078d77;border-radius:100px;padding:11px 17px;font-size:.86rem;font-weight:850;white-space:nowrap;box-shadow:0 4px 16px #0aa58a0c}
.location-button .icon{width:18px;height:18px}
.location-button:hover{background:#d9f8ed}
/* Big change: warm, daylight hero — no dark green block */
.hero{position:relative;display:flex;align-items:center;overflow:hidden;isolation:isolate;margin:0 clamp(16px,2.8vw,32px);min-height:330px;padding:44px clamp(26px,4.4vw,58px);border-radius:33px;color:var(--ink);background:linear-gradient(112deg,#fff3d8 0%,#ffeddb 47%,#e5f9ed 100%)}
.hero:before{position:absolute;content:"";inset:-50px auto auto -100px;width:235px;height:235px;background:radial-gradient(circle,#fff9e3aa 15%,transparent 68%);pointer-events:none}
.hero-body{position:relative;z-index:2;max-width:61%}
.hero-pill{display:inline-flex;align-items:center;gap:8px;background:#fffaf0;border:1px solid #ffe1ba;border-radius:50px;padding:7px 14px;color:#b16d32;font-size:.76rem;font-weight:850;letter-spacing:-.02em}
.hero-pill>span{color:#ff7e60;font-size:1.1rem;line-height:1}
.hero h1{font-size:clamp(2.1rem,4.1vw,3.25rem);line-height:1.23;letter-spacing:-.073em;margin-top:19px;font-weight:900;color:#28394c;word-break:keep-all}
.hero h1 em{font-style:normal;color:#f47761;text-decoration:none}
.hero p{font-size:.92rem;line-height:1.75;color:#5f7080;margin-top:13px;font-weight:520;word-break:keep-all}
.hero-actions{display:flex;align-items:center;gap:15px;flex-wrap:wrap;margin-top:24px}
.hero-note{font-size:.73rem;color:#8f978f;font-weight:650}
.btn{border:0;border-radius:15px;padding:13px 20px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:.88rem;font-weight:850;transition:filter .18s,transform .15s,box-shadow .15s}
.btn:active{transform:scale(.985)}
.btn.white{background:#ff7466;color:#fff;box-shadow:0 9px 24px #ef74633f}
.btn.white:hover{filter:brightness(1.05);box-shadow:0 12px 26px #ef74634d}
.btn.white .icon,.btn.more .icon{width:17px;height:17px}
.btn.primary{background:var(--coral);color:#fff}.btn.outlined{border:1px solid #c7eae3;background:#fff;color:#08927d}.btn.ghost{background:#ecfbf6;color:#247768}
.hero-art{position:absolute;right:-10px;bottom:-2px;width:52%;height:95%;pointer-events:none;z-index:1}
.hero-art>svg{display:block;width:100%;height:100%}
.hero-float{position:absolute;right:6%;bottom:20px;display:flex;gap:9px;align-items:center;background:#fff;box-shadow:0 10px 28px #44675520;border-radius:17px;padding:10px 14px;transform:rotate(3deg)}
.float-emoji{font-size:1.4rem}.hero-float strong{display:block;font-size:.72rem;white-space:nowrap;color:#273d4a}.hero-float small{display:block;font-size:.64rem;color:#8291a0;white-space:nowrap}
/* Section labels and cards */
.env-section,.park-section,.content-section{padding:43px clamp(23px,4.3vw,64px) 0}
.section-header{display:flex;align-items:flex-end;justify-content:space-between;gap:13px;margin-bottom:20px}
.overline{font-weight:850;font-size:.72rem;letter-spacing:.085em;color:#f27d66;margin-bottom:7px}
.section-header h2{color:#263a4a}.section-desc{font-size:.84rem;color:#8a98a5;margin-top:6px}
.text-button{display:flex;align-items:center;gap:6px;border:0;background:#f4faf8;border-radius:100px;color:#159781;padding:9px 13px;font-weight:780;font-size:.77rem;white-space:nowrap}.text-button .icon{width:16px;height:16px}
.env-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.stat-card{position:relative;overflow:hidden;min-width:0;min-height:189px;border-radius:25px;padding:23px 25px;border:1px solid #d7f0f1;background:linear-gradient(135deg,#eafcfe 0%,#e7f9f3 100%)}
.stat-weather{background:linear-gradient(125deg,#fff7df 0%,#fff1eb 100%);border-color:#ffedd5}
.stat-card:after{content:"";position:absolute;width:124px;height:124px;border-radius:50%;right:-54px;top:-46px;background:#fff8;pointer-events:none}
.stat-head{display:flex;justify-content:space-between;align-items:center;position:relative;z-index:1}
.icon-circle{display:grid;place-items:center;width:43px;height:43px;border-radius:15px}
.air-ico{background:#ccf6ee;color:#00a58a}.sun-ico{background:#ffe6a5;color:#ed9654}.icon-circle .icon{width:23px;height:23px}
.stat-source{font-size:.72rem;color:#7b9298;font-weight:750}
.stat-label{font-size:.84rem;color:#65838a;font-weight:720;margin-top:16px}.stat-label small{font-size:.7rem;color:#819ca4}
.stat-value{font-size:clamp(1.48rem,3vw,2rem);font-weight:900;color:#253d4b;line-height:1.25;letter-spacing:-.06em;margin-top:4px;overflow-wrap:anywhere}
.stat-foot{font-size:.74rem;color:#728b90;margin-top:9px;line-height:1.5;overflow-wrap:anywhere}.stat-weather .stat-foot{color:#a08477}
.advice{margin-top:13px;display:flex;gap:11px;align-items:flex-start;border-radius:16px;background:#f1faf8;padding:15px 17px;color:#4d7d75;font-size:.81rem;line-height:1.6}
.advice .icon{width:19px;height:19px;margin-top:1px;color:#0e9f8c}
.forecast{margin-top:11px;border:1px solid #edf0f2;border-radius:17px;padding:0 18px;background:#fff}
.forecast summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:15px 0;font-size:.82rem;font-weight:770;color:#62778b}.forecast summary::-webkit-details-marker{display:none}.forecast[open] summary span{transform:rotate(180deg)}
.hour-strip{display:flex;gap:9px;overflow:auto;padding:4px 0 17px}.hour-cell{background:#fff6e8;min-width:90px;padding:12px 7px;text-align:center;border-radius:13px;font-size:.79rem;color:#7c705f}.hour-cell b{display:block;font-size:1.13rem;margin:5px 0;color:#303b48}.hour-cell small{color:#9f8c7c}
.muted{color:#8391a0;font-size:.82rem}
/* Airbnb-style focused search with cheerful chips */
.finder-panel{background:#fff;border:1px solid #eaedf2;border-radius:25px;padding:21px 22px;box-shadow:0 13px 37px rgba(45,64,101,.07)}
.search-field{display:flex;align-items:center;gap:12px;background:#f7f9fc;border:1.5px solid #e8edf2;border-radius:17px;height:59px;padding:0 19px;transition:border-color .15s,background .15s}
.search-field:focus-within{border-color:#17b9a2;background:#fff}.search-field .icon{color:#12ad96;width:23px;height:23px}
.search-field input{width:100%;flex:1;min-width:0;background:transparent;border:0;outline:0;color:#243b49;font-size:.91rem}.search-field input::placeholder{color:#a2afba}
.finder-caption{margin-top:19px;color:#495d6b;font-size:.82rem;font-weight:850}
.filter-row{display:flex;flex-wrap:wrap;gap:9px;margin-top:11px;padding-bottom:2px}
.chip{flex:0 0 auto;white-space:nowrap;border:1px solid #e7ebf0;background:#f8fafc;color:#586c7d;border-radius:100px;padding:10px 17px;font-size:.84rem;font-weight:800;transition:background .15s,border-color .15s,transform .15s}
.chip:nth-child(2){background:#fff7e9;border-color:#ffe8c7}.chip:nth-child(3){background:#f0f4ff;border-color:#e4eaff}.chip:nth-child(4){background:#f9efff;border-color:#f2e4fa}.chip:nth-child(5){background:#eaf9f3;border-color:#def3e8}
.chip.is-active,.chip:nth-child(n).is-active{background:#13ab96;border-color:#13ab96;color:#fff;box-shadow:0 5px 17px #13ab9635}
.chip:hover{transform:translateY(-1px)}
.sort-line{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:22px;padding-top:18px;border-top:1px solid #eff1f3}
.select-field{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;font-weight:800;font-size:.79rem;color:#758699}
.select-field select{width:min(100%,180px);min-width:0;border:1px solid #e6ebf1;background:#f9fbfe;color:#42546a;border-radius:11px;padding:10px 12px;font-size:.81rem;font-weight:750}
.results-bar{display:flex;justify-content:space-between;align-items:center;padding:29px 2px 16px}
.results-bar h3{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:1.18rem;color:#283a48}
.count-bubble{border-radius:30px;background:#e5faf0;color:#089a7f;padding:5px 10px;font-size:.76rem;letter-spacing:0;font-weight:850}
.result-summary{color:#99a3af;font-size:.78rem;margin-top:5px}
.park-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}
.park-card{position:relative;overflow:hidden;background:#fff;border:1px solid #e9ecf2;border-radius:25px;padding:22px;min-width:0;box-shadow:0 7px 25px rgba(46,60,87,.065);transition:transform .17s,box-shadow .17s}
.park-card:before{content:"";position:absolute;right:-28px;top:-37px;width:128px;height:113px;border-radius:54% 40% 55% 45%;background:#e7faf1;opacity:.8;pointer-events:none}
.park-card:nth-child(3n+2):before{background:#fff1dc}.park-card:nth-child(3n):before{background:#f1eeff}
.park-card:hover{transform:translateY(-3px);box-shadow:0 14px 33px rgba(46,60,87,.105)}
.park-card-top{position:relative;display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.park-card-top>div{min-width:0}
.park-kind{display:inline-block;background:#eff8ff;color:#438eaf;padding:5px 10px;border-radius:8px;font-size:.7rem;font-weight:800}
.park-name{display:block;font-size:1.27rem;font-weight:880;color:#2d3c4a;letter-spacing:-.055em;line-height:1.35;margin-top:12px;overflow-wrap:anywhere}
.heart{position:relative;display:grid;place-items:center;width:42px;height:42px;flex-shrink:0;border:1px solid #eeeef2;background:#fff;color:#8193a6;border-radius:50%}
.heart .icon{width:21px;height:21px}.heart.saved{background:#fff0f1;color:#ff6d7c;border-color:#ffdfe2}.heart.saved .icon{fill:#ff7181;stroke:#ff7181}
.park-address{color:#8c9aa9;font-size:.8rem;margin-top:8px;overflow-wrap:anywhere;min-height:1.4em}
.park-metrics{display:flex;align-items:center;gap:13px;flex-wrap:wrap;margin-top:17px;color:#7f92a1;font-size:.8rem}.park-metrics strong{color:#079d85;font-weight:830}
.recommend{display:flex;align-items:flex-start;gap:8px;background:#f0fbf7;border-radius:13px;padding:13px;margin-top:16px;font-size:.8rem;color:#398878;line-height:1.5}.recommend .icon{width:18px;height:18px;margin-top:1px;color:#10a78f}
.tag-row{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}.tag{border:1px solid #ebeff3;background:#f9fafb;border-radius:9px;padding:6px 9px;color:#677b8b;font-size:.73rem;font-weight:660}.tag.missing{color:#a1abb4}
.card-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}.card-actions a,.card-actions button{display:flex;align-items:center;justify-content:center;gap:6px;text-align:center;text-decoration:none;border:0;border-radius:13px;padding:12px 8px;font-size:.83rem;font-weight:840}.action-detail{background:#f0f6f8;color:#347487}.action-map{background:#ff766a;color:#fff}.card-actions .icon{width:17px;height:17px}
.empty,.list-loading{grid-column:1/-1;background:#f8fbfe;border:1px dashed #dfe9f0;border-radius:21px;padding:36px 21px;text-align:center;color:#8395a5;font-size:.85rem;line-height:1.7}
.empty-symbol{display:grid;place-items:center;margin:0 auto 12px;width:62px;height:62px;border-radius:22px;background:#e4f8f1;color:#0ea78a}.empty-symbol .icon{width:27px;height:27px}.empty b{display:block;color:#365269;font-size:1.05rem;margin-bottom:6px}
.empty-action{margin-top:16px;background:#ff796d;color:#fff;border:0;border-radius:13px;padding:12px 20px;font-weight:830;font-size:.82rem}
.btn.more{display:flex;width:100%;margin:18px auto 0;background:#eaf9f4;color:#0b9680}.btn.more .icon{transform:rotate(90deg)}
.data-warning{color:#837b53;background:#fff9ec;border:1px solid #ffefcc;border-radius:12px;padding:11px 14px;margin-top:14px;font-size:.78rem;line-height:1.6}
/* Saved and record screens */
.content-section{min-height:40vh}.timer-panel{position:relative;overflow:hidden;margin-top:14px;border-radius:26px;text-align:center;padding:39px 21px;background:linear-gradient(135deg,#e5fbf2 0%,#fff3e0 95%)}
.timer-panel:after{content:"✳";font-size:6rem;line-height:1;position:absolute;right:8%;top:0;color:#fff7;pointer-events:none}
.timer-caption{font-size:.87rem;font-weight:830;color:#4b8b7c}.timer-display{color:#1c8575;font-size:clamp(3.3rem,8vw,4.5rem);font-weight:900;letter-spacing:-.07em;font-variant-numeric:tabular-nums;margin:13px 0}
.timer-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:21px}.section-header.sub{margin-top:33px}.danger{color:#e46e71}.record-item{display:flex;align-items:center;justify-content:space-between;gap:9px;border-bottom:1px solid #ecedf0;padding:15px 6px;font-size:.86rem}
.footer{margin:52px clamp(23px,4.3vw,64px) 0;border-top:1px solid #eff0f3;padding:22px 0;color:#a2acb6;font-size:.73rem;line-height:1.75}.footer p+p{margin-top:5px}
/* Floating pill navigation */
.bottom-nav{position:fixed;z-index:20;left:50%;bottom:max(16px,env(safe-area-inset-bottom));transform:translateX(-50%);width:min(calc(100% - 30px),610px);min-height:74px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding:8px;background:rgba(255,255,255,.97);border:1px solid #eef0f3;border-radius:25px;box-shadow:0 15px 46px #27385824;backdrop-filter:blur(15px)}
.nav-item{display:flex;justify-content:center;align-items:center;flex-direction:column;gap:3px;min-width:0;background:transparent;border:0;border-radius:18px;padding:8px 5px;color:#90a0b0}.nav-item .icon{width:21px;height:21px}.nav-item small{font-size:.7rem;font-weight:830;white-space:nowrap}
.nav-item.is-current{background:#e2f9f1;color:#008e79}.nav-item:hover:not(.is-current){background:#f6f9fb;color:#527485}
/* Detail sheet */
.park-dialog{border:0;border-radius:25px;padding:0;width:min(540px,calc(100% - 26px));max-height:85dvh;overflow:auto;box-shadow:0 25px 90px #27385840}.park-dialog::backdrop{background:#21354899}
.dialog-body{padding:29px 25px}.dialog-body h2{font-size:1.53rem;letter-spacing:-.055em;margin:12px 0 7px;padding-right:34px}.dialog-sub{color:#8998a6;font-size:.83rem}
.dialog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:21px 0}.detail-value{background:#edfaf5;border-radius:13px;padding:15px;font-size:.85rem}.detail-value:nth-child(2){background:#fff6e9}.detail-value span{display:block;color:#789c98;font-size:.74rem}.detail-value b{display:block;color:#284455;font-size:.95rem;margin-top:3px}
.dialog-facilities{border-bottom:1px solid #edf0f2;padding:12px 0;font-size:.85rem;line-height:1.7}.dialog-facilities strong{color:#157e71}.dialog-facilities p{color:#728495;margin-top:3px;overflow-wrap:anywhere}.dialog-body .muted{margin:19px 0}
.dialog-close{position:absolute;right:17px;top:17px;border:0;border-radius:50%;width:38px;height:38px;background:#f3f6f8;color:#506579;display:grid;place-items:center}
.dialog-map{display:block;text-align:center;background:#ff786e;color:#fff;border-radius:13px;padding:14px;text-decoration:none;font-size:.86rem;font-weight:850}.dialog-map-sub{margin-top:9px;background:#e5f9f3;color:#158d76}
.toast{position:fixed;z-index:35;bottom:106px;left:50%;transform:translateX(-50%) translateY(15px);opacity:0;pointer-events:none;max-width:90vw;text-align:center;background:#26394f;color:#fff;border-radius:13px;padding:12px 18px;font-size:.84rem;box-shadow:0 10px 34px #122a4340;transition:opacity .2s,transform .2s}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:800px){
  .park-list{grid-template-columns:1fr}.hero{min-height:306px}.hero-body{max-width:67%}.hero-art{width:49%}
  .env-section,.park-section,.content-section{padding-top:35px}
}
@media(max-width:600px){
  .topbar{height:73px;padding:0 20px}.brand-icon{height:39px;width:39px;border-radius:13px}.brand-icon .icon{width:23px;height:23px}.brand-copy strong{font-size:1.06rem}.brand-copy small{font-size:.67rem}.location-button{padding:9px 12px;font-size:.78rem}
  .hero{margin:0 12px;border-radius:25px;padding:27px 22px;min-height:305px;align-items:flex-start}
  .hero-body{max-width:100%;width:100%}.hero h1{font-size:clamp(1.98rem,7vw,2.52rem);margin-top:13px}.hero-pill{font-size:.68rem;padding:6px 11px}
  .hero p{max-width:79%;font-size:.79rem;line-height:1.65;margin-top:11px}.desktop-break{display:none}.hero-actions{margin-top:15px}.hero-note{display:none}
  .hero-art{width:63%;height:62%;right:-26px;bottom:-17px;opacity:.85}.hero-float{display:none}
  .hero .btn.white{position:relative;z-index:2;font-size:.81rem;padding:12px 15px}
  .env-section,.park-section,.content-section{padding:31px 17px 0}.section-header{align-items:flex-start}.section-desc{font-size:.78rem}
  .stat-card{min-height:164px;padding:16px;border-radius:18px}.icon-circle{height:36px;width:36px;border-radius:12px}.icon-circle .icon{width:19px;height:19px}.stat-label{font-size:.75rem;margin-top:14px}.stat-value{font-size:1.41rem}.stat-foot{font-size:.67rem}.stat-source{font-size:.65rem}
  .finder-panel{padding:15px;border-radius:20px}.search-field{height:52px;padding:0 14px}.search-field input{font-size:.83rem}.filter-row{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:7px;margin-top:10px}.filter-row::-webkit-scrollbar{display:none}.chip{padding:9px 14px;font-size:.79rem}.finder-caption{margin-top:14px;font-size:.79rem}
  .select-field{display:grid;gap:5px;justify-content:stretch}.select-field select{width:100%;max-width:none}
  .park-card{padding:18px;border-radius:20px}.park-name{font-size:1.19rem}.footer{margin:42px 17px 0}.bottom-nav{bottom:max(9px,env(safe-area-inset-bottom));min-height:65px;border-radius:21px}.nav-item{border-radius:14px}.nav-item small{font-size:.64rem}
}
@media(max-width:400px){
 .env-section .section-header h2 span{display:none}
 .hero{min-height:308px}.hero h1{font-size:1.91rem}.hero p{max-width:86%;font-size:.73rem}.hero-art{width:66%;height:58%;opacity:.58}.hero .btn.white{padding:10px 13px}
 .stat-card{padding:13px;min-height:170px}.stat-value{font-size:1.18rem}.stat-foot{font-size:.64rem}.stat-label{font-size:.7rem}.stat-source{font-size:.6rem}
 .sort-line{gap:8px}.card-actions{gap:7px}.card-actions a,.card-actions button{font-size:.76rem}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn,.park-card,.chip,.toast{transition:none}}
