@font-face{font-family:GoriRound;src:url('/fonts/NanumSquareRound-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:GoriRound;src:url('/fonts/NanumSquareRound-ExtraBold.ttf') format('truetype');font-weight:800;font-display:swap}
:root{color-scheme:light;--ink:#444;--green:#568e80;--green-dark:#2f675b;--coral:#e98b7d;--paper:#fefefe;--line:#d9e4dd}
*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{font-family:GoriRound,"Apple SD Gothic Neo",system-ui,sans-serif;color:var(--ink);background:#e7f2ed;font-weight:700;word-break:keep-all}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}#app{min-height:100dvh}#toast{position:fixed;left:50%;bottom:24px;z-index:100;max-width:min(90vw,420px);padding:10px 16px;border-radius:12px;background:rgba(39,51,48,.92);color:white;font-size:13px;line-height:1.5;opacity:0;transform:translate(-50%,12px);pointer-events:none;transition:opacity .2s,transform .2s}#toast.visible{opacity:1;transform:translate(-50%,0)}
.loading-screen,.auth-screen,.onboard-screen{min-height:100dvh;display:grid;place-items:center;padding:24px}.loading-screen{font-size:16px;color:var(--green-dark)}.auth-screen{background:linear-gradient(160deg,#dbece3 0%,#edf6f0 52%,#fff8f1 100%)}.onboard-screen{background:linear-gradient(160deg,#edf4ef,#fff9f5)}.auth-card,.onboard-card{width:min(100%,440px);padding:28px 26px 30px;border:1px solid #d6e1d9;border-radius:23px;background:rgba(254,254,254,.95);box-shadow:0 20px 65px rgba(61,93,79,.13)}.auth-logo{width:66px;height:66px;margin:0 auto 18px;border-radius:17px}.eyebrow{margin:0 0 6px;color:var(--green-dark);font-size:13px;letter-spacing:.04em}.auth-card h1,.onboard-card h1{margin:0;color:#273330;font-size:27px;line-height:1.35}.auth-card h1{text-align:center}.auth-card .eyebrow{text-align:center}.auth-copy{margin:14px 0 24px;color:#697570;font-size:15px;line-height:1.7;text-align:center}.social-buttons{display:grid;gap:10px}.button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:46px;padding:10px 15px;border:1px solid transparent;border-radius:11px;background:var(--green);color:#fff;font-size:15px;font-weight:800;text-align:center;transition:transform .16s,filter .16s}.button:hover:not(:disabled){filter:brightness(.97);transform:translateY(-1px)}.button:active:not(:disabled){transform:scale(.98)}.button-secondary{border-color:#a5c9ba;background:var(--paper);color:var(--green-dark)}.button-google{border-color:#d4dad6;background:white;color:#3d4742}.button-apple{background:#222;color:white}.button-coral{background:var(--coral)}.button-small{min-height:36px;padding:7px 11px;font-size:12px;border-radius:8px}.auth-note{margin:18px 0 0;color:#82908a;font-size:12px;line-height:1.5;text-align:center}.error-message{margin:14px 0 0;padding:10px 12px;border-radius:9px;background:#fff0ed;color:#a55047;font-size:13px;line-height:1.5}.invite-banner{margin:0 0 16px;padding:10px 13px;border:1px solid #f3d6c9;border-radius:10px;background:#fff5ef;color:#a75349;font-size:13px;line-height:1.5}.onboard-card .eyebrow{margin-bottom:8px}.onboard-card h1{font-size:24px}.onboard-intro{margin:10px 0 22px;color:#718078;font-size:13px;line-height:1.6}.profile-form{display:grid;gap:16px}.field{display:grid;gap:7px}.field label,.field-label{font-size:13px;color:#4c5d54}.field input,.field select,.friend-code-input{width:100%;height:45px;border:1px solid #d0dbd3;border-radius:9px;padding:0 12px;background:#fff;color:#273330;outline:none}.field input:focus,.field select:focus,.friend-code-input:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(104,171,148,.15)}.field select:invalid{color:#9baaa1}.field-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.field-row.two{grid-template-columns:repeat(2,minmax(0,1fr))}.field-note{margin:0;color:#89948d;font-size:11px;line-height:1.5}.onboard-actions{display:flex;gap:9px;margin-top:8px}.onboard-actions .button{flex:1}
.relation-page{min-height:100dvh;background:#e5f0e9}.world{position:relative;isolation:isolate;width:100%;min-height:560px;overflow:hidden;background:#b1c9ac url('/assets/garden-background.png') center 51%/cover no-repeat}.world:before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,rgba(237,246,237,.08),rgba(58,93,69,.09) 70%,rgba(56,87,70,.25));pointer-events:none}.floating-actions{position:absolute;z-index:10;top:max(16px,env(safe-area-inset-top));right:16px;display:flex;gap:7px}.glass-button{min-height:35px;padding:7px 11px;border:1px solid rgba(68,68,68,.2);border-radius:10px;background:rgba(254,254,254,.77);backdrop-filter:blur(13px);-webkit-backdrop-filter:blur(13px);color:#34433d;font-size:12px}.glass-button:hover{background:rgba(254,254,254,.94)}.world-content{position:relative;z-index:1;width:min(100%,1120px);min-height:560px;margin:auto;padding:66px 25px 22px}.world-topline{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:1000px;margin:0 auto}.world-heading{margin:0;padding:11px 16px;border:1px solid rgba(68,68,68,.17);border-radius:11px;background:rgba(254,254,254,.68);backdrop-filter:blur(10px);font-size:16px;line-height:1.3;color:#374a42}.world-heading small{display:block;color:#6b8576;font-size:11px;margin-bottom:3px}.world-stage{position:relative;height:430px;margin-top:3px}.resident{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;width:145px;height:203px;padding:0;border:0;background:none;color:#273330;transform:translate(-50%,-50%);transition:filter .16s,scale .16s;z-index:2}.resident:hover{filter:brightness(1.04);scale:1.035}.resident:active{scale:.97}.resident.selected .name-tag{border-color:#e77d71;box-shadow:0 0 0 3px rgba(235,136,122,.25)}.resident.owner{width:174px;height:238px;z-index:3}.name-tag{position:relative;z-index:3;max-width:170px;display:flex;align-items:center;gap:4px;min-height:29px;margin-bottom:3px;padding:4px 9px;border:1px solid #7fafa3;border-radius:7px;background:rgba(35,45,40,.81);color:#fefefe;font-size:13px;white-space:nowrap}.name-tag strong{font-weight:800}.name-tag em{font-style:normal;color:#9de2cf;font-size:11px}.resident.owner .name-tag{font-size:14px}.score-tag{position:relative;z-index:3;margin-bottom:1px;padding:3px 8px;border:1px solid rgba(68,68,68,.22);border-radius:7px;background:rgba(254,254,254,.84);font-size:12px}.score-tag.good{color:#397767}.score-tag.low{color:#c3705e}.score-tag.mid{color:#a27939}.animal{position:relative;z-index:2;width:112px;height:118px;object-fit:contain;filter:drop-shadow(0 8px 6px rgba(35,62,45,.24))}.resident.owner .animal{width:144px;height:150px}.platform{position:absolute;z-index:1;bottom:-3px;width:138px;height:74px;object-fit:contain}.resident.owner .platform{width:170px;height:91px;bottom:-9px}.world-empty{position:absolute;left:50%;top:63%;width:min(300px,70vw);padding:17px;border:1px solid rgba(255,255,255,.7);border-radius:13px;background:rgba(254,254,254,.82);color:#425b4a;text-align:center;transform:translate(-50%,-50%);backdrop-filter:blur(9px);z-index:4}.world-empty p{margin:5px 0 10px;font-size:13px;line-height:1.5}.world-empty .button{min-height:36px;font-size:12px}.world-cta{position:absolute;z-index:7;left:50%;bottom:17px;display:flex;gap:8px;transform:translateX(-50%)}.world-cta .button{white-space:nowrap;box-shadow:0 4px 12px rgba(32,71,54,.16)}
.relation-content{width:min(100%,1120px);margin:auto;padding:22px 24px max(40px,env(safe-area-inset-bottom))}.intro-card,.friend-detail,.invite-card,.request-card,.friend-list-wrap{border:1px solid var(--line);border-radius:14px;background:#fefefe;box-shadow:0 3px 15px rgba(58,84,67,.04)}.intro-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px}.intro-card h2,.friend-list-wrap h2,.friend-detail h2,.invite-card h2,.request-card h2{margin:0;color:#35433d;font-size:17px}.intro-card p,.friend-detail p,.invite-card p,.request-card p{margin:5px 0 0;color:#6e7a72;font-size:13px;line-height:1.6}.content-grid{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(285px,1fr);gap:14px;margin-top:14px}.content-stack{display:grid;align-content:start;gap:14px}.friend-detail{min-height:160px;padding:18px}.friend-detail .detail-head{display:flex;align-items:center;gap:13px}.friend-detail .detail-head img{width:75px;height:79px;object-fit:contain}.friend-detail .detail-score{margin:15px 0 0;font-size:30px;color:var(--green-dark)}.friend-detail .detail-score span{font-size:15px}.detail-sub{font-size:12px;color:#7d8d82}.friend-list-wrap{padding:18px}.friend-list{display:grid;gap:8px;margin-top:13px}.friend-list button{display:flex;align-items:center;gap:12px;width:100%;min-height:61px;padding:7px 10px;border:1px solid #e2e9e3;border-radius:9px;background:#f9fbf9;text-align:left}.friend-list button.selected{border-color:#df907f;background:#fff9f6}.friend-list img{width:43px;height:46px;object-fit:contain}.friend-list .friend-name{flex:1;font-size:14px;color:#3a483f}.friend-list .friend-name small{display:block;margin-top:4px;font-size:11px;color:#698b7f}.friend-list .friend-score{font-size:18px;color:var(--green-dark)}.invite-card,.request-card{padding:18px}.code-row{display:flex;align-items:center;gap:8px;margin-top:12px}.code-value{flex:1;letter-spacing:.14em;font-size:20px;color:var(--green-dark)}.invite-actions{display:flex;gap:8px;margin-top:12px}.invite-actions>*{flex:1}.friend-code-form{display:flex;gap:8px;margin-top:15px}.friend-code-form input{min-width:0;flex:1}.request-list{display:grid;gap:8px;margin-top:13px}.request-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px;border-radius:8px;background:#f6faf7}.request-item span{font-size:13px}.request-buttons{display:flex;gap:5px}.request-buttons .button{min-height:31px;padding:5px 8px;font-size:11px}.request-empty{font-size:12px;color:#8a9990}.download-panel{display:flex;gap:9px;align-items:center;justify-content:space-between;margin-top:16px;padding:14px 17px;border-radius:12px;background:#d7ebe2}.download-panel p{margin:0;font-size:13px;color:#436157}.download-links{display:flex;gap:6px}.download-links .button{min-height:34px;font-size:11px;padding:6px 9px}.mobile-only{display:none}
.dialog-backdrop{position:fixed;z-index:40;inset:0;display:grid;place-items:center;padding:16px;background:rgba(26,43,34,.48)}.dialog{width:min(100%,410px);max-height:min(90dvh,660px);overflow:auto;position:relative;padding:22px;border-radius:18px;background:#fefefe;box-shadow:0 20px 60px rgba(0,0,0,.2)}.dialog h2{margin:0 38px 12px 0;color:#273330;font-size:20px}.dialog-close{position:absolute;top:15px;right:15px;width:32px;height:32px;border:0;border-radius:8px;background:#f1f4f0;color:#586860;font-size:20px}.dialog p{font-size:14px;line-height:1.7}.element-grid{display:grid;gap:10px;margin-top:17px}.element-row{display:grid;grid-template-columns:34px 1fr 42px;align-items:center;gap:9px;font-size:13px}.element-track{height:10px;border-radius:10px;background:#e8ede9;overflow:hidden}.element-fill{height:100%;border-radius:10px}.smallprint{font-size:11px;color:#7a8980;line-height:1.5}
.pending-invite{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 18px;margin-bottom:14px;border:1px solid #f3d6c9;border-radius:13px;background:#fff5ef;color:#8d5148}.pending-invite strong{font-size:15px}.pending-invite p{margin:3px 0 0;font-size:12px}.pending-invite-actions{display:flex;gap:7px;flex-shrink:0}
@media(max-width:700px){.world{min-height:520px;background-position:center}.world-content{min-height:520px;padding:67px 12px 15px}.world-heading{padding:9px 12px;font-size:13px}.world-stage{height:390px}.resident{width:112px;height:165px}.resident.owner{width:139px;height:198px}.resident .animal{width:84px;height:91px}.resident.owner .animal{width:111px;height:118px}.platform{width:107px;height:59px;bottom:-3px}.resident.owner .platform{width:139px;height:76px;bottom:-8px}.name-tag{max-width:120px;min-height:25px;font-size:11px;padding:3px 6px;gap:2px}.name-tag em{font-size:9px}.resident.owner .name-tag{font-size:12px}.score-tag{font-size:11px}.floating-actions{right:11px;top:max(11px,env(safe-area-inset-top))}.glass-button{font-size:11px;min-height:32px;padding:5px 8px}.world-cta{bottom:12px}.relation-content{padding:14px 13px 35px}.intro-card{padding:13px 14px}.intro-card h2{font-size:15px}.intro-card p{font-size:12px}.intro-card .button{min-height:36px;font-size:11px}.content-grid{grid-template-columns:1fr;gap:12px}.content-stack{gap:12px}.download-panel{align-items:stretch;flex-direction:column}.download-links .button{flex:1}.mobile-only{display:block}.pending-invite{align-items:stretch;flex-direction:column}.pending-invite-actions>*{flex:1}}
@media(max-width:420px){.world-stage{height:380px}.world{min-height:500px}.world-content{min-height:500px}.resident{width:100px;height:157px}.resident.owner{width:130px;height:191px}.resident .animal{width:78px;height:87px}.resident.owner .animal{width:107px;height:112px}.platform{width:100px;height:52px}.resident.owner .platform{width:130px;height:69px}.name-tag{font-size:10px}.score-tag{font-size:10px}.world-cta .button{min-height:36px;font-size:11px;padding:6px 10px}}

/* 관계 앱과 같은 1536 × 1024 월드/슬롯 좌표를 사용합니다. */
.relation-page{height:100dvh;min-height:0;overflow:hidden}
.relation-world{position:relative;width:100%;height:100dvh;overflow:hidden;background:#8da985;touch-action:none;cursor:grab}
.relation-world,.relation-world *{-webkit-user-select:none;user-select:none}
.relation-world img{-webkit-user-drag:none;user-drag:none}
.relation-world:active{cursor:grabbing}
.world-canvas{position:absolute;left:0;top:0;width:1536px;height:1024px;background:url('/assets/garden-background.png') 0 0/1536px 1024px no-repeat;transform-origin:0 0;will-change:transform}
.world-owner-platform{position:absolute;left:685.58px;top:574.36px;width:166.84px;height:166.84px;max-width:none;pointer-events:none;z-index:1}
.world-slot{position:absolute;display:block;width:97.19px;height:97.19px;padding:0;border:0;background:transparent;overflow:hidden;z-index:1}
.world-slot.empty{cursor:pointer}
.world-slot.empty:hover{filter:brightness(1.15)}
.world-slot img{position:absolute;max-width:none;pointer-events:none}
.world-slot.empty img{left:-28.02%;top:-19%;width:156.59%;height:143.54%}
.world-slot.occupied img{left:-33.89%;top:-24.83%;width:167.48%;height:154.39%}
.world-resident{position:absolute;display:block;padding:0;border:0;background:transparent;z-index:3;cursor:pointer}
.world-resident.owner{z-index:4}
.world-resident.pending{opacity:.62}
.world-resident:active .world-animal{transform:scale(.94)}
.world-animal{width:100%;height:100%;max-width:none;object-fit:contain;filter:drop-shadow(0 7px 4px rgba(38,46,35,.2));transition:transform .16s;pointer-events:none}
.world-name-tag,.world-score-tag,.world-pending-tag{position:absolute;left:50%;display:flex;align-items:center;justify-content:center;white-space:nowrap;transform:translateX(-50%);pointer-events:none}
.world-name-tag{top:-25px;min-width:108px;max-width:170px;height:30px;padding:0 7px;gap:5px;overflow:hidden;border:1px solid #87aea4;border-radius:60px;background:rgba(22,22,22,.81);color:#fefefe;font-size:13px;line-height:21px;z-index:6}
.world-name-tag em{color:#87aea4;font-style:normal;flex-shrink:0}
.world-name-tag strong{font-weight:800;overflow:hidden;text-overflow:ellipsis}
.world-resident.owner .world-name-tag{top:-36px;min-width:66px}
.world-score-tag{top:-56px;min-width:72px;height:27px;padding:0 6px;gap:4px;border:1px solid #87aea4;border-radius:7px;background:rgba(22,22,22,.78);color:#fefefe;font-size:12px;line-height:17px;z-index:7}
.world-score-tag strong.good{color:#9ed8c9}.world-score-tag strong.mid{color:#ffd77a}.world-score-tag strong.low{color:#ff9e92}
.world-pending-tag{top:-52px;height:21px;padding:0 6px;border-radius:11px;background:rgba(254,254,254,.9);font-size:11px;color:#444;z-index:7}
.world-controls{position:absolute;right:12px;top:max(12px,env(safe-area-inset-top));z-index:10;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;max-width:min(95vw,500px)}
.world-controls .glass-button{min-height:33px;background:rgba(254,254,254,.72);border-color:rgba(68,68,68,.22);color:#273330}
.world-selection{position:absolute;bottom:max(22px,env(safe-area-inset-bottom));left:50%;z-index:10;display:flex;align-items:center;gap:10px;max-width:calc(100vw - 24px);padding:10px 40px 10px 12px;border:1px solid rgba(68,68,68,.2);border-radius:14px;background:rgba(254,254,254,.9);box-shadow:0 7px 20px rgba(23,41,32,.18);backdrop-filter:blur(13px);transform:translateX(-50%);white-space:nowrap}
.world-selection strong{font-size:14px;color:#273330}.world-selection span{font-size:13px;color:#447967}
.world-selection .button{white-space:nowrap}
.world-selection-close{position:absolute;right:7px;top:6px;width:26px;height:26px;border:0;border-radius:50%;background:transparent;color:#66766d;font-size:22px}
.relation-world>.pending-invite{position:absolute;left:50%;bottom:88px;z-index:11;width:min(470px,calc(100vw - 24px));margin:0;transform:translateX(-50%);background:rgba(255,245,239,.95)}
.dialog .request-card{padding:0;border:0;box-shadow:none}
.dialog .request-card>h2{display:none}
.dialog .download-links{display:flex;gap:8px;margin-top:16px}.dialog .download-links>*{flex:1}
@media(max-width:700px){.world-controls{right:9px;top:max(9px,env(safe-area-inset-top))}.world-controls .glass-button{font-size:11px;padding:6px 8px}.world-selection{flex-wrap:wrap;justify-content:center;gap:5px 8px;width:min(390px,calc(100vw - 20px))}.world-selection strong{font-size:13px}.world-selection .button{min-height:32px}}
