:root{
  --navy:#071d49;
  --navy-2:#102f68;
  --blue:#145bd7;
  --blue-2:#eaf2ff;
  --cyan:#08bce8;
  --ink:#172b4d;
  --muted:#687995;
  --border:#dce5f2;
  --paper:#f4f7fc;
  --white:#fff;
  --green:#07865e;
  --amber:#fff7df;
  --red:#e6384d;
  --shadow:0 12px 36px rgba(18,47,97,.075);
  --shadow-soft:0 5px 18px rgba(18,47,97,.055);
  --radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.65 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--blue);text-decoration:none}
a:hover{color:#0b43a8}
.wrap{width:min(1160px,calc(100% - 40px));margin:0 auto}
.top{position:sticky;top:0;z-index:30;background:rgba(5,22,59,.97);border-bottom:1px solid rgba(255,255,255,.1);backdrop-filter:blur(16px);box-shadow:0 8px 28px rgba(3,17,47,.12)}
.nav{display:flex;justify-content:space-between;align-items:center;gap:22px;min-height:72px;padding:10px 0}
.logo{font-size:1.22rem;font-weight:950;text-decoration:none;color:#fff;letter-spacing:-.055em;white-space:nowrap}
.logo span{color:#20d4f5}
nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
nav a{font-size:.9rem;color:#dbe8ff;text-decoration:none;font-weight:750;padding:9px 12px;border-radius:10px;white-space:nowrap}
nav a:hover{color:#fff;background:rgba(255,255,255,.12)}
.nav-logout{display:inline-flex!important;gap:0!important;margin:0!important;padding:0!important}
.nav-logout button{background:transparent;color:#dbe8ff;border:1px solid rgba(255,255,255,.26);padding:8px 12px;font-size:.9rem;font-weight:750;border-radius:10px;min-height:0;box-shadow:none}
.nav-logout button:hover{background:rgba(255,255,255,.12);color:#fff;filter:none;box-shadow:none}
main.wrap{min-height:calc(100vh - 170px);padding:34px 0 70px}
h1,h2,h3,h4{line-height:1.2;color:var(--navy);letter-spacing:-.035em}
h1{font-size:clamp(2rem,4vw,3rem);margin:.25em 0 .55em;font-weight:900}
h2{font-size:1.45rem;margin:1.4em 0 .65em;font-weight:850}
h3{font-size:1.08rem;font-weight:850}
p{margin:.65em 0}
.hero{display:grid;grid-template-columns:1.5fr .9fr;align-items:center;gap:34px;background:linear-gradient(125deg,#071d49,#124f9f 68%,#2477d2);color:#fff;border-radius:26px;padding:clamp(28px,5vw,58px);box-shadow:0 20px 55px rgba(9,44,101,.2);position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;width:430px;height:430px;border:1px solid rgba(255,255,255,.13);border-radius:50%;right:-150px;top:-230px;pointer-events:none}
.hero h1,.hero h2{color:#fff}.hero p{color:#e4efff;max-width:680px}.hero .tag{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.2)}
.panel{border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.12);padding:26px;border-radius:18px;backdrop-filter:blur(10px)}
.price{font-weight:950;font-size:clamp(2rem,5vw,2.8rem);letter-spacing:-.055em;margin:8px 0}
.btn,button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:11px;padding:11px 17px;background:linear-gradient(105deg,#1762df,#0a9dd7);color:#fff;font-weight:800;text-decoration:none;cursor:pointer;font:inherit;font-weight:800;line-height:1.3;min-height:42px;box-shadow:0 5px 14px rgba(20,91,215,.13);transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}
.btn:hover,button:hover{color:#fff;transform:translateY(-1px);box-shadow:0 8px 20px rgba(20,91,215,.18);filter:brightness(1.03)}
.btn-light,.btn-secondary{background:#fff;color:var(--navy);border-color:var(--border);box-shadow:none}.btn-light:hover,.btn-secondary:hover{color:var(--blue);background:#f8fbff}
.btn-red{background:linear-gradient(105deg,#ed344b,#ce233b)}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:24px;margin:16px 0;box-shadow:var(--shadow-soft);min-width:0}
.card h1{font-size:clamp(1.65rem,3vw,2.25rem)}
.card h2{margin-top:.3em}
.card .card{box-shadow:none;background:#fbfdff;border-radius:14px;padding:18px;margin:14px 0}
.card>section{min-width:0}
.tag{display:inline-flex;align-items:center;border-radius:999px;padding:5px 11px;background:var(--blue-2);color:var(--blue);font-size:.75rem;font-weight:900;letter-spacing:.045em;border:1px solid #d7e6ff}
.money{font-size:clamp(1.45rem,3vw,2rem);font-weight:950;color:var(--blue);letter-spacing:-.04em;overflow-wrap:anywhere}
.muted,small{color:var(--muted)}
.small{font-size:.85rem}
.split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.bank{border:1px solid var(--border);border-radius:14px;padding:20px;background:linear-gradient(180deg,#fff,#f9fbff)}
.notice{background:#edf5ff;border:1px solid #d3e4ff;border-left:4px solid var(--blue);padding:14px 17px;border-radius:12px;color:#334d73;margin:15px 0}
.warning{background:var(--amber);border:1px solid #f2e2a8;border-left:4px solid #e2a800;padding:14px 17px;border-radius:12px;color:#72500c;margin:15px 0}
.alert{background:#e9f8f0;color:#155c42;border:1px solid #c2ebd4;border-radius:12px;padding:13px 16px;margin:0 0 20px;font-weight:650}
form{display:grid;gap:14px;min-width:0}
label{display:grid;gap:7px;font-weight:750;color:#29415f;min-width:0}
label small{font-weight:500;font-size:.82rem;line-height:1.5}
input,select,textarea{width:100%;min-width:0;border:1px solid #c9d6e8;border-radius:11px;padding:12px 14px;font:inherit;background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(10,30,70,.025);transition:border-color .15s,box-shadow .15s}
textarea{min-height:105px;resize:vertical;line-height:1.5}
input:focus,select:focus,textarea:focus{outline:0;border-color:#6ca0f2;box-shadow:0 0 0 4px rgba(33,113,230,.12)}
input[type=checkbox]{width:auto;min-width:17px;display:inline-block;margin:3px 8px 0 0;accent-color:var(--blue)}
label:has(input[type=checkbox]){display:flex;align-items:flex-start;font-weight:550;line-height:1.5}
.code{font-size:clamp(1.7rem,4vw,2.5rem);font-weight:950;letter-spacing:.12em;color:var(--blue);background:var(--blue-2);display:inline-block;padding:7px 20px;border-radius:13px;overflow-wrap:anywhere}
.scroll{width:100%;overflow:auto;border:1px solid var(--border);border-radius:13px;background:#fff;-webkit-overflow-scrolling:touch}
.table{width:100%;border-collapse:separate;border-spacing:0;font-size:.9rem;min-width:640px}
.table th,.table td{padding:13px 12px;border-bottom:1px solid #e8eef6;text-align:left;vertical-align:top}
.table th{background:#f2f6fc;color:#294365;font-size:.79rem;text-transform:uppercase;letter-spacing:.045em;position:sticky;top:0}
.table tr:last-child td{border-bottom:0}
.table tr:hover td{background:#fbfdff}
.inline{display:inline-flex;margin:3px}
.inline button{padding:7px 10px;font-size:.82rem}
hr{border:0;border-top:1px solid var(--border);margin:24px 0}
.split-settings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}
.split-stat{border:1px solid var(--border);border-radius:15px;padding:17px;background:linear-gradient(180deg,#fff,#f7faff);display:grid;gap:4px;min-width:0}
.split-stat small{font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:.72rem}
.split-stat strong{font-size:1.8rem;color:var(--blue);letter-spacing:-.04em}
.split-stat b{font-size:1.05rem;color:var(--navy);overflow-wrap:anywhere}
.admin-highlight{border-top:4px solid var(--blue)}
.admin-settings-card{max-width:820px;margin:20px auto}
.admin-settings-card form{margin-top:20px}
footer{border-top:1px solid var(--border);background:#fff;padding:24px 0;color:var(--muted);font-size:.9rem}
footer .wrap{text-align:center}
@media(max-width:900px){
  .nav{align-items:flex-start;flex-direction:column;gap:8px;padding:12px 0}
  nav{width:100%;flex-wrap:nowrap;overflow-x:auto;gap:4px;padding:0 0 4px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
  nav a,.nav-logout button{font-size:.84rem;padding:8px 10px}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero{grid-template-columns:1fr}
}
@media(max-width:620px){
  .wrap{width:calc(100% - 24px)}
  .nav{min-height:unset}
  .logo{font-size:1.12rem}
  main.wrap{padding:22px 0 48px}
  .grid,.split,.split-settings{grid-template-columns:1fr;gap:10px}
  .card{padding:18px;margin:12px 0;border-radius:15px}
  .card .card{padding:15px}
  .hero{padding:25px 20px;border-radius:18px;gap:20px}
  .panel{padding:19px}
  .btn,button{max-width:100%;white-space:normal;text-align:center}
  .table{min-width:600px}
  .code{font-size:1.65rem;letter-spacing:.08em}
  .bank{padding:16px}
  form .btn,form button{width:100%}
  .scroll{border-radius:10px}
  .split-stat{grid-template-columns:1fr auto;align-items:center}
  .split-stat strong{grid-row:span 2;grid-column:2}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
