/* The first page is an illustrated farm entrance; all gameplay keeps its own layout. */
.profile-page{position:relative;isolation:isolate;min-height:100dvh;overflow:hidden;background:#e9f1d5;color:#365b45}
.intro-landscape{position:absolute;inset:0;z-index:-2;pointer-events:none}
.intro-landscape img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 55%}
.intro-landscape::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#fffdf42b 0%,#fffdf414 64%,#f5f6da55 100%)}
.profile-page>.farm-petals{z-index:2;--fall-distance:max(1100px,110dvh);opacity:.72}
.profile-page .profile-shell{position:relative;max-width:1060px;min-height:100dvh;padding:24px 38px 50px;display:flex;flex-direction:column}
.profile-shell .topbar{position:relative;z-index:3;flex-shrink:0;background:#fffdf1e8;border:1px solid #fffef6;border-radius:25px;box-shadow:0 4px 0 #6f8e7220,0 12px 32px #4d734818;padding:13px 20px;backdrop-filter:blur(10px)}
.profile-shell .iconbtn{background:#fffcf0;border-color:#d6dfbd;box-shadow:0 3px 0 #dce5c780;color:#50724e}
.profile-shell .musicbtn.off{color:#899285}
.profile-shell .intro{position:relative;z-index:1;margin:33px auto 27px;text-align:center;width:100%;max-width:650px}
.profile-shell .intro::before{content:'';position:absolute;inset:-18px -8% -22px;background:radial-gradient(ellipse,#fffdf1e8 20%,#fffdf1ab 48%,#fffdf100 72%);z-index:-1;pointer-events:none}
.intro-ribbon{display:inline-flex;align-items:center;justify-content:center;gap:12px;position:relative;padding:9px 24px;background:#fff5cd;color:#8d7043;border:1px solid #e6cc8b;border-radius:7px 7px 15px 15px;box-shadow:0 3px 0 #bbaa6820;font-family:Garden,Pretendard,sans-serif;font-size:17px}
.intro-ribbon::before,.intro-ribbon::after{content:'';position:absolute;top:7px;bottom:-5px;width:22px;background:#edcb88;z-index:-1}
.intro-ribbon::before{right:calc(100% - 8px);clip-path:polygon(0 0,100% 0,100% 100%,0 100%,28% 50%)}
.intro-ribbon::after{left:calc(100% - 8px);clip-path:polygon(0 0,100% 0,72% 50%,100% 100%,0 100%)}
.intro-ribbon>span{color:#c69146;font-size:20px}
.profile-shell .intro h1{font-size:clamp(42px,5.4vw,60px);letter-spacing:-1.4px;line-height:1.12;margin:19px 0 14px;color:#416b46;-webkit-text-stroke:5px #fffdf1;paint-order:stroke fill;text-shadow:0 4px 0 #c6d3a4,0 8px 18px #fffdf19c}
.profile-shell .intro h1 span{color:#dc8e4b}
.profile-shell .intro p{font-size:18px;line-height:1.6;color:#49664e;text-shadow:0 1px 3px #fff,0 0 12px #fffdf2;margin:0}
.profile-shell .intro p strong{font-weight:700}
.profile-shell .profile-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;width:100%;max-width:750px;margin:0 auto;align-items:stretch}
.profile-shell .profile-card{--card-accent:#639ca9;--card-dark:#416e79;--card-pale:#e5f0e7;position:relative;border:2px solid #99bfb6;border-radius:120px 120px 29px 29px;padding:7px;background:#fffcf1;overflow:hidden;box-shadow:0 7px 0 #77996746,0 18px 34px #36563822;text-align:left;outline-offset:6px;min-width:0}
.profile-shell .profile-card.ian{--card-accent:#d9a069;--card-dark:#996431;--card-pale:#fff0d3;border-color:#d5b27e;box-shadow:0 7px 0 #a6906646,0 18px 34px #36563822}
.profile-card-caption{position:absolute;left:50%;top:21px;transform:translateX(-50%);z-index:4;white-space:nowrap;font-family:Garden,Pretendard,sans-serif;font-size:16px;font-weight:400;letter-spacing:.5px;color:var(--card-dark);text-align:center}
.profile-card-caption>span{margin-left:3px;color:var(--card-accent);display:inline-block}
.profile-shell .profile-card .profile-art{height:clamp(335px,36dvh,470px);padding:44px 14px 7px;border-radius:112px 112px 17px 17px;background:radial-gradient(ellipse at 50% 35%,#fffdf4 28%,#fcf7e9 72%,var(--card-pale) 100%)}
.profile-shell .profile-art::after{content:'';position:absolute;inset:5px;border:1px solid #d6dfc7;border-radius:107px 107px 14px 14px;pointer-events:none;z-index:3}
.profile-shell .ian .profile-art::after{border-color:#ead7b8}
.profile-shell .profile-character{z-index:2}
.profile-shell .profile-halo{opacity:.7;background:radial-gradient(ellipse at 50% 65%,#e8f4d999,transparent 70%)}
.profile-shell .ian .profile-halo{background:radial-gradient(ellipse at 50% 65%,#ffebbd99,transparent 70%)}
.profile-shell .profile-ground{bottom:10px;background:#a1b78022;width:55%;left:22.5%}
.profile-shell .profile-particles{inset:42px 8px 15px;z-index:3}
.profile-shell .profile-particle:nth-child(3n){opacity:.72;animation-play-state:running}
.profile-shell .profile-card .profile-info{display:block;margin:0;padding:16px 17px 14px;border:0;background:transparent}
.profile-name-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.profile-shell .profile-info h2{font-size:34px;line-height:1.15;color:var(--card-dark);letter-spacing:.3px;margin:0}
.profile-star{display:inline-flex;gap:5px;align-items:center;border:1px solid #e9d49e;background:#fff8df;color:#846d3e;border-radius:12px;padding:5px 9px;font-family:Garden,Pretendard,sans-serif;font-size:17px;line-height:1}
.profile-star>span:first-child{color:#d9a43a}
.profile-shell .profile-card .profile-info p{font-size:15px;line-height:1.5;font-weight:600;color:#718068;margin:8px 0 14px;word-break:keep-all}
.profile-enter{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:49px;padding:8px 13px;background:var(--card-pale);border:1px solid #c6dbbe;border-radius:14px;color:var(--card-dark);font-family:Garden,Pretendard,sans-serif;font-size:21px;box-shadow:0 3px 0 #c0d0af3b}
.ian .profile-enter{border-color:#e9d1a5;box-shadow:0 3px 0 #dfc39835}
.profile-shell .circle-arrow{display:grid;place-items:center;width:29px;height:29px;min-width:29px;border:0;background:#fffdf1c9;color:var(--card-dark);font-family:Pretendard,sans-serif;font-size:23px}
.profile-shell .profile-selected-message{bottom:16px}
.profile-shell .intro-footer{position:relative;z-index:1;text-align:center;align-self:center;max-width:580px;padding:15px 28px;margin:30px 0 0;background:#fffcefde;border:1px solid #fffdf4;border-radius:23px;box-shadow:0 5px 20px #536b3510;backdrop-filter:blur(6px)}
.profile-shell .profile-interaction-note{font-family:Garden,Pretendard,sans-serif;font-size:19px;font-weight:400;color:#597d49;margin:0 0 9px;line-height:1.5;text-shadow:0 1px 2px #fffcf1}
.profile-interaction-note>span{color:#d6a23e;margin-right:4px}
.profile-shell .footnote{font-size:14px;line-height:1.6;font-weight:600;color:#66734f;margin:0;text-shadow:0 1px 2px #fff}
.profile-shell .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.profile-shell .save-warning{position:relative;z-index:3;background:#fffdf1;padding:10px;border-radius:12px}
.profile-shell .profile-card:focus-visible{outline:4px solid #67974b;box-shadow:0 0 0 9px #fff4ca,0 14px 30px #36563835}
.profile-shell .profile-card.is-chosen{border-color:#d8aa40;box-shadow:0 0 0 5px #fff3b9,0 14px 30px #36563835}
.profile-card.is-chosen .profile-enter{background:#ffeab0}
@media(hover:hover) and (pointer:fine){
  .profile-shell .profile-card:hover{transform:translateY(-6px);border-color:var(--card-accent);box-shadow:0 10px 0 #77996735,0 22px 36px #36563829}
  .profile-shell .profile-card:hover .profile-enter{filter:brightness(1.035)}
}
@media(min-width:651px) and (max-height:850px){
  .profile-page .profile-shell{padding-top:17px;padding-bottom:30px}
  .profile-shell .intro{margin-top:25px;margin-bottom:24px}
  .profile-shell .intro h1{font-size:43px;line-height:1.15}
  .profile-shell .intro h1 br{display:none}
  .profile-shell .intro h1 span{margin-left:9px}
  .profile-shell .intro p br{display:none}
  .profile-shell .intro p strong{margin-left:8px}
  .profile-shell .profile-grid{max-width:690px}
  .profile-shell .profile-card .profile-art{height:325px}
}
@media(min-width:651px) and (min-height:1250px){
  .profile-shell .intro{margin-top:48px;margin-bottom:34px}
  .profile-shell .profile-grid{gap:36px}
  .profile-shell .intro-footer{margin-top:38px}
}
@media(max-width:650px){
  .profile-page .profile-shell{padding:16px 20px 35px}
  .profile-shell .topbar{padding:10px 12px;border-radius:19px}
  .profile-shell .intro{margin:28px auto 22px}
  .intro-ribbon{font-size:15px;padding:7px 15px;gap:8px}
  .profile-shell .intro h1{font-size:44px;margin:17px 0 13px}
  .profile-shell .intro p{font-size:17px}
  .profile-shell .profile-grid{gap:18px;max-width:560px}
  .profile-shell .profile-card{padding:5px;border-radius:95px 95px 24px 24px}
  .profile-card-caption{font-size:14px;top:19px;letter-spacing:0}
  .profile-shell .profile-card .profile-art{height:clamp(290px,35dvh,400px);padding:42px 5px 7px;border-radius:89px 89px 15px 15px}
  .profile-shell .profile-art::after{border-radius:85px 85px 13px 13px;inset:4px}
  .profile-shell .profile-card .profile-info{padding:13px 10px 10px}
  .profile-shell .profile-info h2{font-size:30px}
  .profile-star{font-size:16px;padding:5px 7px;gap:3px}
  .profile-shell .profile-card .profile-info p{font-size:14px;margin:7px 0 12px}
  .profile-enter{font-size:19px;padding:7px 10px;min-height:47px;gap:4px}
  .profile-shell .circle-arrow{width:26px;height:26px;min-width:26px;font-size:21px}
  .profile-shell .intro-footer{margin-top:27px;padding:13px 18px}
  .profile-shell .profile-interaction-note{font-size:17px}
}
@media(max-width:420px){
  .profile-page .profile-shell{padding:12px 13px 28px}
  .profile-shell .topbar{padding:9px 11px;gap:10px}
  .profile-shell .topbar .brand-mark{width:40px;height:40px}
  .profile-shell .brand-copy .wordmark{font-size:24px}
  .profile-shell .wordmark .farm-name{font-size:24px}
  .profile-shell .intro{margin:25px auto 22px}
  .profile-shell .intro h1{font-size:39px}
  .profile-shell .intro p{font-size:16px}
  .profile-shell .profile-grid{gap:12px}
  .profile-shell .profile-card{border-radius:72px 72px 21px 21px}
  .profile-card-caption{font-size:12px;top:17px}
  .profile-shell .profile-card .profile-art{height:275px;padding-top:38px;border-radius:65px 65px 12px 12px}
  .profile-shell .profile-art::after{border-radius:62px 62px 10px 10px}
  .profile-shell .profile-card .profile-info{padding:12px 6px 8px}
  .profile-shell .profile-info h2{font-size:26px}
  .profile-star{font-size:14px;padding:4px 5px}
  .profile-shell .profile-card .profile-info p{font-size:13px;min-height:39px}
  .profile-enter{font-size:17px;padding:7px 8px}
  .profile-shell .circle-arrow{width:22px;height:22px;min-width:22px;font-size:19px}
  .profile-shell .footnote{font-size:13px}
}
@media(prefers-reduced-motion:reduce){
  .profile-shell .profile-particle:nth-child(3n){animation:none;opacity:.55}
  .profile-shell .profile-card:hover{transform:none}
}