:root{color-scheme:dark;--navy:#091725;--surface:#192f46;--edge:#36516a;--gold:#d7b777;--text:#f4f6fa;--muted:#a8bacb;--teal:#8ccac4}
*{box-sizing:border-box}
body{min-height:100svh;margin:0;background-repeat:no-repeat;background:radial-gradient(ellipse at 50% 0,#18334755,transparent 580px),var(--navy);color:var(--text);font:15px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
.shell{max-width:480px;margin:auto;padding:28px 20px 56px}
.brand{display:block;width:min(100%,390px);height:auto;margin:3px auto 24px;filter:drop-shadow(0 4px 16px #0003)}
.place{text-align:center;color:var(--muted);font-size:12px;margin:-14px 0 24px;letter-spacing:.03em}
button,a,summary{-webkit-tap-highlight-color:transparent}
button{font:inherit}
.bar,.tile,.accordion,.pay{border:1px solid var(--edge);border-radius:16px;background:linear-gradient(135deg,#203a54,var(--surface));box-shadow:inset 0 1px 0 #ffffff07,0 4px 14px #0000000d}
.bar{display:flex;align-items:center;gap:12px;width:100%;padding:19px 18px;color:var(--text);text-decoration:none;margin:11px 0;font-size:16px;font-weight:700;cursor:pointer}
.bar.gold{background:linear-gradient(115deg,#e0c692,#c8a566);color:#102335;border-color:#e5cb97;box-shadow:0 5px 22px #d7b77716,inset 0 1px 0 #fff3}
.icon{display:inline-flex;align-items:center;justify-content:center;color:var(--gold);flex:none}
.icon svg{width:26px;height:26px}
.bar.gold .icon{color:#203548}
.arrow{margin-left:auto;color:inherit;font-size:23px;font-weight:400}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:15px 0}
.tile{appearance:none;min-height:108px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--text);text-decoration:none;font-size:15px;font-weight:650;cursor:pointer;padding:16px 8px}
.tile .icon svg{width:28px;height:28px}
.customer .tile:nth-child(2) .icon,.customer .tile:nth-child(3) .icon{color:var(--teal)}
.section{font-size:18px;font-weight:750;margin:28px 0 13px;letter-spacing:-.015em}
.accordion{margin-top:19px;overflow:hidden}
.accordion summary{cursor:pointer;list-style:none;padding:20px;color:var(--text);font-weight:700;display:flex;align-items:center;justify-content:space-between;gap:12px}
.accordion summary::-webkit-details-marker{display:none}
.accordion summary:after{content:'';width:7px;height:7px;border-right:1.5px solid var(--gold);border-bottom:1.5px solid var(--gold);transform:rotate(45deg);margin-right:3px}
.accordion[open] summary:after{transform:rotate(225deg)}
.body{border-top:1px solid var(--edge);padding:12px 19px 18px;color:#d6e2ed}
.body h3{font-size:14px;color:var(--gold);margin:18px 0 10px;line-height:1.5}
.body ul{margin:0;padding-left:20px;line-height:1.85;font-size:14px}
.body li::marker{color:var(--teal)}
.body p{font-size:13px}
.small{color:var(--muted);font-size:12px;line-height:1.7}
.pay{display:flex;justify-content:space-between;gap:16px;align-items:center;width:100%;padding:18px;margin-bottom:10px;color:var(--text);text-align:left;text-decoration:none;font-weight:650}
.pay small{display:block;color:var(--muted);font-size:12px;font-weight:400;margin-top:3px}
.pay>span:last-child{color:var(--gold);white-space:nowrap;font-size:14px}
.notice{background:#142b3d;border:1px solid #84c8c219;border-left:2px solid #84c8c27a;padding:12px 14px;border-radius:10px;font-size:12px;color:#c1d1df;margin-top:17px}
.hdr{text-align:center;font-size:24px;letter-spacing:-.025em;margin:6px 0 4px}
.sub{text-align:center;font-size:12px;color:var(--muted);margin:0 0 24px}
.dashboard{padding-top:48px}
.dashboard .brand{margin-bottom:26px}
.dialog{position:fixed;inset:0;background:#020c17db;backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:20px;z-index:2}
.dialog[hidden]{display:none}
.dialogbox{width:min(100%,400px);max-height:calc(100dvh - 40px);overflow:auto;overscroll-behavior:contain;background:linear-gradient(145deg,#203a54,#14283d);border:1px solid #506881;padding:24px;border-radius:20px;text-align:center;box-shadow:0 25px 90px #0007}
.dialogbox h2{font-size:21px;margin:14px 0}
.dialogbox p{font-size:14px;color:#c3d1e0}
.qr{display:block;width:min(90%,270px);height:auto;margin:18px auto;border-radius:12px;background:#fff;padding:12px}
.action{display:inline-flex;align-items:center;justify-content:center;min-height:44px;background:var(--gold);color:var(--navy);border:1px solid transparent;padding:10px 15px;margin:6px;border-radius:10px;text-decoration:none;font-size:14px;font-weight:700;cursor:pointer}
.close{background:#ffffff09;border:1px solid #ffffff1a;border-radius:50%;color:white;font-size:26px;line-height:1;float:right;cursor:pointer;width:44px;height:44px}
.bar,.pay{overflow-wrap:anywhere}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #edce94;outline-offset:4px}
a:active,button:active{filter:brightness(.92)}
@media(hover:hover){.bar:hover,.tile:hover,.pay:hover{border-color:#a1b7c7;filter:brightness(1.08)}
.gold:hover{border-color:#f6dfb0}
.action:hover{filter:brightness(1.08)}
}
@media(prefers-reduced-motion:no-preference){a,button{transition:filter .18s,border-color .18s,transform .18s}
.tile:active{transform:scale(.98)}
}
@media(max-width:350px){.shell{padding-inline:16px}
.bar{font-size:14px;gap:9px;padding-inline:14px}
.body{padding-inline:14px}
}


.external-icon{width:18px;height:18px;vertical-align:-3px;flex:none}
.arrow{display:inline-flex}
.arrow .external-icon{width:21px;height:21px}


.keep-card{border-top:1px solid var(--edge);margin-top:28px;padding-top:2px}.keep-card .section{margin-top:22px}.keep-actions{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.keep-actions .action{margin:0}.action.secondary{background:transparent;border-color:var(--edge);color:var(--text)}.save-dialog{background:#172e43;color:var(--text);border:1px solid #506881;border-radius:20px;padding:24px;width:min(400px,calc(100% - 32px));max-height:calc(100dvh - 40px);overflow:auto;box-shadow:0 20px 90px #0008}.save-dialog::backdrop{background:#020c17da;backdrop-filter:blur(6px)}.save-dialog h2{font-size:21px;line-height:1.4}.save-dialog h3{color:var(--gold);font-size:15px;margin:24px 0 8px}.save-dialog p{color:#c3d1e0;font-size:14px}.save-dialog .close{margin-left:12px}

.quick-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:0 0 18px}.quick-nav a{color:var(--text);border:1px solid var(--edge);border-radius:10px;padding:10px 12px;text-decoration:none;font-size:13px;min-height:44px}.invoice-card{border:1px solid var(--gold);border-radius:16px;background:linear-gradient(135deg,#203a54,var(--surface));padding:18px;margin-bottom:12px}.invoice-card h3{color:var(--gold);margin:0 0 10px;font-size:17px}.invoice-card p{font-size:14px}.invoice-card .small{font-size:12px}.invoice-card .action{margin-left:0}.back-top{display:block;color:var(--gold);text-align:center;padding:18px;margin-top:16px}[id]{scroll-margin-top:18px}

.invoice-request{margin-bottom:10px}.invoice-request summary{cursor:pointer;list-style:none}.invoice-request summary::-webkit-details-marker{display:none}.invoice-request[open] summary{border-color:var(--gold)}.invoice-fields{border:1px solid var(--edge);border-radius:16px;padding:18px;margin-top:-2px;background:var(--surface)}.invoice-fields>p{font-size:14px;margin-top:0}.invoice-fields label{display:block;font-size:14px;font-weight:650;margin:14px 0 6px}.invoice-fields input,.invoice-fields textarea{display:block;width:100%;font:inherit;font-size:16px;padding:12px;border:1px solid var(--edge);border-radius:8px;background:var(--navy);color:var(--text)}.invoice-fields textarea{resize:vertical}.invoice-fields input:focus-visible,.invoice-fields textarea:focus-visible{outline:3px solid var(--gold);outline-offset:2px}.invoice-fields a{color:var(--gold)}.invoice-fields .action{margin-left:0}
