/* [???????] ????? UI ??????????????????? */
:root{
  --blue:#3D7EFF;
  --deep-blue:#1554C8;
  --blue2:#5FB4FF;
  --text:#111111;
  --gray:#666666;
  --muted:#999999;
  --line:#EAEAEA;
  --soft-line:#E8EEF8;
  --shadow:0 12px 34px rgba(50,100,200,.09);
  --card-shadow:0 10px 30px rgba(20,60,120,.075);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;overflow:hidden}
body{font-family:"PingFang SC","Microsoft YaHei",????,Arial,sans-serif;color:var(--text);background:#fff}
button,a,textarea{font-family:inherit}
button{appearance:none}


/* ?????? Axure ??????????????????? */
.sidebar{
  position:fixed;
  left:0;
  top:0;
  bottom:0;
  width:280px;
  background:#FFFFFF;
  border-right:1px solid #EEF2F8;
  z-index:5;
  padding:22px 20px 18px;
  display:flex;
  flex-direction:column;
}

/* ?? Logo + ?????????????? */
.brand-wrap{
  position:relative;
  height:68px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:0 14px;
  margin-bottom:20px;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(235,247,255,.98) 0%,rgba(244,248,255,.94) 58%,rgba(247,250,255,.88) 100%);
  box-shadow:0 8px 22px rgba(61,126,255,.055);
  overflow:hidden;
}
.brand-glow{
  position:absolute;
  left:-18px;
  top:-28px;
  width:112px;
  height:104px;
  border-radius:32px;
  background:radial-gradient(circle,rgba(93,184,255,.28) 0%,rgba(61,126,255,.08) 58%,transparent 72%);
  z-index:0;
}
.brand-logo{
  width:42px;
  height:42px;
  flex:0 0 42px;
  position:relative;
  z-index:1;
  border-radius:12px;
  background:linear-gradient(135deg,#6CC6FF 0%,#3D7EFF 62%,#255FE7 100%);
  clip-path:polygon(50% 0,94% 25%,94% 75%,50% 100%,6% 75%,6% 25%);
  box-shadow:0 9px 18px rgba(61,126,255,.22);
}
/* ??????????????????? */
.brand-logo:before{
  content:"";
  position:absolute;
  inset:8px 9px 9px;
  clip-path:polygon(50% 0,100% 28%,100% 74%,50% 100%,0 74%,0 28%);
  background:linear-gradient(135deg,rgba(255,255,255,.72),rgba(255,255,255,.22));
  opacity:.86;
}
.brand-logo:after{
  content:"";
  position:absolute;
  right:7px;
  bottom:7px;
  width:18px;
  height:18px;
  clip-path:polygon(50% 0,100% 28%,100% 74%,50% 100%,0 74%,0 28%);
  background:rgba(255,255,255,.26);
}
.brand-title{
  position:relative;
  z-index:1;
  font-size:18px;
  line-height:24px;
  font-weight:700;
  color:#111111;
  white-space:nowrap;
  letter-spacing:-.2px;
}

/* ?????? */
.new-chat{
  width:218px;
  height:50px;
  margin:0 auto 24px;
  border:0;
  border-radius:12px;
  background:#3D7EFF;
  color:#FFFFFF;
  font-size:16px;
  font-weight:600;
  line-height:50px;
  text-align:center;
  box-shadow:0 8px 18px rgba(61,126,255,.18);
  cursor:pointer;
}
.new-chat span{font-size:20px;vertical-align:-1px;margin-right:2px}

/* ???? */
.nav-section{margin-bottom:22px}
.section-title{
  font-size:14px;
  line-height:22px;
  color:#999999;
  font-weight:400;
  margin:0 0 8px 6px;
}
.nav-item{
  width:232px;
  height:42px;
  border-radius:21px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:0 15px;
  margin-bottom:7px;
  text-decoration:none;
  color:#222222;
  background:transparent;
  font-size:16px;
  font-weight:500;
}
.nav-item span{color:inherit}
.nav-item:hover{background:#F7FAFF;color:#111111}
.nav-item.active{
  background:#3D7EFF;
  color:#FFFFFF;
  font-weight:600;
  box-shadow:0 7px 16px rgba(61,126,255,.16);
}
.nav-item.active:hover{background:#3D7EFF;color:#FFFFFF}
.nav-icon{
  width:18px;
  height:18px;
  border:1.8px solid currentColor;
  border-radius:5px;
  position:relative;
  display:inline-block;
  flex:0 0 18px;
  color:inherit;
}
.icon-chat:after{
  content:"";
  position:absolute;
  width:6px;
  height:6px;
  left:2px;
  bottom:-4px;
  border-left:1.8px solid currentColor;
  border-bottom:1.8px solid currentColor;
  transform:rotate(-25deg);
  background:#3D7EFF;
}
.nav-item:not(.active) .icon-chat:after{background:#FFFFFF}
.icon-report:after,.icon-book:after{
  content:"";
  position:absolute;
  left:4px;
  right:4px;
  top:5px;
  border-top:1.8px solid currentColor;
  box-shadow:0 5px 0 currentColor;
}
.icon-agent{border-radius:50%}
.icon-agent:after{
  content:"";
  position:absolute;
  width:6px;
  height:6px;
  border-radius:50%;
  background:currentColor;
  left:4.2px;
  top:4.2px;
}

/* ?????????????????? */
.history-section{flex:1;min-height:0;padding-top:1px}
.history-item{
  width:238px;
  height:32px;
  border:0;
  border-radius:8px;
  background:transparent;
  text-align:left;
  padding:0 6px;
  font-size:13px;
  line-height:32px;
  color:#333333;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  cursor:pointer;
}
.history-item em{
  font-style:normal;
  color:#666666;
  margin-left:3px;
}
.history-item:hover{background:#F7FAFF;color:#111111}

/* ?????? */
.user-box{
  height:56px;
  border-radius:16px;
  background:linear-gradient(135deg,#F2F8FF 0%,#FAFCFF 100%);
  border:1px solid #EDF4FF;
  display:flex;
  align-items:center;
  gap:11px;
  padding:8px 10px;
  box-shadow:0 6px 18px rgba(61,126,255,.055);
}
.user-avatar{
  width:36px;
  height:36px;
  border-radius:50%;
  background:#E7F2FF;
  color:#3D7EFF;
  font-weight:700;
  font-size:15px;
  display:grid;
  place-items:center;
  flex:0 0 36px;
}
.user-info{display:flex;flex-direction:column;justify-content:center;min-width:0}
.user-info strong{display:block;font-size:14px;line-height:19px;color:#222222;font-weight:700}
.user-info span{display:block;font-size:12px;line-height:17px;color:#777777}

.main-content{
  position:relative;margin-left:280px;height:100vh;overflow:hidden;
  background:linear-gradient(135deg,#EEF8FF 0%,#FAFCFF 48%,#F2EFFF 100%);
  display:flex;flex-direction:column;align-items:center;padding:58px 40px 22px;
}
.tech-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}.tech-bg:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 1px 1px,rgba(61,126,255,.15) 1px,transparent 0);background-size:34px 34px;opacity:.17}.tech-bg:after{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='1600' height='900' viewBox='0 0 1600 900' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%233D7EFF' stroke-opacity='.17' stroke-width='1.1'%3E%3Cpath d='M110 135 C285 52 450 94 590 170 S840 250 1020 130 1320 72 1510 150'/%3E%3Cpath d='M880 16 C918 126 1010 174 1130 194 S1370 234 1488 382'/%3E%3Cpath d='M40 685 C210 596 402 636 540 728 S810 818 1010 708 1280 620 1550 728'/%3E%3Cpath d='M1210 508 C1320 456 1418 494 1490 576 S1582 648 1630 628'/%3E%3C/g%3E%3Cg fill='%233D7EFF' fill-opacity='.23'%3E%3Ccircle cx='270' cy='83' r='4'/%3E%3Ccircle cx='588' cy='170' r='4'/%3E%3Ccircle cx='1020' cy='130' r='4'/%3E%3Ccircle cx='1475' cy='355' r='5'/%3E%3Ccircle cx='515' cy='714' r='4'/%3E%3Ccircle cx='1280' cy='625' r='4'/%3E%3C/g%3E%3C/svg%3E") center/cover no-repeat;opacity:.82}.node{position:absolute;width:7px;height:7px;border-radius:50%;background:rgba(61,126,255,.24)}.node-1{left:24%;top:14%}.node-2{right:18%;top:20%}.node-3{right:12%;bottom:24%}.node-4{left:31%;bottom:17%}.wire{position:absolute;height:1px;background:linear-gradient(90deg,transparent,rgba(61,126,255,.18),transparent)}.wire-1{width:520px;left:29%;top:19%;transform:rotate(8deg)}.wire-2{width:430px;right:4%;top:42%;transform:rotate(44deg)}.wire-3{width:640px;left:31%;bottom:18%;transform:rotate(-8deg)}
.hero-area,.interaction-row,.disclaimer{position:relative;z-index:1}.hero-area{width:100%;display:flex;flex-direction:column;align-items:center;flex:0 0 auto}.hero-area h1{font-size:64px;line-height:1.12;font-weight:800;color:#111;letter-spacing:-1.2px;text-align:center}.quick-questions{width:min(1320px,100%);margin-top:34px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.quick-card{min-height:78px;border:0;border-radius:999px;background:linear-gradient(135deg,rgba(225,243,255,.86),rgba(243,239,255,.88));backdrop-filter:blur(8px);box-shadow:0 10px 26px rgba(61,126,255,.08);color:var(--deep-blue);font-size:16px;font-weight:600;line-height:25px;text-align:center;padding:15px 30px;cursor:pointer}.quick-card:hover{box-shadow:0 12px 30px rgba(61,126,255,.12);transform:translateY(-1px)}

/* ????????? 20% / ? 60% / ? 20%????? */
.interaction-row{
  width:min(1320px,100%);margin-top:52px;display:flex;align-items:stretch;gap:24px;flex:0 0 268px;
}
.decor-card,.input-panel{height:auto;min-height:268px;border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:var(--card-shadow)}
.decor-card{flex:1 1 20%;display:grid;place-items:center;overflow:hidden}.input-panel{flex:3 1 60%;padding:28px 30px 24px;display:flex;flex-direction:column}.flat-orbit{width:205px;height:205px;position:relative}.orbit{position:absolute;left:50%;top:50%;border-radius:50%;border:2.5px solid rgba(61,126,255,.18);transform:translate(-50%,-50%)}.orbit-a{width:205px;height:205px}.orbit-b{width:148px;height:148px}.flat-ball{position:absolute;left:50%;top:50%;width:92px;height:92px;border-radius:50%;transform:translate(-50%,-50%);background:linear-gradient(135deg,#78CBFF,#3D7EFF);box-shadow:0 10px 22px rgba(61,126,255,.18)}.small-dot{position:absolute;border-radius:50%;background:#3D7EFF;box-shadow:0 0 0 7px rgba(61,126,255,.08)}.dot-a{left:20px;top:58px;width:13px;height:13px}.dot-b{right:22px;top:72px;width:10px;height:10px}.dot-c{left:75px;bottom:15px;width:12px;height:12px}.matrix-graphic{width:190px;height:190px;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;transform:rotate(-3deg)}.matrix-graphic span{border-radius:15px;background:linear-gradient(135deg,#ECF7FF,#DDEBFF);border:1px solid rgba(61,126,255,.13);box-shadow:0 6px 14px rgba(61,126,255,.06)}.matrix-graphic span:nth-child(2),.matrix-graphic span:nth-child(4),.matrix-graphic span:nth-child(9){background:linear-gradient(135deg,#89D0FF,#3D7EFF)}
.input-panel textarea{flex:1;width:100%;min-height:150px;border:0;outline:0;resize:none;background:transparent;color:#111;font-size:20px;line-height:32px;padding:2px 0}.input-panel textarea::placeholder{color:#AAB4C3}.panel-footer{height:54px;display:flex;align-items:center;justify-content:space-between;margin-top:14px}.mode-tabs{display:flex;gap:12px;align-items:center}.mode-tab{height:36px;border:0;border-radius:18px;background:transparent;color:#888;font-size:15px;display:flex;align-items:center;gap:7px;cursor:pointer;padding:0 13px}.mode-tab.active{background:var(--blue);color:#fff;font-weight:600;box-shadow:0 6px 14px rgba(61,126,255,.14)}.tab-icon{width:18px;height:18px;display:inline-block;position:relative;border:1.7px solid currentColor;border-radius:5px;flex:0 0 18px}.tab-chat:after{content:"";position:absolute;width:6px;height:6px;left:2px;bottom:-4px;border-left:1.7px solid currentColor;border-bottom:1.7px solid currentColor;transform:rotate(-25deg);background:var(--blue)}.mode-tab:not(.active) .tab-chat:after{background:#fff}.tab-chart:before{content:"";position:absolute;left:4px;bottom:3px;width:2px;height:7px;background:currentColor;box-shadow:5px -4px 0 currentColor,10px -1px 0 currentColor}.send-btn{width:128px;height:50px;border:0;border-radius:13px;background:var(--blue);color:#fff;font-size:16px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;box-shadow:0 8px 18px rgba(61,126,255,.18)}.plane-icon{width:18px;height:18px;display:inline-block;position:relative;transform:rotate(-18deg)}.plane-icon:before{content:"";position:absolute;left:1px;top:3px;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:16px solid #fff}.plane-icon:after{content:"";position:absolute;left:4px;top:8px;width:7px;height:2px;background:var(--blue);transform:rotate(23deg);transform-origin:left center}.disclaimer{margin-top:auto;width:100%;text-align:center;color:#999;font-size:13px;line-height:24px;padding-top:28px}.toast{position:fixed;right:34px;top:28px;z-index:20;background:#fff;border:1px solid #E9EEF7;border-radius:10px;box-shadow:var(--shadow);font-size:14px;color:#666;padding:11px 16px;opacity:0;transform:translateY(-8px);transition:.2s}.toast.show{opacity:1;transform:translateY(0)}
@media(max-width:1360px){.main-content{padding-left:34px;padding-right:34px}.hero-area h1{font-size:56px}.quick-questions{gap:16px}.quick-card{font-size:15px;padding-left:22px;padding-right:22px}.interaction-row{gap:20px;flex-basis:244px}.decor-card,.input-panel{min-height:244px}.flat-orbit{width:176px;height:176px}.orbit-a{width:176px;height:176px}.orbit-b{width:126px;height:126px}.flat-ball{width:82px;height:82px}.matrix-graphic{width:160px;height:160px}}


/* [????] ?? Logo????? 3 ????????? */
.brand-logo{
  background:#3D7EFF;
  clip-path:polygon(50% 0,94% 25%,94% 75%,50% 100%,6% 75%,6% 25%);
  border-radius:0;
  box-shadow:0 8px 18px rgba(61,126,255,.18);
}
.brand-logo:before,
.brand-logo:after{
  display:none;
  content:none;
}
.hero-area h1{
  margin:0 0 24px;
}
.quick-questions{
  margin-top:0;
  width:min(1340px,100%);
  gap:22px;
}
.quick-card{
  min-height:108px;
  padding:25px 36px;
  border-radius:999px;
  background:linear-gradient(135deg,rgba(209,236,255,.96) 0%,rgba(226,239,255,.94) 48%,rgba(232,224,255,.96) 100%);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  box-shadow:0 14px 34px rgba(61,126,255,.13), inset 0 1px 0 rgba(255,255,255,.72);
  color:#0F4FC7;
  font-size:16px;
  font-weight:700;
  line-height:28px;
  letter-spacing:.05px;
}
.quick-card:hover{
  box-shadow:0 16px 38px rgba(61,126,255,.16), inset 0 1px 0 rgba(255,255,255,.78);
}
@media(max-width:1360px){
  .hero-area h1{margin-bottom:22px}
  .quick-questions{gap:18px}
  .quick-card{min-height:96px;padding:21px 26px;font-size:15px;line-height:26px}
}


/* [????] ??????? */
.interaction-row{
  width:min(1340px,100%);
  margin-top:46px;
  display:flex;
  align-items:stretch;
  gap:24px;
  flex:0 0 280px;
  height:280px;
}
.decor-card,
.input-panel{
  height:280px;
  min-height:280px;
  border-radius:24px;
  background:#FFFFFF;
  border:1px solid #EAEAEA;
  box-shadow:0 12px 34px rgba(20,60,120,.075);
}
.decor-card{
  flex:0 0 calc(22% - 16px);
  display:grid;
  place-items:center;
  overflow:hidden;
}
.input-panel{
  flex:0 0 calc(56% - 16px);
  padding:30px 32px 26px;
  display:flex;
  flex-direction:column;
}
.input-panel textarea{
  flex:1;
  width:100%;
  min-height:172px;
  border:0;
  outline:0;
  resize:none;
  background:transparent;
  color:#111111;
  font-size:20px;
  line-height:34px;
  padding:0;
  text-align:left;
}
.input-panel textarea::placeholder{color:#A8B2C2}
.panel-footer{
  height:56px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:18px;
}
.mode-tabs{display:flex;gap:18px;align-items:center}
.mode-tab{
  height:38px;
  border:0;
  border-radius:19px;
  background:transparent;
  color:#7F8794;
  font-size:16px;
  font-weight:500;
  display:flex;
  align-items:center;
  gap:9px;
  cursor:pointer;
  padding:0 15px;
}
.mode-tab.active{
  background:#3D7EFF;
  color:#FFFFFF;
  font-weight:600;
  box-shadow:0 7px 16px rgba(61,126,255,.15);
}
.tab-icon{
  width:19px;
  height:19px;
  display:inline-block;
  position:relative;
  border:1.8px solid currentColor;
  border-radius:5px;
  flex:0 0 19px;
}
.tab-chat:after{
  content:"";
  position:absolute;
  width:6px;
  height:6px;
  left:2px;
  bottom:-4px;
  border-left:1.8px solid currentColor;
  border-bottom:1.8px solid currentColor;
  transform:rotate(-25deg);
  background:#3D7EFF;
}
.mode-tab:not(.active) .tab-chat:after{background:#FFFFFF}
.tab-chart:before{
  content:"";
  position:absolute;
  left:4px;
  bottom:3px;
  width:2.5px;
  height:8px;
  border-radius:2px;
  background:currentColor;
  box-shadow:5.5px -5px 0 currentColor,11px -1px 0 currentColor;
}
.tab-chart:after{
  content:"";
  position:absolute;
  left:3px;
  right:3px;
  bottom:3px;
  height:1.8px;
  background:currentColor;
  opacity:.45;
}
.send-btn{
  width:134px;
  height:52px;
  border:0;
  border-radius:13px;
  background:#3D7EFF;
  color:#FFFFFF;
  font-size:16px;
  font-weight:600;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  cursor:pointer;
  box-shadow:0 9px 20px rgba(61,126,255,.18);
}
.plane-icon{
  width:20px;
  height:20px;
  display:inline-block;
  position:relative;
  transform:rotate(-24deg);
}
.plane-icon:before{
  content:"";
  position:absolute;
  left:1px;
  top:3px;
  width:0;
  height:0;
  border-top:7px solid transparent;
  border-bottom:7px solid transparent;
  border-left:18px solid #FFFFFF;
}
.plane-icon:after{
  content:"";
  position:absolute;
  left:5px;
  top:9px;
  width:8px;
  height:2px;
  background:#3D7EFF;
  transform:rotate(22deg);
  transform-origin:left center;
}
/* ?? 2D ????????? */
.flat-orbit{
  width:246px;
  height:246px;
  position:relative;
}
.orbit{border-width:2.6px}
.orbit-a{width:246px;height:246px}
.orbit-b{width:178px;height:178px}
.flat-ball{
  width:112px;
  height:112px;
  box-shadow:0 12px 26px rgba(61,126,255,.19);
}
.dot-a{left:24px;top:70px;width:15px;height:15px}
.dot-b{right:27px;top:86px;width:12px;height:12px}
.dot-c{left:90px;bottom:18px;width:14px;height:14px}
.matrix-graphic{
  width:226px;
  height:226px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  transform:rotate(-3deg);
}
.matrix-graphic span{
  border-radius:17px;
  box-shadow:0 7px 16px rgba(61,126,255,.07);
}
.disclaimer{
  margin-top:auto;
  padding-top:34px;
  width:100%;
  text-align:center;
  color:#999999;
  font-size:13px;
  line-height:24px;
}
@media(max-width:1360px){
  .interaction-row{height:260px;flex-basis:260px;gap:20px;margin-top:40px}
  .decor-card,.input-panel{height:260px;min-height:260px}
  .input-panel{padding:27px 29px 23px}
  .flat-orbit{width:210px;height:210px}
  .orbit-a{width:210px;height:210px}
  .orbit-b{width:154px;height:154px}
  .flat-ball{width:96px;height:96px}
  .matrix-graphic{width:196px;height:196px;gap:14px}
}


/* [????] ??????????? */
.bottom-container {
  display: flex !important;
  align-items: stretch !important;
  height: 280px !important;
  min-height: 280px !important;
  gap: 24px !important;
  width: min(1340px, 100%) !important;
  margin-top: 40px !important;
  flex: 0 0 280px !important;
}
.bottom-container .side-card {
  width: 22% !important;
  flex: 0 0 calc(22% - 16px) !important;
  height: 280px !important;
  min-height: 280px !important;
  background: #FFFFFF !important;
  border: 1px solid #EAEAEA !important;
  border-radius: 24px !important;
  box-shadow: 0 12px 34px rgba(20,60,120,.075) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}
.bottom-container .input-card {
  width: 56% !important;
  flex: 0 0 calc(56% - 16px) !important;
  height: 280px !important;
  min-height: 280px !important;
  background: #FFFFFF !important;
  border: 1px solid #EAEAEA !important;
  border-radius: 24px !important;
  box-shadow: 0 12px 34px rgba(20,60,120,.075) !important;
  padding: 30px 32px 26px !important;
  display: flex !important;
  flex-direction: column !important;
}
.bottom-container .flat-orbit {
  width: 205px !important;
  height: 205px !important;
  transform: scale(1.5) !important;
  transform-origin: center center !important;
}
.bottom-container .matrix-graphic {
  width: 190px !important;
  height: 190px !important;
  transform: rotate(-3deg) scale(1.5) !important;
  transform-origin: center center !important;
}
.bottom-container .input-card textarea {
  flex: 1 1 auto !important;
  width: 100% !important;
  min-height: 170px !important;
  border: 0 !important;
  outline: 0 !important;
  resize: none !important;
  background: transparent !important;
  color: #111111 !important;
  font-size: 20px !important;
  line-height: 34px !important;
  padding: 0 !important;
  text-align: left !important;
}
.bottom-container .input-card textarea::placeholder {
  color: #A8B2C2 !important;
}
.bottom-container .panel-footer {
  height: 56px !important;
  margin-top: 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
.bottom-container .mode-tabs {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
}
.bottom-container .mode-tab {
  height: 38px !important;
  border-radius: 19px !important;
  padding: 0 15px !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  gap: 9px !important;
  display: inline-flex !important;
  align-items: center !important;
}
.bottom-container .mode-tab.active {
  background: #3D7EFF !important;
  color: #FFFFFF !important;
  font-weight: 600 !important;
}
.chart-svg {
  width: 20px !important;
  height: 20px !important;
  flex: 0 0 20px !important;
  display: inline-block !important;
  fill: none !important;
  stroke: #8E98A8 !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.bottom-container .send-btn {
  width: 134px !important;
  height: 52px !important;
  border: 0 !important;
  border-radius: 13px !important;
  background: #3D7EFF !important;
  color: #FFFFFF !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  box-shadow: 0 9px 20px rgba(61,126,255,.18) !important;
}
.send-svg {
  width: 20px !important;
  height: 20px !important;
  flex: 0 0 20px !important;
  display: inline-block !important;
  fill: #FFFFFF !important;
  stroke: #FFFFFF !important;
  stroke-width: 1.7 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.send-svg path:last-child {
  fill: none !important;
  stroke: #3D7EFF !important;
  stroke-width: 1.8 !important;
}
.disclaimer {
  margin-top: 30px !important;
  padding-top: 0 !important;
  width: 100% !important;
  text-align: center !important;
  color: #999999 !important;
  font-size: 13px !important;
  line-height: 24px !important;
}
@media(max-width:1360px){
  .bottom-container{
    height:260px !important;
    min-height:260px !important;
    flex-basis:260px !important;
    margin-top:36px !important;
    gap:20px !important;
  }
  .bottom-container .side-card,
  .bottom-container .input-card{
    height:260px !important;
    min-height:260px !important;
  }
  .bottom-container .flat-orbit{transform:scale(1.34) !important;}
  .bottom-container .matrix-graphic{transform:rotate(-3deg) scale(1.34) !important;}
}


/* [????] ??????????????? */
.main-content{
  padding-top: 92px !important;
  padding-bottom: 18px !important;
}
.bottom-container{
  margin-top: 46px !important;
  height: 280px !important;
  min-height: 280px !important;
  flex: 0 0 280px !important;
  align-items: stretch !important;
}
.bottom-container .side-card,
.bottom-container .input-card{
  height: 280px !important;
  min-height: 280px !important;
}
.bottom-container .side-card{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#FFFFFF !important;
  border:1px solid #EAEAEA !important;
  box-shadow:0 12px 34px rgba(20,60,120,.075) !important;
  overflow:hidden !important;
}
/* ?????????????? */
.flat-orbit,
.matrix-graphic{display:none !important;}

/* ???? CSS ??????/?????? */
.atom-graphic{
  position:relative;
  width:210px;
  height:210px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.atom-ring{
  position:absolute;
  left:50%;
  top:50%;
  border-radius:50%;
  border:1px solid rgba(61,126,255,.22);
  transform:translate(-50%,-50%);
}
.atom-ring-outer{width:190px;height:190px;}
.atom-ring-inner{width:132px;height:132px;border-color:rgba(61,126,255,.18);}
.atom-core{
  position:relative;
  z-index:2;
  width:76px;
  height:76px;
  border-radius:50%;
  background:linear-gradient(135deg,#3D7EFF 0%,#6B9EFF 100%);
  box-shadow:0 8px 18px rgba(61,126,255,.14);
}
.atom-dot{
  position:absolute;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#1554C8;
  box-shadow:0 0 0 5px rgba(61,126,255,.08);
}
.atom-dot-a{right:21px;top:38px;}
.atom-dot-b{left:5px;top:62px;}
.atom-dot-c{right:27px;bottom:11px;width:7px;height:7px;}

/* ????? 3x3 CSS Grid ???? */
.data-matrix{
  width:218px;
  height:218px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  grid-template-rows:repeat(3,1fr);
  gap:12px;
  padding:30px;
  align-items:stretch;
  justify-items:stretch;
}
.data-matrix span{
  display:block;
  width:100%;
  aspect-ratio:1/1;
  border-radius:8px;
  background:rgba(61,126,255,.08);
  box-shadow:inset 0 0 0 1px rgba(61,126,255,.04);
}
.data-matrix span:nth-child(1),
.data-matrix span:nth-child(5),
.data-matrix span:nth-child(7),
.data-matrix span:nth-child(9){
  background:#3D7EFF;
  box-shadow:0 6px 14px rgba(61,126,255,.14);
}
.disclaimer{
  margin-top:auto !important;
  padding-top:20px !important;
  margin-bottom:0 !important;
}
@media(max-width:1360px){
  .main-content{padding-top:78px !important;}
  .atom-graphic{width:190px;height:190px;}
  .atom-ring-outer{width:172px;height:172px;}
  .atom-ring-inner{width:120px;height:120px;}
  .atom-core{width:68px;height:68px;}
  .data-matrix{width:196px;height:196px;padding:27px;gap:11px;}
}


/* [????] ????????????? */
.main-content,
.right-main-content{
  padding-top: 140px !important;
  padding-bottom: 16px !important;
}
.hero-area h1{
  margin-top: 0 !important;
  margin-bottom: 40px !important;
}
.quick-questions{
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.bottom-container{
  margin-top: 45px !important;
  height: 280px !important;
  min-height: 280px !important;
  flex: 0 0 280px !important;
}
.bottom-container .side-card{
  padding: 20px !important;
}
.bottom-container .atom-graphic{
  width: 252px !important;
  height: 252px !important;
  transform: none !important;
}
.bottom-container .atom-ring-outer{
  width: 228px !important;
  height: 228px !important;
}
.bottom-container .atom-ring-inner{
  width: 158px !important;
  height: 158px !important;
}
.bottom-container .atom-core{
  width: 92px !important;
  height: 92px !important;
}
.bottom-container .atom-dot-a{right:26px !important;top:45px !important;width:9px !important;height:9px !important;}
.bottom-container .atom-dot-b{left:7px !important;top:74px !important;width:9px !important;height:9px !important;}
.bottom-container .atom-dot-c{right:32px !important;bottom:13px !important;width:8px !important;height:8px !important;}
.bottom-container .data-matrix{
  width: 262px !important;
  height: 262px !important;
  padding: 30px !important;
  gap: 15px !important;
  transform: none !important;
}
.bottom-container .data-matrix span{
  border-radius: 9px !important;
}
.disclaimer{
  margin-top: auto !important;
  padding-top: 18px !important;
  margin-bottom: 0 !important;
}
@media(max-width:1360px){
  .main-content,
  .right-main-content{
    padding-top: 118px !important;
  }
  .hero-area h1{margin-bottom:34px !important;}
  .bottom-container{margin-top:40px !important;height:260px !important;min-height:260px !important;flex-basis:260px !important;}
  .bottom-container .atom-graphic{width:220px !important;height:220px !important;}
  .bottom-container .atom-ring-outer{width:200px !important;height:200px !important;}
  .bottom-container .atom-ring-inner{width:138px !important;height:138px !important;}
  .bottom-container .atom-core{width:80px !important;height:80px !important;}
  .bottom-container .data-matrix{width:228px !important;height:228px !important;padding:27px !important;gap:13px !important;}
}


/* [????] ????????????????? */
.main-content,
.right-main-content{
  padding-top: 220px !important;
  padding-bottom: 20px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: center !important;
}
.main-title,
.hero-area h1{
  margin-top: 0 !important;
  margin-bottom: 50px !important;
}
.cards-container,
.quick-questions{
  margin-top: 0 !important;
  margin-bottom: 60px !important;
}
.bottom-container{
  margin-top: 0 !important;
  height: 280px !important;
  min-height: 280px !important;
  flex: 0 0 280px !important;
}
.disclaimer{
  margin-top: auto !important;
  padding-top: 0 !important;
  padding-bottom: 20px !important;
  margin-bottom: 0 !important;
  width: 100% !important;
  text-align: center !important;
}
@media(max-height:850px){
  .main-content,
  .right-main-content{
    padding-top: 190px !important;
  }
  .main-title,
  .hero-area h1{margin-bottom:42px !important;}
  .cards-container,
  .quick-questions{margin-bottom:50px !important;}
}
@media(max-width:1360px){
  .main-content,
  .right-main-content{
    padding-top: 190px !important;
  }
  .main-title,
  .hero-area h1{margin-bottom:42px !important;}
  .cards-container,
  .quick-questions{margin-bottom:50px !important;}
}


/* [??????] ?????????????? */
.bottom-container .side-card{
  height:280px !important;
  min-height:280px !important;
  background:#FFFFFF !important;
  border:1px solid #EAEAEA !important;
  border-radius:24px !important;
  box-shadow:0 12px 34px rgba(20,60,120,.075) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  padding:0 !important;
}
/* ??/??? CSS ???????????????? */
.atom-graphic,
.data-matrix,
.flat-orbit,
.matrix-graphic{
  display:none !important;
}
.dialog-side-img{
  display:block !important;
  max-height:none !important;
  object-fit:contain !important;
  user-select:none !important;
  pointer-events:none !important;
}
/* ????????????? */
.dialog-side-img-left{
  width:85% !important;
  height:auto !important;
  position:relative !important;
  top:18px !important;
  margin-top:0 !important;
}
/* ????????????????????? */
.dialog-side-img-right{
  width:70% !important;
  height:auto !important;
  position:relative !important;
  top:-16px !important;
  margin-top:0 !important;
}
.disclaimer{
  margin-top:auto !important;
  padding-bottom:20px !important;
}
@media(max-width:1360px){
  .dialog-side-img-left{width:84% !important;top:16px !important;}
  .dialog-side-img-right{width:69% !important;top:-14px !important;}
}


/* [??????] ??????????????? */
.main-content,
.right-main-content{
  background:
    radial-gradient(circle at 10% 10%, rgba(219,234,254,.68) 0%, rgba(219,234,254,.38) 18%, transparent 42%),
    radial-gradient(circle at 90% 5%, rgba(243,232,255,.72) 0%, rgba(243,232,255,.40) 20%, transparent 46%),
    radial-gradient(circle at 76% 88%, rgba(221,238,255,.32) 0%, transparent 38%),
    #F8FAFC !important;
  background-attachment:fixed !important;
}
.tech-bg{
  opacity:.4 !important;
  z-index:0 !important;
}
.tech-bg:before{opacity:.24 !important;}
.tech-bg:after{opacity:.86 !important;}

/* ????????????????????????????? */
.bottom-container .side-card,
.bottom-container .left-decor,
.bottom-container .right-decor{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  border-radius:0 !important;
  padding:0 !important;
  overflow:visible !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
.bottom-container .input-card{
  position:relative !important;
  z-index:2 !important;
}
.dialog-side-img{
  display:block !important;
  height:auto !important;
  max-width:none !important;
  object-fit:contain !important;
  user-select:none !important;
  pointer-events:none !important;
  position:relative !important;
  z-index:1 !important;
}
.left-image,
.dialog-side-img-left{
  width:180px !important;
  height:auto !important;
  margin-top:30px !important;
  top:0 !important;
  filter:drop-shadow(0 10px 20px rgba(61,126,255,.10)) !important;
}
.right-image,
.dialog-side-img-right{
  width:140px !important;
  height:auto !important;
  margin-top:-20px !important;
  top:0 !important;
  filter:drop-shadow(0 10px 20px rgba(61,126,255,.08)) !important;
}
@media(max-width:1360px){
  .left-image,.dialog-side-img-left{width:166px !important;margin-top:26px !important;}
  .right-image,.dialog-side-img-right{width:130px !important;margin-top:-18px !important;}
}


/* [???] ?????????? */
.report-page .quick-card.report-card{
  font-size:20px !important;
  line-height:30px !important;
  min-height:108px !important;
  letter-spacing:.5px !important;
}
.report-page .mode-tab.active .chart-svg{
  stroke:#FFFFFF !important;
}
.report-page .input-panel textarea{
  font-size:18px !important;
  line-height:32px !important;
}
.report-page .input-panel textarea::placeholder{
  color:#9FAABC !important;
}


/* [?????????] ?????????????? + ?????? */
.report-page .report-metrics{
  grid-template-columns:repeat(3,1fr) !important;
  gap:22px !important;
  width:min(1340px,100%) !important;
}
.report-page .quick-card.report-card{
  min-height:126px !important;
  padding:24px 34px !important;
  border-radius:34px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  background:linear-gradient(135deg,rgba(219,239,255,.94) 0%,rgba(238,236,255,.94) 100%) !important;
  box-shadow:0 14px 34px rgba(61,126,255,.12), inset 0 1px 0 rgba(255,255,255,.78) !important;
  color:#143D8F !important;
  white-space:normal !important;
}
.report-page .quick-card.report-card strong{
  display:block !important;
  margin-bottom:8px !important;
  font-size:20px !important;
  line-height:28px !important;
  font-weight:800 !important;
  color:#123A8A !important;
}
.report-page .quick-card.report-card span{
  display:block !important;
  max-width:92% !important;
  font-size:14px !important;
  line-height:22px !important;
  font-weight:500 !important;
  color:#2F5DAE !important;
}
@media(max-width:1360px){
  .report-page .quick-card.report-card{
    min-height:118px !important;
    padding:22px 24px !important;
    border-radius:32px !important;
  }
  .report-page .quick-card.report-card strong{font-size:19px !important;line-height:26px !important;}
  .report-page .quick-card.report-card span{font-size:13px !important;line-height:20px !important;max-width:96% !important;}
}