:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:#183047;background:#f4f7f8;font-synthesis:none}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-width:320px}
button,input,select{font:inherit}
button{cursor:pointer}
a{color:inherit}
[hidden]{display:none!important}
.shell{width:min(1180px,calc(100% - 44px));margin-inline:auto}
.site-header{background:#fff;border-bottom:1px solid #e4e9ed}
.header-inner{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;line-height:1.08}
.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#0e777a;color:#fff;font-family:Georgia,serif;font-size:28px;font-weight:700}
.brand strong{display:block;font-size:18px;letter-spacing:-.035em;color:#14243a}
.brand small{display:block;margin-top:4px;color:#6a7c8b;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.header-actions{display:flex;align-items:center;gap:27px;color:#3c5265;font-size:13px;font-weight:700}
.header-actions a{text-decoration:none}
.header-actions a:hover,.text-button:hover{color:#0e777a}
.text-button{border:0;background:none;padding:8px;color:inherit;font-size:inherit;font-weight:inherit}
.hero{background:radial-gradient(circle at 76% 18%,#2a4c63 0,#14283c 37%,#102235 75%);color:#fff;overflow:hidden}
.hero-inner{display:grid;grid-template-columns:1.08fr .92fr;align-items:center;min-height:390px;gap:25px}
.hero-copy{position:relative;z-index:2;padding:46px 0 54px}
.eyebrow,.kicker,.summary-label{font-size:11px;letter-spacing:.17em;font-weight:800}
.eyebrow{color:#b8d8d5;display:inline-flex;align-items:center;gap:9px}
.dot{width:7px;height:7px;border-radius:50%;background:#76d9c6;box-shadow:0 0 0 4px #76d9c625}
.hero h1{font-size:clamp(36px,4.5vw,60px);line-height:1.08;letter-spacing:-.055em;font-weight:750;margin:21px 0 18px}
.hero h1 em{font-style:normal;color:#8cdbce}
.hero p{font-size:16px;line-height:1.65;color:#c8d4df;max-width:540px;margin:0 0 26px}
.hero-link{display:inline-flex;align-items:center;gap:20px;background:#fff;color:#173746;border-radius:10px;padding:13px 17px;font-size:13px;font-weight:800;text-decoration:none;box-shadow:0 9px 22px #07152138}
.hero-link:hover{background:#dcf5ee}
.hero-visual{height:350px;position:relative;align-self:stretch}
.orbit{position:absolute;border:1px solid #a6d1d638;border-radius:50%;display:block}
.orbit-one{width:330px;height:330px;top:6px;right:54px}
.orbit-two{width:245px;height:245px;top:49px;right:96px}
.visual-card{position:absolute;top:58px;right:120px;width:215px;height:117px;background:#f9fcfc;border:1px solid #c7e0de;border-radius:14px;box-shadow:0 18px 38px #06162350;transform:rotate(-9deg);padding:17px;color:#163c47}
.visual-card.lower{top:184px;right:17px;transform:rotate(8deg)}
.visual-card span{font-size:11px;color:#128783;font-weight:800}
.visual-card strong{display:block;margin:7px 0 10px;font-size:13px}
.visual-card i{display:block;width:85%;height:5px;background:#dce8e9;border-radius:6px;margin-top:8px}
.visual-card i:last-child{width:57%}
.formula{position:absolute;color:#b7e5dc;font-family:Georgia,serif;font-style:italic}
.formula-one{right:31px;top:67px;font-size:24px;transform:rotate(11deg)}
.formula-two{right:345px;top:242px;font-size:26px;transform:rotate(-14deg)}
.work-area{padding-top:48px;padding-bottom:34px}
.section-intro{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:24px}
.kicker{color:#0b817e}
.section-intro h2,.result-heading h2{font-size:clamp(28px,3.2vw,37px);letter-spacing:-.045em;margin:7px 0 0;color:#152d41}
.section-intro p{max-width:410px;margin:0 0 3px;color:#647687;line-height:1.55;font-size:14px}
.builder-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;align-items:start;gap:21px}
.builder-main{display:grid;gap:17px}
.card,.summary-card,.notice,.preview-card{background:#fff;border:1px solid #e1e8eb;border-radius:18px;box-shadow:0 4px 18px #17354c08}
.card{padding:25px}
.card-heading{display:flex;align-items:flex-start;gap:14px;margin-bottom:20px}
.card-heading h3{font-size:20px;letter-spacing:-.035em;color:#152d41;margin:0 0 4px}
.card-heading p{font-size:13px;color:#738395;margin:0;line-height:1.5}
.step{flex:none;display:grid;place-items:center;width:28px;height:28px;background:#e0f2ed;color:#087773;border-radius:50%;font-size:13px;font-weight:800}
.option-grid,.tier-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.option{position:relative;display:flex;align-items:flex-start;gap:11px;padding:15px;border:1.5px solid #dce6e9;border-radius:12px;cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s}
.option:hover{border-color:#8dbdb5}
.option:has(input:checked){border-color:#0f8982;background:#f1fbf8;box-shadow:0 0 0 3px #0f898216}
.option input{accent-color:#0b827e;flex:none;margin:3px 0 0}
.option-body{min-width:0;display:block}
.option strong{display:block;color:#19354b;font-size:14px}
.option small{display:block;color:#697f8d;font-size:12px;line-height:1.45;margin-top:5px}
.topic-choice{margin-top:23px;padding-top:19px;border-top:1px solid #e9eef0}
.topic-choice>label,.catalog-content>label,.advanced label{display:block;font-size:12px;font-weight:800;color:#3a5162;margin-bottom:8px}
select,input[type=search],input[type=number],input[type=password],input[type=text]{width:100%;border:1px solid #cddce1;border-radius:10px;background:#fff;color:#19354b;padding:11px 12px;outline:none}
select{min-height:47px}
select:focus,input:focus{border-color:#0e8984;box-shadow:0 0 0 3px #0e89842b}
.field-help{font-size:12px;color:#708393;line-height:1.5;margin:8px 0 0}
.catalog{margin-top:13px}
.catalog summary,.advanced summary{color:#0b7775;font-size:12px;font-weight:800;cursor:pointer;list-style:none;display:inline-flex;gap:6px}
.catalog summary::-webkit-details-marker,.advanced summary::-webkit-details-marker{display:none}
.catalog-content{padding:16px 0 0}
.catalog input{margin-bottom:12px}
.topic-list{max-height:270px;overflow-y:auto;border:1px solid #e3eaed;border-radius:10px;padding:6px}
.topic-group{font-size:10px;font-weight:800;color:#778b99;letter-spacing:.1em;text-transform:uppercase;padding:10px 8px 5px}
.topic-item{display:flex;gap:9px;width:100%;border:0;background:none;text-align:left;padding:9px 8px;border-radius:7px;color:#1d3b4f;font-size:12px;line-height:1.3}
.topic-item:hover,.topic-item:focus-visible{background:#edf7f5}
.topic-item span:first-child{color:#0b817d;font-weight:800;min-width:24px}
.mode-detail{background:#f2f8f7;color:#456575;border-radius:10px;padding:13px 15px;margin:18px 0 0;font-size:13px;line-height:1.5}
.tier-option{min-height:102px}
.tier-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.tier-tag{background:#eef1f2;color:#758591;border-radius:100px;padding:4px 7px;font-size:9px;font-weight:800;letter-spacing:.08em;white-space:nowrap}
.tier-tag.accent{color:#04746e;background:#dff2ea}
.advanced{margin-top:17px}
.advanced label{margin-top:14px}
.advanced input{max-width:290px}
.action-card{background:#fdfefd}
.primary-button{border:0;border-radius:10px;background:#0c7978;color:#fff;padding:14px 18px;font-size:14px;font-weight:800;min-height:49px;display:inline-flex;align-items:center;justify-content:space-between;gap:28px;box-shadow:0 9px 17px #0b79752b}
.primary-button:hover{background:#096967}
.primary-button:disabled{cursor:wait;opacity:.65}
.status{min-height:1.3em;font-size:12px;color:#536d7e;margin:12px 0 0;line-height:1.45}
.status.error{color:#bd3e34}
.builder-side{display:grid;gap:15px;position:sticky;top:20px}
.summary-card{padding:25px;background:#173549;color:#fff;border-color:#173549}
.summary-label{color:#96d9cf}
.summary-card h3{font-size:22px;letter-spacing:-.035em;margin:12px 0 5px}
.summary-card>p{font-size:13px;color:#bbd1d7;line-height:1.5;min-height:40px;margin:0}
.summary-divider{height:1px;background:#ffffff2f;margin:18px 0}
.summary-row{display:flex;justify-content:space-between;gap:8px;font-size:12px;line-height:1.45;margin-top:15px}
.summary-row span{color:#bfd2d6}
.summary-row strong{text-align:right;font-weight:700;max-width:160px}
.notice{padding:21px;background:#fffdf7;border-color:#ece3c9}
.notice strong{font-size:13px;color:#775b1c}
.notice p{font-size:12px;color:#7b765e;line-height:1.58;margin:7px 0 0}
.result-section{padding:24px 0 72px}
.result-heading{display:flex;align-items:end;justify-content:space-between;gap:15px;margin-bottom:18px}
.result-heading p{margin:8px 0 0;color:#6b7d8a;font-size:13px}
.outline-button{border:1px solid #0b7b78;border-radius:10px;background:#fff;color:#0b7370;padding:11px 15px;font-size:13px;font-weight:800;white-space:nowrap}
.outline-button:hover{background:#eaf7f3}
.preview-card{overflow:hidden}
.preview-tabs{display:flex;border-bottom:1px solid #e4eaee;padding:0 20px;gap:24px}
.preview-tab{border:0;border-bottom:3px solid transparent;background:none;color:#687e8c;padding:16px 0 13px;font-size:13px;font-weight:800}
.preview-tab.active{border-color:#0a827e;color:#0b6868}
.preview-card iframe{display:block;width:100%;min-height:72vh;border:0;background:#fff}
.result-hint{font-size:12px;color:#6a7e8c;margin:10px 0}
.site-footer{border-top:1px solid #e0e7eb;background:#fff;color:#788b97;font-size:11px}
.site-footer .shell{display:flex;justify-content:space-between;gap:15px;padding-block:24px}
.login-page{min-height:100vh;background:radial-gradient(circle at 10% 0,#e5f5ef 0,transparent 35%),#f4f7f8}
.login-layout{min-height:calc(100vh - 82px);display:grid;place-items:center;padding:40px 20px}
.login-card{width:min(100%,430px);padding:34px}
.login-icon{width:45px;height:45px;display:grid;place-items:center;border-radius:12px;background:#e2f2ed;color:#0b7975;font-size:25px;margin-bottom:20px}
.login-card h1{font-size:27px;line-height:1.2;letter-spacing:-.04em;color:#173449;margin:0 0 10px}
.login-card p{color:#6b7e8b;font-size:13px;line-height:1.6;margin:0 0 22px}
.login-card label{display:block;font-size:12px;color:#375060;font-weight:800;margin-bottom:8px}
.login-card input{margin-bottom:14px}
.login-card .primary-button{width:100%}
.login-card .status{margin-bottom:0}
:focus-visible{outline:3px solid #34b4aa;outline-offset:3px}
@media(max-width:900px){.hero-inner{grid-template-columns:1fr}.hero-visual{display:none}.hero-inner{min-height:0}.builder-layout{grid-template-columns:1fr}.builder-side{position:static;grid-template-columns:1fr 1fr}.summary-card>p{min-height:0}}
@media(max-width:650px){.shell{width:min(100% - 26px,1180px)}.header-inner{min-height:70px}.brand-mark{width:37px;height:37px}.brand strong{font-size:16px}.brand small{font-size:9px}.header-actions{gap:12px;font-size:11px}.hero-copy{padding:40px 0 45px}.hero h1{font-size:37px}.hero p{font-size:14px}.work-area{padding-top:30px}.section-intro{display:block}.section-intro p{margin-top:10px}.card{padding:19px}.option-grid,.tier-grid,.builder-side{grid-template-columns:1fr}.option{padding:13px}.result-heading{align-items:start}.preview-tabs{gap:18px;padding:0 16px}.preview-tab{font-size:12px}.site-footer .shell{display:block}.site-footer .shell span{display:block;margin:4px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}