@font-face{font-family:Frutiger;src:url('../assets/Frutiger.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Frutiger;src:url('../assets/Frutiger_bold.ttf') format('truetype');font-weight:600 900;font-display:swap}
:root{font-family:Frutiger,Arial,sans-serif;color:#283b32;background:#f3f1e9;--green:#35634b;--border:#cdd2c7;--paper:#fffef9;--header-h:72px;--group-h:74px;--rail-w:94px;--timeline-zoom:.27}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#f3f1e9}button,summary{font:inherit}a,button,summary{-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}
.app-shell{height:100dvh;display:grid;grid-template-rows:auto minmax(0,1fr)}
.toolbar{height:var(--header-h);display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 18px;border-bottom:1px solid var(--border);background:#f8f6ef;z-index:60}.title-block{display:flex;align-items:center;gap:14px;min-width:0}.title-copy{min-width:0}.title-copy h1,.title-copy p{margin:0}.title-copy h1{font-size:18px;font-weight:600;line-height:1.15}.title-copy p{margin-top:3px;color:#747d74;font-size:11px}.portal-back{text-decoration:none;color:var(--green);font-size:12px;font-weight:600;white-space:nowrap}.toolbar-actions{display:flex;align-items:center;gap:7px}.control-button{min-height:31px;padding:5px 10px;border:1px solid var(--border);border-radius:5px;background:var(--paper);color:#283b32;cursor:pointer;font-size:11px}.control-button:hover{border-color:var(--green)}.control-button[aria-pressed="true"]{background:#e8eee7;border-color:#78917d;color:#264a37}.zoom-controls{display:flex;align-items:center;border:1px solid var(--border);border-radius:5px;background:var(--paper);overflow:hidden}.zoom-controls .control-button{border:0;border-radius:0;min-width:30px}.zoom-controls .control-button+.control-button{border-left:1px solid var(--border)}#zoomValue{min-width:50px;font-variant-numeric:tabular-nums;font-weight:600}button:focus-visible,a:focus-visible,summary:focus-visible,.timeline-scroller:focus-visible{outline:2px solid #bb7542;outline-offset:2px}.about{position:relative}.about summary{list-style:none;width:31px;padding:5px;text-align:center;font-weight:700}.about summary::-webkit-details-marker{display:none}.about-panel{position:absolute;right:0;top:39px;width:330px;padding:11px 15px;border:1px solid var(--border);border-radius:6px;background:var(--paper);box-shadow:0 10px 28px #26382c1f;font-size:12px;line-height:1.45;z-index:100}.about-panel p{margin:0 0 9px}.about-panel p:last-child{margin:0}
.timeline-shell{min-height:0;display:grid;grid-template-columns:var(--rail-w) minmax(0,1fr);position:relative}.year-rail{min-height:0;border-right:1px solid #aeb7aa;background:#ebe9e2;z-index:45;display:grid;grid-template-rows:var(--group-h) minmax(0,1fr);overflow:hidden}.year-head{height:var(--group-h);display:flex;align-items:end;justify-content:flex-end;padding:0 13px 12px;border-bottom:1px solid var(--border);color:#778078;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;position:relative;z-index:5;background:#ebe9e2}.year-rail-track{position:relative;overflow:hidden;will-change:transform;z-index:1}.year-label{position:absolute;right:13px;transform:translateY(-50%);font-size:11px;font-weight:600;color:#506056}.year-label.major{font-size:13px;color:#283b32}.year-notch{position:absolute;right:0;width:6px;height:1px;background:#aab0a7}.year-notch.major{width:12px;background:#7f897f}
.timeline-panel{min-width:0;min-height:0;display:grid;grid-template-rows:var(--group-h) minmax(0,1fr)}.group-header-viewport{overflow:hidden;border-bottom:1px solid var(--border);background:#f3f1e9;z-index:44}.group-headers{position:relative;height:100%;will-change:transform}.group-header{position:absolute;top:0;height:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;padding:0 10px 9px;border-left:1px solid var(--border);background:#f3f1e9;overflow:hidden}.group-header:nth-child(even){background:#eceee8}.group-header.group-divider{border-left:3px solid #68786d}.group-clause{font-size:13px;font-weight:700;line-height:1.05;color:#365f49;white-space:nowrap}.group-name{margin-top:3px;font-size:10px;color:#58665d;white-space:nowrap}.group-count{display:none}
.timeline-scroller{min-height:0;min-width:0;overflow:auto;position:relative;scrollbar-width:none;overscroll-behavior:contain;background:#f7f5ef}.timeline-scroller::-webkit-scrollbar{width:0;height:0}.timeline-world{position:relative;min-height:100%;isolation:isolate}.grid-layer,.zone-layer,.connector-layer{position:absolute;inset:0}.grid-layer{z-index:0;pointer-events:none}.group-column{position:absolute;top:0;height:100%;border-left:1px solid #cfd4caaa;border-right:1px solid #cfd4ca66}.group-column:nth-child(even){background:#e5e9e14d}.group-column.group-divider{border-left:3px solid #68786d;box-shadow:-8px 0 0 #f3f1e9}.year-line{position:absolute;left:0;width:100%;height:1px;background:#d8dad4}.year-line.major{background:#aeb5ab}.latest-line{position:absolute;left:0;width:100%;height:1px;background:#9b6b48;opacity:.45}
.zone-bar{position:absolute;min-height:12px;border:1px solid #92a490;border-radius:2px;background:#fffef9;z-index:5;cursor:default;display:block;overflow:visible;transition:border-color .12s,background .12s}.zone-bar.current{border-color:#537b60;background:#edf3e9}.zone-bar.superseded{border-color:#a9aca4;background:#f4f3ee}.zone-bar:hover,.zone-bar.is-hovered{border-color:#b27343;background:#fff9f2;z-index:20}.zone-label{position:sticky;top:4px;display:flex;flex-direction:column;gap:1px;width:calc(100% - 4px);margin:2px;padding:2px 3px;border-radius:2px;background:color-mix(in srgb,#fffef9 90%,transparent);line-height:1.05;z-index:2;overflow:hidden}.zone-bar.current .zone-label{background:color-mix(in srgb,#edf3e9 93%,transparent)}.zone-bar.superseded .zone-label{background:color-mix(in srgb,#f4f3ee 93%,transparent)}.zone-bar:hover .zone-label{background:#fff9f2}.zone-code{display:block;font-size:clamp(8px,calc(13px * var(--timeline-zoom)),13px);font-weight:800;letter-spacing:.01em;color:#2f5d46;white-space:nowrap}.zone-name-inline{display:block;font-size:clamp(5.5px,calc(9px * var(--timeline-zoom)),9px);font-weight:600;color:#45544a;white-space:normal;overflow-wrap:anywhere}.zone-meta-inline{display:block;font-size:clamp(5px,calc(8px * var(--timeline-zoom)),8px);color:#7a827a;white-space:normal;overflow-wrap:anywhere}.zone-years-inline{display:block;font-size:clamp(5px,calc(8px * var(--timeline-zoom)),8px);color:#7a827a;white-space:nowrap}.connector-layer{z-index:3;overflow:visible;pointer-events:none}.connector{fill:none;stroke:#7c9580;stroke-width:1.1;opacity:.58;vector-effect:non-scaling-stroke}
.zone-tooltip{position:fixed;z-index:200;width:310px;max-width:calc(100vw - 24px);padding:12px 13px;border:1px solid #aeb7aa;border-radius:6px;background:#fffef9;box-shadow:0 9px 30px #26382c26;pointer-events:none;font-size:11px;line-height:1.42}.tooltip-top{display:flex;align-items:start;gap:9px;margin-bottom:7px}.tooltip-code{min-width:45px;font-size:20px;font-weight:700;color:var(--green)}.tooltip-name{font-size:13px;font-weight:600}.tooltip-meta{margin-top:2px;color:#777f76;font-size:10px}.tooltip-description{margin:8px 0 0;color:#344039}.tooltip-rel{margin-top:8px;padding-top:7px;border-top:1px solid #dde0d8;color:#5c685e}.tooltip-source{margin-top:7px;color:#899087;font-size:9px}.notice{position:fixed;right:22px;bottom:22px;z-index:150;padding:10px 12px;border:1px solid var(--border);border-radius:5px;background:var(--paper);font-size:12px}
@media(max-width:900px){.toolbar{height:auto;min-height:var(--header-h);flex-wrap:wrap}.toolbar-actions{margin-left:auto;flex-wrap:wrap;justify-content:flex-end}.group-count{display:none}}
@media(max-width:720px){:root{--header-h:96px;--rail-w:64px;--group-h:58px}.toolbar{padding:8px 9px;align-items:flex-start}.title-block{display:grid;gap:3px}.title-copy h1{font-size:15px}.title-copy p{font-size:9px}.portal-back{font-size:10px}.group-clause{font-size:16px}.group-name{font-size:8px}.year-label.major{font-size:11px}.about-panel{position:fixed;top:95px;right:10px;left:10px;width:auto}.zone-tooltip{width:280px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* VPP clause links */
.group-link{display:flex;flex-direction:column;align-items:flex-start;text-decoration:none;color:inherit;max-width:100%}.group-link:hover .group-clause,.group-link:focus-visible .group-clause{text-decoration:underline;text-underline-offset:2px}.group-link:focus-visible{outline:1px solid #bb7542;outline-offset:2px;border-radius:2px}.zone-code-link{display:block;width:max-content;max-width:100%;text-decoration:none;color:inherit;pointer-events:auto}.zone-code-link:hover .zone-code,.zone-code-link:focus-visible .zone-code{text-decoration:underline;text-underline-offset:2px}.zone-code-link:focus-visible{outline:1px solid #bb7542;outline-offset:1px;border-radius:1px}

/* Planning-scheme picker */
.scheme-picker{position:relative;width:210px;flex:0 0 210px;z-index:120}
.scheme-input{width:100%;height:31px;padding:5px 28px 5px 9px;border:1px solid var(--border);border-radius:5px;background:var(--paper);color:#283b32;font:inherit;font-size:11px;outline:0;text-overflow:ellipsis}
.scheme-input:hover,.scheme-input:focus{border-color:var(--green)}
.scheme-picker::after{content:'⌄';position:absolute;right:9px;top:5px;color:#657168;font-size:14px;pointer-events:none}
.scheme-dropdown{position:absolute;top:36px;left:0;width:280px;max-width:min(360px,calc(100vw - 20px));max-height:390px;border:1px solid #aeb7aa;border-radius:6px;background:#fffef9;box-shadow:0 10px 28px #26382c24;overflow:hidden;z-index:180}
.scheme-option{display:block;width:100%;border:0;border-bottom:1px solid #eceee8;background:#fffef9;color:#334138;text-align:left;padding:7px 10px;font:inherit;font-size:11px;line-height:1.2;cursor:pointer}
.scheme-option:hover,.scheme-option:focus-visible{background:#edf3e9;outline:0}
.scheme-option[aria-selected="true"]{color:#28513b;font-weight:700;background:#f1f5ee}
.scheme-option-pinned{position:sticky;top:0;z-index:2;display:flex;align-items:baseline;justify-content:space-between;gap:10px;border-bottom:2px solid #8fa092;background:#f4f6f1;font-weight:700}
.scheme-option-pinned small{font-size:9px;color:#738078;font-weight:600}
.scheme-results{max-height:335px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.scheme-empty{padding:10px;color:#818981;font-size:10px}
.scheme-open{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;white-space:nowrap}

/* Keep link feedback clear of the lines immediately below the code. */
.zone-label{gap:2px}
.zone-code{line-height:1.14}
.zone-code-link{line-height:1.14;padding-bottom:1px;margin-bottom:1px}
.zone-code-link:hover .zone-code,.zone-code-link:focus-visible .zone-code{text-decoration-line:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.group-link:hover .group-clause,.group-link:focus-visible .group-clause{text-decoration-thickness:1px;text-underline-offset:3px}

@media(max-width:1100px){.scheme-picker{width:180px;flex-basis:180px}.scheme-dropdown{width:260px}}
@media(max-width:720px){.scheme-picker{width:165px;flex-basis:165px}.scheme-open{padding-inline:8px}.scheme-dropdown{position:fixed;top:92px;left:8px;width:min(310px,calc(100vw - 16px));max-width:none}}

/* v9 toolbar: heading | planning schemes | controls */
.toolbar{
  display:grid;
  grid-template-columns:minmax(280px,1fr) auto minmax(280px,1fr);
  align-items:center;
  justify-content:initial;
}
.title-block{justify-self:start}
.scheme-toolbar{justify-self:center;display:flex;align-items:center;gap:6px;min-width:0;z-index:120}
.toolbar-actions{justify-self:end}

.scheme-picker{width:232px;flex:none}
.scheme-field{display:grid;grid-template-columns:minmax(0,1fr) 31px;height:31px;border:1px solid var(--border);border-radius:5px;background:var(--paper);overflow:hidden}
.scheme-field:focus-within{border-color:var(--green)}
.scheme-input{height:29px;border:0;border-radius:0;padding:5px 8px;background:transparent;cursor:text;min-width:0}
.scheme-input:hover,.scheme-input:focus{border-color:transparent;outline:0}
.scheme-picker::after{content:none}
.scheme-toggle{width:31px;height:29px;padding:0;border:0;border-left:1px solid var(--border);background:#f7f6f0;color:#4f5e54;display:grid;place-items:center;cursor:pointer}
.scheme-toggle:hover,.scheme-toggle[aria-expanded="true"]{background:#edf3e9;color:#28513b}
.scheme-toggle svg{width:11px;height:7px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.scheme-toggle:focus-visible{outline:2px solid #bb7542;outline-offset:-2px}
.scheme-dropdown{top:36px;width:290px}
.scheme-open-icon{width:31px;height:31px;flex:0 0 31px;display:grid;place-items:center;border:1px solid var(--border);border-radius:5px;background:var(--paper);color:#35483d;text-decoration:none;cursor:pointer}
.scheme-open-icon:hover{border-color:var(--green);background:#edf3e9;color:#28513b}
.scheme-open-icon svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}

@media(max-width:1100px){
  .toolbar{grid-template-columns:minmax(220px,1fr) auto minmax(220px,1fr)}
  .scheme-picker{width:200px}
}
@media(max-width:900px){
  .toolbar{display:grid;grid-template-columns:1fr auto;grid-template-areas:'title actions' 'scheme scheme';height:auto;row-gap:7px}
  .title-block{grid-area:title}
  .toolbar-actions{grid-area:actions}
  .scheme-toolbar{grid-area:scheme;justify-self:center}
}
@media(max-width:720px){
  .toolbar{grid-template-columns:1fr;grid-template-areas:'title' 'scheme' 'actions';align-items:center}
  .title-block{justify-self:start}
  .scheme-toolbar{justify-self:center}
  .toolbar-actions{justify-self:center;margin-left:0;justify-content:center}
  .scheme-picker{width:min(230px,calc(100vw - 96px));flex:none}
  .scheme-dropdown{position:fixed;top:124px;left:50%;transform:translateX(-50%);width:min(310px,calc(100vw - 16px));max-width:none}
}

.control-button:disabled{cursor:default;opacity:.62;background:#f1f1ec;border-color:#d8d9d2;color:#6f766f}.control-button:disabled:hover{border-color:#d8d9d2}
