/* OCTOPUS PLUS/BASIC v11 professional design */
:root{--navy:#08283b;--red:#6f1d32;--petrol:#0d3d4c;--cream:#f5f2eb;--line:#ded7ca;--text:#10283b;--muted:#50677a;--shadow:0 26px 72px rgba(8,40,59,.12)}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:var(--text);background:radial-gradient(circle at 86% 12%,rgba(111,29,50,.09),transparent 28rem),linear-gradient(rgba(8,40,59,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(8,40,59,.035) 1px,transparent 1px),linear-gradient(180deg,#f5f2eb,#faf8f3);background-size:auto,38px 38px,38px 38px,auto;line-height:1.65}
body::before{content:"";position:fixed;inset:-20%;z-index:0;pointer-events:none;opacity:.32;background:linear-gradient(115deg,transparent 0 20%,rgba(111,29,50,.12) 20.06%,transparent 20.13% 46%,rgba(111,29,50,.08) 46.06%,transparent 46.13% 72%,rgba(111,29,50,.06) 72.06%,transparent 72.13%);background-size:820px 820px;animation:octLines 52s linear infinite}
body>*{position:relative;z-index:1}@keyframes octLines{from{background-position:0 0}to{background-position:720px 360px}}
.top,.footer{width:min(1180px,calc(100% - 40px));margin:18px auto;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 18px;background:rgba(255,255,255,.82);border:1px solid var(--line);box-shadow:0 18px 55px rgba(8,40,59,.08)}
.brand{display:flex;align-items:center;gap:13px;text-decoration:none;color:inherit}.logo{width:48px;height:48px;border-radius:16px;background:linear-gradient(135deg,var(--navy),var(--red));color:#fff;display:grid;place-items:center;font-weight:800}.brand strong{display:block;font-size:20px;color:var(--navy)}.brand small{display:block;color:#5a6c7b;font-weight:650}
nav{display:flex;gap:18px;font-weight:700}nav a{color:#3d4e5e;text-decoration:none}nav a:hover{color:var(--red)}
.hero,.form-page,.admin-wrap{width:min(1180px,calc(100% - 40px));margin:0 auto;padding:70px 0 90px}
.panel,.form-card,.admin-card,.ai-box,.success-box,.alert,.table-wrap{background:rgba(255,255,255,.94);border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow);padding:30px;transition:transform .32s ease,box-shadow .32s ease}.panel:hover,.form-card:hover,.admin-card:hover{transform:translateY(-4px);box-shadow:0 34px 90px rgba(8,40,59,.14)}
.kicker{color:var(--red);text-transform:uppercase;letter-spacing:.14em;font-size:12px;font-weight:800;margin-bottom:16px}
h1{font-size:clamp(34px,5vw,58px);line-height:1.04;letter-spacing:-.05em;font-weight:620;color:var(--navy);margin:0 0 18px}h2{font-size:clamp(24px,3vw,36px);font-weight:620;color:var(--navy);letter-spacing:-.035em}h3{font-weight:650;color:var(--navy)}p{color:var(--muted);font-size:17px}
.btn,button,input[type=submit]{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:13px 22px;border:0;border-radius:999px;background:var(--navy);color:#fff;font-weight:750;cursor:pointer;box-shadow:0 14px 36px rgba(8,40,59,.18)}.btn.secondary{background:#fff;color:var(--navy);border:1px solid var(--line);box-shadow:none}
.form-page{display:grid;grid-template-columns:.82fr 1.18fr;gap:48px;align-items:start}.form-grid,.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}label{display:flex;flex-direction:column;font-weight:650;color:var(--navy);gap:7px}input,select,textarea{width:100%;border:1px solid #d8d0c5;border-radius:16px;min-height:52px;padding:13px 15px;font:inherit;background:#fff}input:focus,select:focus,textarea:focus{outline:0;border-color:rgba(8,40,59,.52);box-shadow:0 0 0 4px rgba(8,40,59,.08)}textarea{min-height:130px}.wide,.full{grid-column:1/-1}.check{display:flex;flex-direction:row;align-items:flex-start}.check input{width:auto;min-height:auto;margin-top:7px}
.ai-box{background:linear-gradient(135deg,var(--red),#34141d)!important;color:#fff}.ai-box h2,.ai-box h3,.ai-box strong{color:#fff}.ai-box p{color:rgba(255,255,255,.86)}
.table-wrap{overflow:auto;padding:0}table{width:100%;border-collapse:collapse;background:#fff}th,td{padding:12px 14px;border-bottom:1px solid #ece6de;text-align:left;vertical-align:top}th{background:#f6f7f8;text-transform:uppercase;font-size:12px;letter-spacing:.08em;color:#607386}.pill,.badge{display:inline-flex;border-radius:999px;padding:5px 10px;background:#eef3f6;color:var(--navy);font-weight:750;font-size:12px}.alert.ok,.success-box{background:#eff8f4;color:#1e624f}.alert.error{background:#fff1f4;color:#8d2137}
@media(max-width:900px){.top,.footer{width:calc(100% - 24px);flex-direction:column;align-items:flex-start}.hero,.form-page,.admin-wrap{width:calc(100% - 28px);padding:44px 0 64px}.form-page,.form-grid,.settings-grid{grid-template-columns:1fr}h1{font-size:38px}}


/* ===== v12 refined waves and proper chat modal ===== */
body{
  background:
    radial-gradient(circle at 86% 10%,rgba(111,29,50,.08),transparent 24rem),
    linear-gradient(180deg,#f6f2eb,#f9f6f0);
  position:relative;
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed;
  inset:-10%;
  z-index:0;
  pointer-events:none;
  opacity:.34;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='300' viewBox='0 0 1200 300'%3E%3Cpath d='M-120 92 C 20 42, 160 142, 300 92 S 580 42, 720 92 1000 142, 1140 92 1280 42, 1420 92' fill='none' stroke='%230d3d4c' stroke-opacity='.15' stroke-width='1.8'/%3E%3Cpath d='M-120 156 C 20 106, 160 206, 300 156 S 580 106, 720 156 1000 206, 1140 156 1280 106, 1420 156' fill='none' stroke='%236f1d32' stroke-opacity='.13' stroke-width='1.7'/%3E%3Cpath d='M-120 218 C 20 188, 160 248, 300 218 S 580 188, 720 218 1000 248, 1140 218 1280 188, 1420 218' fill='none' stroke='%23b8aea2' stroke-opacity='.18' stroke-width='1.4'/%3E%3C/svg%3E");
  background-repeat:repeat;
  background-size:1200px 300px;
  animation:octLines 46s linear infinite;
}
.top,.footer,.panel,.form-card,.admin-card,.ai-box,.success-box,.alert,.table-wrap,.chat-card{
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.chat-modal{
  position:fixed;
  inset:0;
  z-index:99999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(9,22,31,.42);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.chat-modal.active{display:flex}
.chat-card{
  width:min(760px,100%);
  max-height:min(88vh,900px);
  overflow:auto;
  position:relative;
  background:rgba(255,255,255,.98);
  border:1px solid #ddd4c8;
  border-radius:30px;
  padding:28px 28px 24px;
  box-shadow:0 40px 120px rgba(8,40,59,.25);
}
.chat-card h2{margin:0 56px 16px 0;font-size:36px;line-height:1.05}
.chat-close{
  position:absolute;
  top:18px;
  right:18px;
  width:44px;
  height:44px;
  border-radius:50%;
  border:0;
  display:grid;
  place-items:center;
  font-size:28px;
  font-weight:500;
  color:#fff;
  background:var(--navy);
  box-shadow:none;
}
.chat-box{
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height:260px;
  max-height:44vh;
  overflow:auto;
  padding:6px 6px 4px 0;
  margin-bottom:18px;
}
.msg{
  max-width:88%;
  padding:14px 16px;
  border-radius:20px;
  line-height:1.6;
  border:1px solid #e1d9cd;
  background:#fff;
  color:#24384a;
  box-shadow:0 10px 26px rgba(8,40,59,.05);
}
.msg.bot{
  align-self:flex-start;
  border-top-left-radius:8px;
  background:linear-gradient(180deg,#fff,#fbf8f4);
}
.msg.user{
  align-self:flex-end;
  border-top-right-radius:8px;
  background:linear-gradient(180deg,#f1f6f8,#eaf2f6);
  border-color:#d4e1e8;
}
.msg.loading{opacity:.7}
.chat-form{
  display:grid;
  grid-template-columns:1fr auto;
  gap:12px;
  align-items:end;
}
.chat-form input{
  min-height:56px;
}
.chat-form .btn{
  min-width:120px;
}
@media(max-width:720px){
  .chat-modal{padding:16px}
  .chat-card{padding:22px 18px 18px;border-radius:24px}
  .chat-card h2{font-size:28px;margin-right:46px}
  .chat-form{grid-template-columns:1fr}
  .chat-form .btn{width:100%}
  .chat-box{max-height:50vh}
}

.chat-card{
  display:flex;
  flex-direction:column;
}
.chat-box{
  padding:10px 4px 8px 0;
}
.chat-card h2{
  margin-bottom:18px;
}
.chat-form{
  margin-top:8px;
}
.msg{
  white-space:pre-wrap;
}
.ai-box.ai-rescue-box .btn{
  min-width:240px;
}