:root{
  --paper:#f4eadb;
  --paper-2:#fbf6ec;
  --ink:#211a15;
  --muted:#786b5e;
  --soft:#e7d8c2;
  --line:#dccab0;
  --clay:#a65f3f;
  --clay-dark:#7f432c;
  --card:rgba(255,250,241,.78);
  --white:#fffaf2;
  --shadow:0 24px 70px rgba(83,54,31,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",Arial,sans-serif;
  background:
    radial-gradient(circle at 82% 12%, rgba(166,95,63,.16), transparent 24rem),
    radial-gradient(circle at 16% 8%, rgba(89,65,43,.08), transparent 22rem),
    linear-gradient(180deg,var(--paper-2),var(--paper));
  min-height:100vh;
}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;opacity:.22;
  background-image:linear-gradient(rgba(60,40,25,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(60,40,25,.04) 1px,transparent 1px);
  background-size:28px 28px;
  mask-image:linear-gradient(180deg,#000,transparent 82%);
}
a{color:inherit;text-decoration:none}
.wrap{width:min(1120px,calc(100% - 40px));margin:0 auto}
.nav{height:82px;display:flex;align-items:center;justify-content:space-between;gap:22px;position:relative;z-index:2}
.brand{display:flex;align-items:center;gap:12px;min-width:150px}
.brand img{width:122px;height:auto;display:block;mix-blend-mode:multiply}
.links{display:flex;align-items:center;gap:7px;font-size:15px;color:#594d42;letter-spacing:.04em}
.links a{padding:10px 13px;border-radius:999px}
.links a:hover,.links a.active{background:rgba(255,250,242,.72);box-shadow:inset 0 0 0 1px rgba(220,202,176,.7)}
.nav-actions{display:flex;align-items:center;gap:10px}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:12px 18px;font-weight:650;border:1px solid transparent;line-height:1;white-space:nowrap}
.btn.primary{background:var(--clay);color:#fff7ef;box-shadow:0 12px 28px rgba(127,67,44,.22)}
.btn.primary:hover{background:var(--clay-dark)}
.btn.ghost{background:rgba(255,250,242,.66);border-color:var(--line);color:#3d3027}
.btn.text{padding:10px 8px;color:#66584c}
.hero{display:grid;grid-template-columns:1.04fr .96fr;gap:42px;align-items:center;padding:72px 0 54px}
.kicker{display:inline-flex;align-items:center;gap:8px;color:var(--clay-dark);background:rgba(255,250,242,.68);border:1px solid var(--line);border-radius:999px;padding:8px 12px;font-size:14px;margin-bottom:20px;letter-spacing:.08em}
h1,h2,h3{font-family:"Noto Serif SC","Source Han Serif SC","Songti SC","STSong","SimSun",serif;margin:0;color:#1f1712;font-weight:600}
h1{font-size:72px;letter-spacing:.02em;line-height:1.06;margin-bottom:18px}
.hero p,.lead{font-size:20px;line-height:1.9;color:var(--muted);margin:0;max-width:680px;letter-spacing:.02em}
.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
.hero-art,.panel{background:linear-gradient(145deg,rgba(255,250,242,.88),rgba(238,224,201,.68));border:1px solid rgba(220,202,176,.9);border-radius:34px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.hero-art{min-height:430px;padding:32px}
.go-board{position:absolute;inset:38px;border:1px solid rgba(98,71,48,.2);background-image:linear-gradient(rgba(89,63,40,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(89,63,40,.18) 1px,transparent 1px);background-size:52px 52px;border-radius:22px;opacity:.58}
.stone{position:absolute;width:148px;height:148px;border-radius:50%;right:98px;top:88px;background:
  radial-gradient(circle at 34% 26%,rgba(255,255,250,.95) 0 10%,transparent 24%),
  radial-gradient(circle at 78% 76%,rgba(38,32,26,.34) 0 8%,rgba(85,68,52,.18) 18%,transparent 34%),
  radial-gradient(circle at 42% 34%,#fffdf4 0,#f4ecdf 48%,#d9ccb8 78%,#b9a98f 100%);
box-shadow:
  0 26px 42px rgba(80,58,32,.16),
  0 8px 16px rgba(80,58,32,.12),
  inset -12px -16px 28px rgba(116,91,62,.17),
  inset 9px 10px 20px rgba(255,255,255,.76);
transform:scaleY(.88);}
.stone:after{content:"";position:absolute;left:18%;right:18%;bottom:-16px;height:20px;border-radius:50%;background:rgba(80,58,32,.16);filter:blur(9px);z-index:-1}
.note{position:absolute;left:38px;bottom:38px;right:120px;background:rgba(255,252,246,.78);border:1px solid rgba(220,202,176,.8);border-radius:22px;padding:22px;color:#5c4c3e;line-height:1.8}.note strong{display:block;color:#2a211a;margin-bottom:8px}.dot{width:7px;height:7px;background:#31251d;border-radius:50%;position:absolute;opacity:.5}.d1{left:142px;top:140px}.d2{right:154px;bottom:142px}.d3{left:248px;bottom:196px}
.section{padding:44px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:22px}.section h2{font-size:42px;letter-spacing:.03em}.section p{color:var(--muted);line-height:1.75}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.grid.two{grid-template-columns:repeat(2,1fr)}.card{background:var(--card);border:1px solid rgba(220,202,176,.86);border-radius:26px;padding:24px;box-shadow:0 16px 42px rgba(83,54,31,.07)}.card h3{font-size:23px;margin-bottom:10px;letter-spacing:.03em}.card p{margin:0}.badge{display:inline-flex;border:1px solid rgba(166,95,63,.26);background:rgba(166,95,63,.08);color:var(--clay-dark);border-radius:999px;padding:6px 10px;font-size:13px;margin-bottom:16px}.muted{color:var(--muted)}
.footer{padding:44px 0 58px;color:#8a7b6d;border-top:1px solid rgba(220,202,176,.7);margin-top:34px}.footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.page-hero{padding:56px 0 32px}.page-hero h1{font-size:58px;letter-spacing:.03em}.shell{padding:22px;background:rgba(255,250,242,.45);border:1px solid rgba(220,202,176,.8);border-radius:34px;box-shadow:var(--shadow)}
.chat-layout{display:grid;grid-template-columns:1fr 280px;gap:18px}.chat-main{min-height:560px;display:flex;flex-direction:column}.chat-top{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-bottom:20px}.select{border:1px solid var(--line);border-radius:999px;background:#fff9ef;padding:10px 14px;color:#4e4035}.welcome{margin:auto;text-align:center;max-width:650px}.welcome h2{font-size:42px;letter-spacing:.02em}.chips{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:24px}.chip{padding:10px 14px;border-radius:999px;background:#fff9ef;border:1px solid var(--line);color:#5d5045}.input{margin-top:auto;display:flex;gap:10px;border:1px solid var(--line);background:#fffaf3;border-radius:24px;padding:10px}.input span{flex:1;color:#9a8b7b;padding:13px}.side-card{height:max-content}.code{font-family:"SFMono-Regular",Consolas,monospace;background:#2a211b;color:#fff2df;border-radius:18px;padding:18px;overflow:auto;line-height:1.7}.model-card{display:flex;flex-direction:column;gap:12px}.tool-grid{grid-template-columns:repeat(3,1fr)}
@media(max-width:860px){.nav{height:auto;padding:18px 0;align-items:flex-start}.links{display:none}.hero,.chat-layout{grid-template-columns:1fr}.hero{padding-top:34px}h1{font-size:48px}.page-hero h1{font-size:44px}.grid,.grid.two,.tool-grid{grid-template-columns:1fr}.section-head{display:block}.hero-art{min-height:320px}.nav-actions .btn.text{display:none}}

.messages{flex:1;overflow:auto;padding:8px 4px 18px;display:flex;flex-direction:column;gap:16px;min-height:340px}
.msg{max-width:82%;border:1px solid rgba(220,202,176,.86);border-radius:22px;padding:14px 16px;background:rgba(255,250,242,.72);box-shadow:0 10px 28px rgba(83,54,31,.06)}
.msg.user{align-self:flex-end;background:rgba(166,95,63,.1);border-color:rgba(166,95,63,.25)}
.msg.assistant{align-self:flex-start}.msg-role{font-size:13px;color:var(--clay-dark);margin-bottom:7px;letter-spacing:.08em}.msg-body{line-height:1.8;color:#332820;white-space:normal}.input textarea{flex:1;border:0;outline:0;resize:none;background:transparent;color:#332820;padding:13px;font:inherit;line-height:1.5;min-height:48px}.input button:disabled{opacity:.55;cursor:not-allowed}.chip{cursor:pointer;font:inherit}.select{outline:0;cursor:pointer}
.chat-controls{display:flex;gap:10px;flex-wrap:wrap}.generated-image{display:block;max-width:min(420px,100%);border-radius:18px;margin-top:12px;border:1px solid rgba(220,202,176,.86);box-shadow:0 16px 38px rgba(83,54,31,.12)}
/* tutorial additions */
.grid.three{grid-template-columns:repeat(3,1fr)}
.docs-page code{font-family:"SFMono-Regular",Consolas,monospace;background:rgba(255,250,242,.9);border:1px solid rgba(220,202,176,.8);border-radius:8px;padding:2px 6px;color:#5a321f}
.docs-hero{padding-bottom:20px}
.quick-start{padding-top:18px}
.step-card{position:relative;min-height:190px}
.step-num{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:var(--clay);color:#fff7ef;font-weight:800;margin-bottom:16px;box-shadow:0 10px 24px rgba(127,67,44,.18)}
.tutorial-block{scroll-margin-top:24px}
.tutorial-block .card{height:100%}
.clean-list{margin:10px 0 0;padding-left:22px;color:var(--muted);line-height:1.9}
.clean-list li{margin:4px 0}
.soft-panel{margin-top:18px;background:linear-gradient(145deg,rgba(255,250,242,.88),rgba(246,235,216,.72))}
.warning-panel{border-color:rgba(166,95,63,.32);background:linear-gradient(145deg,rgba(255,248,235,.95),rgba(246,224,205,.72))}
.faq-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:10px}
.faq-grid strong{display:block;color:#2a211a;margin-bottom:8px;font-size:16px}.faq-grid p{margin:0;color:var(--muted);line-height:1.75}
.feature-card{position:relative;overflow:hidden}.feature-card:after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-70px;bottom:-70px;background:rgba(166,95,63,.08)}
.mini-list{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.mini-list span{border:1px solid var(--line);background:#fff9ef;border-radius:999px;padding:7px 10px;color:#5c4c3e;font-size:13px}
.muted-card{opacity:.72}.muted-badge{background:rgba(120,107,94,.08);border-color:rgba(120,107,94,.2);color:#786b5e}
@media(max-width:860px){.grid.three,.faq-grid{grid-template-columns:1fr}.docs-page .code{font-size:13px}}

/* pricing-note */
.pricing-note{margin-top:34px}
.price-card{display:grid;grid-template-columns:1.15fr 1fr;gap:24px;align-items:start}
.price-main h3{font-size:32px;margin:12px 0 10px;color:#2f2a24}
.price-points{display:grid;gap:12px}
.price-points div{background:#fff7ec;border:1px solid #ead8c0;border-radius:16px;padding:14px 16px}
.price-points strong{display:block;margin-bottom:5px;color:#2f2a24}
.price-points span{color:#7b6a5e;font-size:14px}
.price-example{grid-column:1/-1;background:#2f2a24;color:#fff7ec;border-radius:18px;padding:16px 18px;display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.price-example strong,.price-example span{color:#fff7ec}
@media(max-width:760px){.price-card{grid-template-columns:1fr}.price-main h3{font-size:26px}}