*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#171615}body{color:#f9efe6;font-family:'KaiTi','STKaiti',serif}.study{position:relative;width:100%;height:100svh;min-height:540px;overflow:hidden;isolation:isolate;container-type:size;background:#191817}.art-plate{position:absolute;inset:0;z-index:-2;background:url("/site/capability-study/background-plate.webp") center/100% 100% no-repeat}.site-header{position:absolute;left:2.7%;right:6%;top:1.1%;height:6%;display:flex;align-items:center;justify-content:space-between;z-index:8}.logo{display:flex;gap:.12em;align-items:center;font:italic 700 3.2cqw/1 'Segoe Print',cursive;color:#fdf5ee;text-decoration:none;transform:rotate(-8deg);white-space:nowrap}.logo span{font:400 3.6cqw/1 Georgia;color:#f04b88}.site-header nav{width:66%;display:flex;justify-content:space-between;gap:2cqw;align-items:center}.site-header nav a{position:relative;color:#f6eee7;text-decoration:none;white-space:nowrap;font:400 1.35cqw/1.5 Arial,sans-serif;letter-spacing:.015em}.site-header nav a[aria-current]{font-weight:700}.site-header nav a[aria-current]:after{content:'';position:absolute;left:-4%;right:-4%;bottom:-.6cqh;height:.5cqh;background:#e94483;clip-path:polygon(0 30%,20% 0,55% 20%,92% 0,100% 65%,79% 100%,44% 65%,5% 100%)}
.page-heading{position:absolute;left:45.5%;top:8%;width:29%;text-align:center;z-index:6}.page-heading h1{display:flex;align-items:center;justify-content:center;white-space:nowrap;margin:0;gap:.04em;letter-spacing:-.035em;font:italic 700 4cqw/1.12 'STKaiti','KaiTi',serif}.page-heading h1 em{font:italic 6cqw/1 Georgia}.page-heading p{font:400 1.23cqw/1 Arial,sans-serif;letter-spacing:.07em;margin:.5cqh 0 0}
.group-title{position:absolute;z-index:6;margin:0;text-align:center;color:#100d0e;font:italic 700 5.2cqw/1 Georgia,'Times New Roman',serif;letter-spacing:-.04em;pointer-events:none}.think{left:6%;top:25.3%;width:22.5%;transform:rotate(-14deg)}.build{left:73.7%;top:26.3%;width:21%;transform:rotate(-12deg)}
.main-ip{position:absolute;left:27.6%;top:9.5%;width:46%;height:88.8%;object-fit:fill;object-position:bottom;z-index:3;pointer-events:none;filter:drop-shadow(4px 0 #efe4d6) drop-shadow(-4px 0 #efe4d6) drop-shadow(0 -4px #efe4d6) drop-shadow(0 4px #efe4d6)}
.note{position:absolute;z-index:5;display:flex;align-items:center;gap:5%;border:0;padding:1cqh 1.2cqw;background:transparent;color:#0d0c0b;text-align:left;cursor:pointer;border-radius:3px;transition:filter .2s,background-color .2s,translate .2s}.note:before{content:'';position:absolute;inset:0;border:1px solid transparent;transition:border-color .2s,background-color .2s;z-index:-1}.note:hover:before{border-color:#df538a88;background:#f7d2df38}.note:hover{translate:0 -3px}.note .chapter-icon{width:24%;height:7cqh;flex:0 0 24%;overflow:visible}.note-copy{display:block;flex:1;min-width:0}.note strong{display:block;font:700 2.06cqw/1.2 'STKaiti','KaiTi',serif;white-space:nowrap}.note small{display:block;margin-top:.8cqh;font:400 1.36cqw/1.35 'STKaiti','KaiTi',serif;letter-spacing:.025em;white-space:nowrap}
.note-0{left:13.7%;top:35.9%;width:19.8%;height:12.5%;transform:rotate(-8deg)}.note-1{left:14.8%;top:51.3%;width:19.8%;height:12.5%;transform:rotate(-7deg)}.note-2{left:15.5%;top:66.6%;width:19.8%;height:12.8%;transform:rotate(-7deg)}.note-3{left:73.5%;top:37.5%;width:22.1%;height:12.2%;transform:rotate(-6deg)}.note-4{left:73.1%;top:52.3%;width:22.2%;height:12.6%;transform:rotate(-5deg)}.note-5{left:72.4%;top:66.6%;width:23%;height:12.8%;transform:rotate(-5deg)}
.mobile-caption{display:none}a:focus-visible,button:focus-visible{outline:3px solid #ff5f9e;outline-offset:5px}dialog{width:min(620px,92vw);max-height:85svh;overflow:auto;padding:38px;border:1px solid #bc9d8b;border-radius:4px;color:#231c20;background:#eee2d5;box-shadow:0 28px 110px #0008}dialog::backdrop{background:#090608c9;backdrop-filter:blur(5px)}.close{position:absolute;right:13px;top:10px;border:0;background:transparent;font:30px Arial;color:#171315;cursor:pointer}.detail-eyebrow{color:#95405f;font:12px Arial;letter-spacing:.15em}.detail-body{font:20px/1.8 'KaiTi',serif}.detail-navigation{margin-top:30px;padding-top:18px;border-top:1px solid #31252030;display:flex;align-items:center;justify-content:space-between;gap:10px}.detail-navigation button{background:transparent;border:0;padding:10px 0;color:#7a2e4f;font:15px 'Microsoft YaHei',sans-serif;cursor:pointer}.detail-navigation button:disabled{opacity:.35;cursor:default}.detail-count{font:12px Arial;color:#7f6d66}
@media(max-width:760px){.study{display:flex;flex-direction:column;gap:18px;height:auto;min-height:100svh;padding:95px 20px 40px;container-type:normal;background:radial-gradient(ellipse at 50% 24%,#58384044,transparent 50%),#191817}.art-plate{height:580px;background-size:auto 100%;opacity:.45;mask-image:linear-gradient(#000 70%,transparent)}.site-header{top:0;left:20px;right:20px;height:74px;gap:20px}.logo{font-size:27px}.logo span{font-size:35px}.site-header nav{width:60%;overflow-x:auto;justify-content:start;gap:18px;padding:10px 0}.site-header nav a{font-size:11px}.site-header nav a[aria-current]:after{bottom:-5px;height:3px}.page-heading{position:relative;inset:auto;width:100%;order:0}.page-heading h1{font-size:32px}.page-heading h1 em{font-size:58px}.page-heading p{font-size:12px;margin:8px 0}.main-ip{position:relative;inset:auto;order:1;width:100%;height:450px;object-fit:contain;filter:drop-shadow(3px 0 #ede1d5) drop-shadow(-3px 0 #ede1d5);margin:0}.group-title{position:relative;inset:auto;width:85%;align-self:center;background:#ee76a0;padding:12px 20px;clip-path:polygon(1% 5%,15% 0,38% 4%,66% 0,99% 6%,97% 50%,100% 96%,75% 100%,30% 96%,0 100%,3% 45%);font-size:43px;transform:rotate(-5deg);margin:12px 0}.think{order:2}.build{order:6}.note{position:relative;inset:auto;width:100%;height:145px;min-height:145px;padding:18px 20px;background:#eee2d5;clip-path:polygon(1% 5%,15% 0,38% 4%,66% 0,99% 6%,97% 50%,100% 96%,75% 100%,30% 96%,0 100%,3% 45%);transform:rotate(-2deg)}.note .chapter-icon{height:55px;width:20%;flex-basis:20%}.note strong{font-size:27px}.note small{font-size:17px;margin-top:8px}.note-0{order:3}.note-1{order:4;transform:rotate(2deg)}.note-2{order:5}.note-3{order:7}.note-4{order:8;transform:rotate(2deg)}.note-5{order:9}.mobile-caption{display:block;order:10;text-align:center;font-size:18px;color:#d8c4c8;padding-top:20px}.detail-body{font-size:18px}dialog{padding:28px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* Match the reference typography and navigation rhythm. */
@media(min-width:761px){.logo{font-size:2.5cqw;font-weight:400}.logo span{font-size:2.7cqw}.site-header nav{position:absolute;left:23.8%;width:56.3%}.group-title{font-size:4.7cqw;font-weight:400;letter-spacing:-.05em}.note small{font-size:1.2cqw;letter-spacing:.01em}.note-0 .note-copy{margin-left:-.1cqw}.page-heading{top:7.3%}}
