@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500;600;700&display=swap');

/* House of Gyoza: warm cream surfaces, original deep red, charcoal, and gold accents. */
:root{--paper:#faf6ee;--white:#fffefa;--ink:#211e1b;--muted:#62584c;--rust:#b00000;--rust-dark:#850000;--line:#ded3bf;--green:#80612f;--soft:#f2e9d8;--serif:'Oswald','Arial Narrow',Impact,sans-serif;--display:'Oswald','Arial Narrow',Impact,sans-serif}
html{scroll-padding-top:24px}
body{background:var(--paper);color:var(--ink)}
.site-header{height:110px;border-bottom:1px solid var(--line);position:relative;gap:24px}
.site-header:after{content:'';position:absolute;left:48px;width:48px;bottom:-1px;border-bottom:2px solid var(--rust)}
.brand{display:flex;flex-direction:column;align-items:flex-start;gap:4px;flex-shrink:0}
.brand-art{display:flex;align-items:center;gap:12px;width:284px}
.brand-symbol,.brand-wordmark{position:relative;display:block;overflow:hidden;flex-shrink:0}
.brand-symbol{width:62px;aspect-ratio:1084/722}
.brand-wordmark{flex:1;aspect-ratio:1338/274}
.brand .brand-art img{position:absolute;display:block;height:auto;max-width:none}
.brand-symbol img{width:128.506%;left:-14.023%;top:-5.54%}
.brand-wordmark img{width:104.111%;left:-2.019%;top:-285.036%}
.brand-program{font:600 8px var(--sans);letter-spacing:2.5px;margin-left:74px;color:var(--muted)}
.site-header nav{font-size:12px;font-weight:600}
.nav-cta{border:1px solid var(--line);border-radius:4px;color:var(--rust);padding:12px 18px}
.nav-cta:hover{background:var(--rust);color:var(--white)}
h2{font-weight:500;letter-spacing:-.4px}.section-heading h2{font-size:36px}.section-heading .eyebrow{color:var(--rust-dark)}
.hero{display:block;padding:52px 0 50px}
.hero-copy{display:grid;grid-template-columns:1.05fr 1fr;column-gap:64px;max-width:none;align-items:start}
.hero-copy .eyebrow{grid-column:1;grid-row:1}
.hero h1{grid-column:1;grid-row:2/5}
.hero-copy>.hero-tagline{grid-column:2;grid-row:2}
.hero-copy>.hero-description{grid-column:2;grid-row:3}
.hero-actions{grid-column:2;grid-row:4}
.hero-copy .eyebrow{color:var(--rust-dark);font-size:10px;letter-spacing:2px;font-weight:700}
.tiny-line{background:var(--rust);width:25px}
.hero h1{font-family:var(--display);font-weight:700;font-size:clamp(58px,6vw,80px);letter-spacing:-2.5px;line-height:1.04;margin:18px 0 0}
.hero h1 em{font-style:normal;font-weight:700;color:var(--rust)}
.hero-copy>.hero-tagline{color:var(--ink);font-size:20px;font-weight:600;line-height:1.5;max-width:520px}
.hero-copy>.hero-description{color:var(--muted);font-size:14px;line-height:1.8;max-width:520px;margin-top:13px}
.hero-actions{display:flex;align-items:center;gap:27px;margin-top:27px;flex-wrap:wrap}
.hero-actions .primary-button{font-size:13px;padding:15px 21px;border-radius:4px;gap:24px;font-weight:600}
.hero-how{font-size:11px;border-bottom:1px solid var(--ink);padding-bottom:4px;font-weight:600}
.explore-section{padding-top:35px;border-top:1px solid var(--line);position:relative}
.explorer{border-color:var(--line);border-radius:8px;box-shadow:0 10px 30px #42331808}
.territory-panel,.panel-bottom,.search-wrap,.province-controls select{background:var(--white)}
.panel-intro h3{font-size:19px}.panel-intro p{color:var(--muted)}
.city-row.active{background:#f5e9e2}.city-row:hover{background:#f6f1e8}.city-row .city-name{color:var(--ink)}
.city-row .city-province,.list-caption,.list-controls select,.available-filter{color:var(--muted)}
.city-row .row-status{background:#9b762f}.city-row.unavailable .row-status{background:#b5b7ba}
.map-panel,#map{background-color:#f2eee6}#map{background-image:radial-gradient(#9a8f7630 .65px,transparent .65px)}
.map-loading{background:#f2eee6f2;color:var(--rust-dark)}
.map-tabs,.map-hint,.map-legend,.reset-map{background:#fffefaf2;border-color:var(--line);color:#62584c;border-radius:3px}
.map-tabs button{color:var(--muted)}.map-tabs button.active{background:var(--rust);color:var(--white)}
.map-legend{gap:13px;flex-wrap:wrap;max-width:calc(100% - 60px)}.legend-dot.open{background:#9b762f}.legend-dot.town{background:#b59658;box-shadow:inset 0 0 0 1px #9a722450}.legend-dot.closed{background:#b5b7ba}.legend-dot.selected{background:var(--rust)}
.green-dot{background:#9b762f}.leaflet-control-attribution{background:#f2eee6df!important}.leaflet-control-zoom a{background:var(--white)!important;color:var(--ink)!important}
.map-city-label,.island-label{color:#685638}.leaflet-tooltip,.leaflet-popup-content-wrapper{border-color:var(--line);box-shadow:0 8px 24px #352b1620}
.territory-popup p{color:var(--muted)}.availability-pill{background:#efe6d2;color:#6f5222}.availability-pill.closed{background:#edecef;color:#606168}
.selected-territory,.form-card,.success-section{border-color:var(--line);border-radius:8px}
.selected-territory h3{font-size:27px}.selected-territory .eyebrow,.chosen-city-card .eyebrow{color:var(--rust-dark)}
.province-select-button,.chosen-city-card,.selection-chips button,.success-reference{background:var(--soft);border-color:var(--line)}
.primary-button,.popup-apply{border-radius:4px;background:var(--rust);font-weight:600}.primary-button:hover,.popup-apply:hover{background:var(--rust-dark)}
.progress .current b{background:var(--rust);border-color:var(--rust)}.progress .current{color:var(--rust)}
.preview-notice,.explorer-bottom,.form-security,.form-grid label small{color:var(--muted)}
.preview-tag{color:var(--rust-dark);border-color:var(--line)}
.application-section{padding-top:35px}.application-context>h2{font-size:44px}.form-card>h2{font-size:36px}
.form-grid input,.form-grid select,.form-grid textarea{background:#fffefa;border-color:#c8bead;border-radius:5px;color:var(--ink)}
.form-grid input::placeholder,.form-grid textarea::placeholder{color:#817669}.consent input{accent-color:var(--rust)}
.context-footnote{color:var(--muted)!important}
.how-section{border-top:1px solid var(--line);margin-top:45px;border-bottom-color:var(--line)}.how-heading h2{font-size:42px}.how-heading h2 em{font-style:normal}.how-steps article>span{color:var(--rust);font-size:28px}
.success-mark{background:var(--soft);color:var(--rust)}
footer{color:var(--muted);padding-top:28px}.footer-brand{font-size:28px;color:var(--ink)}.footer-brand span{color:var(--muted)}
dialog::backdrop{background:#221b12c9}
@media(max-width:1100px){.site-header:after{left:30px}.brand-art{width:270px}}
@media(max-width:820px){.hero{padding:42px 0 38px}.hero-copy{display:block;max-width:640px}.hero h1{margin:22px 0 23px;font-size:65px;letter-spacing:-1.8px}.section-heading h2{font-size:30px}.brand-art{width:255px;gap:10px}.brand-symbol{width:54px}.site-header{height:96px}.brand-program{font-size:7px;letter-spacing:2px;margin-left:64px}}
@media(max-width:600px){.site-header{height:85px;gap:12px}.site-header:after{left:20px}.brand-art{width:224px;gap:8px}.brand-symbol{width:46px}.brand-program{font-size:6px;letter-spacing:1.8px;margin-left:54px}.nav-cta{font-size:9px;border:0;padding:0;gap:5px}.hero{padding:36px 0 34px}.hero-copy .eyebrow{font-size:7px;letter-spacing:1.2px}.hero h1{font-size:clamp(45px,12vw,64px);letter-spacing:-1.1px;line-height:1.05;margin:16px 0 19px}.hero-copy>.hero-tagline{font-size:16px;max-width:340px}.hero-copy>.hero-description{font-size:12px;line-height:1.8;margin-top:11px;max-width:340px}.hero-actions{margin-top:21px;gap:22px}.hero-actions .primary-button{font-size:11px;padding:13px 16px}.hero-how{font-size:10px}.explore-section{padding-top:26px}.section-heading h2{font-size:29px}.map-legend{gap:9px;font-size:7px;padding:7px 9px;max-width:calc(100% - 25px)}.map-hint{bottom:59px}.how-heading h2{font-size:34px}.how-section{margin-top:32px}.application-context>h2{font-size:35px}.form-card>h2{font-size:31px}}
@media(max-width:360px){.brand-art{width:184px;gap:7px}.brand-symbol{width:38px}.brand-program{font-size:5px;letter-spacing:1.4px;margin-left:45px}.hero h1{font-size:43px}}

button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline-color:var(--rust)}.search-wrap:focus-within{outline-color:var(--rust)}.progress{color:#756a5d}.city-row.unavailable .city-name{color:#756c60}.city-row .row-icon{background:#f2eee5}.territory-panel{border-right-color:var(--line)}

/* Comfortable reading sizes on larger screens as well as phones. */
.hero-copy>.hero-description,.how-heading p,.how-steps p,
.application-context>p,.form-description,.review-intro,.success-section p{font-size:16px;line-height:1.7}
.how-steps h3{font-size:18px;line-height:1.4}
.form-grid label{font-size:14px;line-height:1.5;gap:8px}
.form-grid input,.form-grid select,.form-grid textarea{font-size:16px;line-height:1.5;min-height:48px}
.form-grid label small{font-size:13px;line-height:1.6}
.field-section{font-size:17px;line-height:1.5}
.consent{font-size:14px;line-height:1.7}
.consent input{width:20px;height:20px}
.form-security{font-size:13px;line-height:1.6}
.review-summary>div{font-size:15px;line-height:1.6}
.form-error{font-size:15px;line-height:1.6}
.primary-button,.secondary-button,.popup-apply{font-size:15px;min-height:44px}
.city-row .city-name{font-size:14px}
.city-row .city-province{font-size:12px}
.search-wrap input,.province-controls select{font-size:16px}
.province-controls label,.province-select-button{font-size:14px}
.province-controls p{font-size:13px}
dialog p{font-size:16px;line-height:1.7}

/* Readable phone and tablet layouts, including the form and map controls. */
@media (max-width:820px){
  body{font-size:16px;line-height:1.6}
  .brand-program{font-size:11px;letter-spacing:1px}
  .eyebrow,.hero-copy .eyebrow,.section-heading .eyebrow,
  .how-heading .eyebrow,.application-context>.eyebrow,
  .selected-territory .eyebrow,.chosen-city-card .eyebrow,
  .form-top .eyebrow,.success-section .eyebrow{font-size:12px;letter-spacing:1px;line-height:1.6}
  .hero-copy>.hero-tagline{font-size:20px;line-height:1.5;max-width:560px}
  .hero-copy>.hero-description{font-size:16px;line-height:1.7;max-width:560px}
  .hero-actions{gap:12px 24px}
  .primary-button,.hero-actions .primary-button,.secondary-button,
  .review-actions .secondary-button{font-size:16px;min-height:48px;padding:12px 18px}
  .hero-how{font-size:15px;min-height:44px;display:inline-flex;align-items:center}
  .nav-cta{font-size:14px;min-height:44px}

  .explorer{display:flex;flex-direction:column}
  .map-panel{order:1}
  #map{height:500px}
  .territory-panel{order:2;height:auto;border-right:0;border-bottom:1px solid var(--line)}
  .panel-intro{display:none}
  .search-wrap{margin:16px 16px 0;padding:10px 12px;min-height:48px}
  .search-wrap input{font-size:16px;min-height:26px}
  .search-wrap kbd{display:none}
  .list-controls{padding:8px 16px;gap:8px 16px;flex-wrap:wrap}
  .list-controls select{font-size:16px;min-height:44px;max-width:100%;min-width:0;flex:1}
  .available-filter{font-size:14px;gap:8px;min-height:44px}
  .available-filter input{width:20px;height:20px;margin:0}
  .province-controls{margin:0 16px;padding:14px 0;gap:8px}
  .province-controls label{font-size:15px;font-weight:600}
  .province-controls select{font-size:16px;min-height:48px;padding:10px 12px}
  .province-select-button{font-size:15px;min-height:48px;padding:10px 12px}
  .province-controls p{font-size:14px;line-height:1.6}
  .list-caption{padding:12px 18px;gap:10px;font-size:12px;flex-wrap:wrap}
  .list-caption span:first-child{font-size:14px}
  .city-list{height:300px;flex:none}
  .city-row{padding:4px 10px;gap:12px}
  .city-row>input{width:22px;height:22px}
  .city-pick{min-height:60px;padding:10px 0}
  .city-row .city-name{font-size:16px;line-height:1.45}
  .city-row .city-province{font-size:14px;line-height:1.45}
  .list-empty{font-size:16px}
  .panel-bottom{font-size:14px;padding:12px 18px;align-items:flex-start}
  .panel-bottom .text-button{font-size:14px;min-height:44px;line-height:1.5;text-align:left}

  .map-tabs{max-width:none;flex-wrap:wrap}
  .map-tabs button{font-size:13px;min-height:44px;padding:8px 10px}
  .reset-map{width:44px;height:44px;flex-shrink:0}
  .map-legend{font-size:12px;line-height:1.5;gap:6px 12px;padding:8px 10px;left:12px;bottom:20px;max-width:calc(100% - 24px)}
  .map-legend .legend-dot{width:8px;height:8px;flex-shrink:0}
  .map-hint{font-size:12px;line-height:1.5;bottom:100px;left:12px;transform:none;padding:8px 10px;max-width:calc(100% - 80px)}
  .leaflet-control-zoom{margin:0 12px 100px 0!important}
  .leaflet-control-zoom a{width:44px!important;height:44px!important;line-height:44px!important;font-size:24px!important}
  .leaflet-control-attribution{font-size:11px!important}
  .map-city-label,.island-label{font-size:12px}
  .map-loading,.map-error{font-size:16px}
  .map-error{inset:120px 16px auto}
  .hover-name{font-size:16px}
  .hover-question{font-size:14px}
  .leaflet-popup-content{width:min(260px,calc(100vw - 100px))!important;margin:18px}
  .territory-popup .popup-region{font-size:12px;line-height:1.5}
  .territory-popup h3{font-size:28px;line-height:1.2}
  .territory-popup p{font-size:15px;line-height:1.6}
  .availability-pill{font-size:13px;line-height:1.5}
  .popup-apply{font-size:15px;min-height:48px}
  .leaflet-container a.leaflet-popup-close-button{width:44px;height:44px;line-height:44px;font-size:26px}

  .explorer-bottom{font-size:13px;line-height:1.6}
  .explorer-bottom p{flex-wrap:wrap;gap:6px}
  .preview-notice{font-size:14px;line-height:1.6;align-items:flex-start;flex-wrap:wrap}
  .preview-tag{font-size:12px}
  .selected-territory{padding:20px}
  .selected-territory h3{font-size:30px}
  .selected-territory p,.selected-territory .coverage-summary p,
  .selected-territory .selection-warning{font-size:15px;line-height:1.6}
  .selection-heading{flex-direction:column;align-items:stretch;gap:16px}
  .selection-actions{width:100%;flex-direction:row;flex-wrap:wrap;align-items:center;gap:12px}
  .selection-actions .primary-button{flex:1;min-width:0}
  .selection-actions .text-button{font-size:15px;min-height:44px}
  .selection-details,.chosen-area-details{font-size:15px}
  .selection-details summary,.chosen-area-details summary{min-height:44px;padding:10px 0}
  .selection-chips button{font-size:14px;min-height:44px;padding:8px 10px}
  .chosen-area-list{font-size:15px;line-height:1.6}
  .chosen-area-list span{font-size:14px}

  .how-heading p,.how-steps p,.application-context>p,
  .form-description,.review-intro,.success-section p{font-size:16px;line-height:1.7}
  .how-steps h3{font-size:18px;line-height:1.4}
  .how-steps article{padding:20px 0}
  .how-steps article>span{font-size:28px}
  .back-button{font-size:16px;min-height:44px;line-height:1.5}
  .chosen-city-card p{font-size:15px;line-height:1.6}
  .chosen-city-card .text-button{font-size:15px;min-height:44px;margin-top:12px}
  .form-top{flex-wrap:wrap;align-items:center;gap:8px 16px}
  .form-time{font-size:13px}
  .form-grid{grid-template-columns:1fr;gap:20px}
  .form-grid label{font-size:16px;line-height:1.5;gap:8px}
  .form-grid input,.form-grid select,.form-grid textarea{font-size:16px;line-height:1.5;min-height:48px;padding:12px}
  .form-grid label small{font-size:14px;line-height:1.6}
  .field-section{font-size:18px;line-height:1.5;padding:26px 0 16px}
  .field-section span{font-size:14px;color:var(--muted)}
  .consent{font-size:15px;line-height:1.7;gap:12px;margin:26px 0}
  .consent input{width:22px;height:22px;margin-top:3px}
  .form-security{font-size:13px;line-height:1.6;align-items:flex-start;text-align:left;gap:8px}
  .form-security>.icon{width:16px;height:16px;flex-shrink:0;margin-top:2px}
  .review-summary>div{display:block;font-size:16px;line-height:1.6;padding:16px 0}
  .review-summary dt{font-size:14px;font-weight:600;margin-bottom:6px}
  .review-summary dd{margin:0}
  .review-actions{flex-wrap:wrap}
  .form-error{font-size:15px;line-height:1.6}
  .success-reference{font-size:14px;line-height:1.6}

  footer,.footer-brand span{font-size:14px;line-height:1.6}
  footer .text-button{font-size:15px;min-height:44px}
  .map-credit{font-size:12px;line-height:1.6}
  dialog p{font-size:16px;line-height:1.7}
  .dialog-close{width:44px;height:44px;line-height:44px;top:8px;right:8px}
}

@media (max-width:600px){
  .site-header{height:auto;min-height:0;flex-direction:column;align-items:stretch;gap:14px;padding-top:18px;padding-bottom:16px}
  .brand{align-self:flex-start;gap:5px}
  .brand-art{width:244px;gap:10px}
  .brand-symbol{width:50px}
  .brand-program{font-size:11px;letter-spacing:1px;margin-left:60px}
  .site-header nav{display:flex;width:100%}
  .site-header .nav-cta{width:100%;justify-content:space-between;font-size:15px;min-height:44px;padding:9px 12px;border:1px solid var(--line)}
  .hero-copy .eyebrow{font-size:11px;letter-spacing:.8px}
  #map{height:480px}
  .map-top{gap:8px}
  .map-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));flex:1;max-width:380px;gap:2px}
  .map-tabs button{font-size:13px;white-space:normal;padding:8px 6px}
  .city-list{height:280px}
  .form-card{padding:24px 18px}
  .review-actions>*{width:100%}
  .review-actions .primary-button{min-width:0}
}
