:root{font:16px/1.5 system-ui,sans-serif;color:#163d35;background:#f3f6f1}
body[data-page="customer"] { margin: 0; min-height: 100vh; background: #f7f6f1; color: #183d38; }
body[data-page="customer"] main { max-width: 43rem; padding: 0 clamp(.85rem,4vw,2rem) 3rem; }
[data-page="customer"] nav { align-items: center; gap: .45rem; }
[data-page="customer"] nav a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 650; text-underline-offset: .2em; }
[data-page="customer"] nav label { display: flex; align-items: center; gap: .5rem; margin: 0; font-size: .9rem; }
[data-page="customer"] nav select { width: auto; }
.account-heading { padding: clamp(1.25rem,5vw,2.3rem); border-radius: 1.1rem; background: #143e39; color: #fff; }
.account-heading > span { font-size: .73rem; letter-spacing: .13em; font-weight: 750; color: #d5eccd; }
.account-heading h1 { margin: .45rem 0 .65rem; line-height: 1.08; letter-spacing: -.035em; }
.account-heading p { margin: 0; max-width: 50ch; color: #dbebe6; }
[data-page="customer"] details { margin: .65rem 0; border: 1px solid #c7d7cc; border-radius: .85rem; background: #fff; }
[data-page="customer"] details[open] { border-color: #82a798; }
[data-page="customer"] details > div { padding: 0 clamp(1rem,4vw,1.5rem) 1.25rem; }
[data-page="customer"] details p { margin: 0 0 .85rem; color: #455e57; }
[data-page="customer"] summary { display: flex; justify-content: space-between; align-items: center; gap: .7rem; padding: 1rem clamp(1rem,4vw,1.5rem); font-weight: 700; cursor: pointer; border-radius: .85rem; }
[data-page="customer"] summary::-webkit-details-marker { display: none; }
[data-page="customer"] summary::after { content: ""; width: .5rem; height: .5rem; margin-right: .2rem; flex: none; border: solid #256454; border-width: 0 2px 2px 0; transform: rotate(45deg); }
[data-page="customer"] details[open] > summary::after { transform: rotate(225deg); }
[data-page="customer"] :is(input,select,button) { min-height: 46px; border-radius: .55rem; font-size: 1rem; }
[data-page="customer"] input { width: 100%; max-width: none; margin-top: .2rem; border-color: #86a498; background: #fff; }
[data-page="customer"] button { border-color: #125345; font-weight: 680; }
[data-page="customer"] :focus-visible { outline: 3px solid #af630e; outline-offset: 2px; }
[data-page="customer"] #info { scroll-margin-block: .6rem; }
[data-page="customer"] #info[data-error]:not(:empty) { background: #fff0e9; border-color: #ab482d; color: #783322; }
[data-page="customer"] #orders .row > span { overflow-wrap: anywhere; }
@media(max-width:34rem) {
  [data-page="customer"] form button { width: 100%; }
  [data-page="customer"] nav label > span { position: absolute; height: 1px; width: 1px; clip-path: inset(50%); overflow: hidden; }
}
*{box-sizing:border-box}main{max-width:54rem;margin:auto;padding:1rem}nav{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:1rem 0}section,article{background:white;border:1px solid #cedbd5;border-radius:.8rem;padding:1.25rem;margin:1rem 0}h1,h2,h3{line-height:1.2}h1{font-size:clamp(2rem,6vw,3rem)}h2{margin-top:0}label{display:block;font-weight:600;margin:.6rem 0}input,select,textarea,button{font:inherit;padding:.6rem .85rem;border:1px solid #83a595;border-radius:.35rem}input,textarea,select{display:block;width:100%;max-width:38rem}button{background:#125345;color:white;cursor:pointer;margin:.25rem 0}button:disabled{opacity:.55}a{color:#0d5b49}pre{white-space:pre-wrap;overflow-wrap:anywhere}.row{display:flex;align-items:center;gap:.7rem;justify-content:space-between;padding:.6rem 0;border-bottom:1px solid #dde4df;flex-wrap:wrap}#info:not(:empty){padding:.75rem 1rem;background:#e2f1e5;border-left:4px solid #257358}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #bf740f;outline-offset:2px}[hidden]{display:none!important}