@import url("https://fonts.googleapis.com/css2?family=Do+Hyeon&display=swap");
:root{--p:#6b452b;--s:#a97b50;--ink:#2d251f;--muted:#7d7067;--line:#e4d9cd;--bg:#f7f2eb;--panel:#fffdf9;--grad:linear-gradient(135deg,var(--p),var(--s))}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:"Do Hyeon","Noto Sans KR",sans-serif}button,input,select{font:inherit;color:inherit}button{cursor:pointer;border:1px solid var(--line);background:#fff;border-radius:15px;padding:12px 17px}button.primary,header nav .on{color:#fff;background:var(--grad);border-color:transparent}.panel{background:#fff;border:1px solid var(--line);border-radius:27px;box-shadow:0 18px 45px #27334b10}
header{height:106px;display:flex;align-items:center;gap:28px;padding:15px 30px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}.brand{display:flex;align-items:center;gap:13px;min-width:270px}.brand h1{margin:0;font-size:31px}.brand small,#save-state{color:var(--muted)}.logo{width:65px;height:65px;border-radius:20px;background:var(--grad);display:grid;place-items:center;color:#fff;font-size:31px}nav{display:flex;gap:8px;overflow:auto;flex:1}header nav button{white-space:nowrap;font-size:19px}.account{white-space:nowrap}main{padding:26px;max-width:1900px;margin:auto}
.title{display:flex;align-items:center;justify-content:space-between;gap:12px}.empty{max-width:760px;margin:10vh auto;text-align:center;padding:70px 20px}.roster{display:flex;gap:13px;overflow:auto;padding:5px 3px 18px}.roster-card{display:flex;align-items:center;gap:12px;min-width:265px;text-align:left;border:2px solid transparent}.roster-card.on{border-color:var(--own);box-shadow:0 7px 22px color-mix(in srgb,var(--own) 25%,transparent)}.roster-card span{display:grid}.roster-card b{font-size:22px}.roster-card small{color:var(--muted)}
.avatar{width:58px;height:58px;border-radius:50%;object-fit:cover;background:var(--own,var(--p));color:#fff;display:grid;place-items:center;flex:none;font-size:22px}.sprite{width:76px;height:76px;object-fit:contain;background:transparent;border:0;outline:0;filter:drop-shadow(0 6px 5px #17203355);flex:none}
.observe{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(340px,.7fr);gap:18px}.world-hud{position:relative;z-index:20;display:flex;justify-content:space-between;gap:12px;margin-bottom:10px}.world-hud>div{background:#fffffff1;border:1px solid #fff;border-radius:17px;padding:11px 15px;box-shadow:0 8px 25px #20304a1e;display:grid}.world-hud>div:last-child{text-align:right}.viewport{height:690px;overflow:auto;overscroll-behavior:contain;touch-action:none;border-radius:27px;background:#d9e9df}.world{position:relative;width:1200px;height:676px;overflow:hidden;transform-origin:0 0;background:#d9e9df}.world-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#d9e9df}.place{position:absolute;transform:translate(-50%,-50%);width:136px;min-height:105px;padding:12px;border:4px solid #fff;border-radius:22px;background:var(--place);box-shadow:0 10px 0 color-mix(in srgb,var(--place) 58%,#333),0 14px 24px #1c293f31;display:grid;place-items:center}.place i{font-style:normal;font-size:27px}.place small{color:#273248}.person{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;background:transparent;border:0;padding:0;z-index:8}.person span{background:#fffffff1;padding:9px 12px;border-radius:12px;font-size:18px}.person .sprite{width:92px;height:92px}.person .avatar{border:0;outline:0}.zoom{display:flex;gap:6px;margin-top:8px}.zoom button{width:46px;height:44px;padding:0}.detail{padding:18px}.hero{height:310px;border-radius:23px;background:var(--grad);overflow:hidden;display:grid;place-items:center}.hero>img:not(.sprite){width:100%;height:100%;object-fit:cover}.hero .sprite{width:85%;height:85%}.detail h2{font-size:36px;margin:18px 0 5px}.detail>p{color:var(--muted)}.scene{background:#f4f7fb;border:1px solid var(--line);border-radius:20px;padding:19px;margin-top:18px}.scene h3{font-size:24px;margin:8px 0}
.editor{display:grid;grid-template-columns:350px 1fr;gap:18px}.editor>aside,.form{padding:24px}.char-row{width:100%;display:flex;gap:11px;align-items:center;text-align:left;margin:9px 0;background:#f6f8fb}.char-row.on{border-color:var(--p);box-shadow:0 0 0 2px color-mix(in srgb,var(--p) 25%,transparent)}.char-row span{display:grid}.char-row small,label small{color:var(--muted)}.fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}.fields label,.form>label{display:grid;gap:7px;color:var(--muted)}input,select{width:100%;min-height:54px;border:1px solid var(--line);border-radius:15px;background:#f5f7fb;padding:13px}.check{margin:18px 0}.check input{width:auto;min-height:0}.chips{border-top:1px solid var(--line);padding-top:18px;margin-top:20px}.chips button{padding:9px 13px;margin:4px}.chips .on{color:var(--p);border-color:var(--p);background:color-mix(in srgb,var(--p) 11%,#fff)}
.home-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.home{padding:20px}.clean{margin:15px 0;background:#f2f5f9;padding:12px;border-radius:15px}.clean i{display:block;height:10px;margin-top:8px;border-radius:20px;background:linear-gradient(90deg,#f39b81,#f1ce66,#6cc894)}.rooms{position:relative;display:grid;grid-template-columns:1.45fr .9fr .58fr;grid-template-rows:150px 95px 205px;gap:9px;padding:11px;min-height:480px;background:#ddd;border-radius:24px;overflow:hidden}.room{position:relative;padding:12px;border:5px solid #fff;border-radius:15px;background:linear-gradient(#f5f5f4df,#b9bcc1df) center/cover;overflow:hidden}.living{grid-column:1/3;grid-row:1/3}.kitchen{grid-column:3;grid-row:1}.entry{grid-column:3;grid-row:2}.bath{grid-column:3;grid-row:3}.bedroom{grid-column:1;grid-row:3}.study{grid-column:2;grid-row:3}.room-tools{position:absolute;right:7px;top:7px;display:flex;gap:4px;opacity:.2;transition:.2s}.room:hover .room-tools{opacity:1}.room-tools button{padding:5px 8px;border-radius:9px;font-size:12px}.home-person{position:absolute;z-index:4;display:flex;align-items:center;filter:drop-shadow(0 7px 7px #19223844);background:transparent;border:0;padding:0}.home-person.room-living{left:15%;top:22%}.home-person.room-kitchen{left:79%;top:13%}.home-person.room-entry{left:80%;top:43%}.home-person.room-bath{left:82%;top:73%}.home-person.room-bedroom{left:10%;top:72%}.home-person.room-study{left:47%;top:72%}.home-person.pos-1{transform:translate(20px,58px)}.home-person.pos-2{transform:translate(70px,10px)}.home-person .avatar{width:55px;height:55px}.home-person .sprite{width:70px;height:70px}.home-person span{display:grid;max-width:190px;background:#fff;padding:8px 11px;border-radius:12px}.home-person small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}
.relationship-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.relation{padding:22px;border-radius:18px;background:linear-gradient(110deg,color-mix(in srgb,var(--a) 18%,#fff),color-mix(in srgb,var(--b) 18%,#fff));margin:12px 0}.empty-mini{text-align:center;padding:65px 20px;color:var(--muted)}.relation-dialog{border:0;border-radius:24px;padding:0;box-shadow:0 30px 90px #17203355}.relation-dialog::backdrop{background:#17203377}.relation-dialog form{width:min(460px,90vw);padding:26px;display:grid;gap:15px}.relation-dialog label{display:grid;gap:7px}.relation-dialog .cohabit{display:flex;align-items:center}.relation-dialog .cohabit input{width:auto;min-height:auto}.relation-dialog .hint{color:var(--muted);font-size:14px}.relation-dialog form>div{display:flex;justify-content:flex-end;gap:8px}.town-edit{display:grid;grid-template-columns:1fr 360px;gap:18px}.town-edit>.world{border-radius:27px;overflow:hidden}.town-edit .place{cursor:grab}.home-grid+.title{margin-top:15px}
@media(max-width:900px){header{height:auto;flex-wrap:wrap;padding:9px}.brand{min-width:190px}.brand h1{font-size:25px}.logo{width:50px;height:50px}.brand small{display:none}nav{order:3;width:100%}header nav button{padding:10px 14px}#save-state{margin-left:auto;font-size:12px}main{padding:8px}.observe,.editor,.town-edit{grid-template-columns:1fr}.roster-card{min-width:220px}.viewport{height:calc(100dvh - 260px);min-height:480px}.detail{margin-top:8px}.home-grid{display:block}.home{margin-bottom:12px}.rooms{min-width:720px}.home{overflow:auto}.fields{grid-template-columns:1fr}.town-edit>.world{min-width:1200px}.town-edit{overflow:auto}}
@media(max-width:600px){body{overflow-x:hidden}header{position:sticky;top:0}.account{max-width:150px;overflow:hidden;text-overflow:ellipsis}.observe>section{min-width:0}.world-hud{position:sticky;left:0;top:0}.world-hud>div{min-width:0;max-width:48%;font-size:14px}.viewport{border-radius:20px}.detail .hero{height:55vh}.room-tools{opacity:1}}

/* 화면·집·로그 안정화 */
.observe{align-items:start}
.viewport{width:100%;height:auto;min-height:420px;aspect-ratio:1672/941;overflow:auto;touch-action:pan-x pan-y;overscroll-behavior:contain}
.viewport .world{width:max(100%,1200px);height:max(100%,676px);transform:none!important}
.world-bg{object-fit:contain}
.place{width:11.33%;height:15.5%;min-height:0;padding:clamp(3px,.7vw,8px);border-width:3px}
.place.has-art{width:12.5%;height:19.5%;min-height:0;padding:0;border:0;background:transparent;box-shadow:none;overflow:visible}
.building-art{width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 10px 7px #17203355)}
.place-label{display:grid;place-items:center;min-width:104px;padding:4px 7px;border:0;border-radius:0;background:transparent;box-shadow:none;text-align:center;color:#050505;text-shadow:-1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff,0 2px 3px #fff}
.place-label small{color:#050505}
.place.has-art .place-label{position:absolute;left:50%;bottom:-8px;transform:translateX(-50%);z-index:14;pointer-events:none}
.map-place-label{position:absolute;z-index:30;display:grid;place-items:center;transform:translate(-50%,calc(-100% - 48px));min-width:110px;color:#050505;text-align:center;text-shadow:-1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff,0 2px 3px #fff;pointer-events:none}.map-place-label small{color:#050505}
.place-people{z-index:18!important;display:grid!important;justify-items:center!important;gap:3px!important;transform:translate(-50%,-50%)!important;overflow:visible!important}.place-people-faces{display:flex!important;align-items:flex-end!important;gap:2px!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important}.place-people-faces .avatar,.place-people-faces .sprite{width:52px!important;height:58px!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;object-fit:contain!important;overflow:visible!important}.place-people-faces>b{display:grid;place-items:center;width:28px;height:28px;margin-left:2px;border-radius:50%;background:var(--p);color:#fff;font-size:11px}.place-people-names{max-width:150px!important;padding:3px 7px!important;font-size:11px!important;text-align:center!important;white-space:normal!important}
.date-schedule{display:block!important;margin:10px 0!important;padding:0!important;border:2px solid var(--log-theme)!important;border-radius:17px!important;background:color-mix(in srgb,var(--log-theme) 8%,#fff)!important;overflow:hidden}.date-schedule-title{display:flex;justify-content:space-between;gap:10px;padding:12px 14px;background:var(--log-theme);color:#fff}.date-schedule-title small{color:#fff!important}.date-schedule>ol{max-height:none!important;overflow:visible!important;margin:0!important;padding:5px 13px 9px!important}.date-schedule>ol>li{display:grid!important;grid-template-columns:58px minmax(0,1fr)!important;gap:8px!important;margin:0!important;padding:10px 0!important;border:0!important;border-bottom:1px solid color-mix(in srgb,var(--log-theme) 20%,var(--line))!important;background:transparent!important}.date-schedule>ol>li:last-child{border-bottom:0!important}.date-schedule>ol time{font-weight:800;color:var(--log-theme)}.date-schedule>ol span{display:grid}.date-schedule>ol small{color:var(--muted)}
.place:not(.has-art) .place-label{padding:0;border:0;background:transparent;box-shadow:none}
.person span{font-size:clamp(12px,1.2vw,18px)}
.person .sprite{width:clamp(54px,6vw,92px);height:clamp(54px,6vw,92px)}
.detail-column{display:grid;gap:16px}
.hero{height:270px}
.place-photo{display:block;width:100%;max-height:220px;object-fit:cover;border-radius:15px;margin-top:14px}
.life-log{padding:20px}.life-log ol{list-style:none;padding:0;margin:15px 0 0}.life-log li{display:grid;grid-template-columns:54px 1fr;gap:12px;padding:11px 0;border-top:1px solid var(--line)}.life-log li span{display:grid}.life-log small,.life-log time{color:var(--muted)}.life-log .now b{color:var(--p)}
.life-log ol{max-height:460px;overflow-y:auto;overscroll-behavior:contain;padding-right:7px}.home-family-log ol{max-height:360px}
.home-tabs{display:flex;gap:8px;overflow:auto;margin:12px 0 18px}.home-tabs button{background:var(--home-grad);background-image:linear-gradient(#17203338,#17203338),var(--home-photo,linear-gradient(transparent,transparent)),var(--home-grad);background-position:center;background-size:cover}.home-tabs .on{color:#fff}
.home-grid{display:block;max-width:1200px;margin:auto}.rooms{grid-template-rows:1.1fr .72fr 1.45fr;min-height:0;aspect-ratio:16/9}
.room-people{position:absolute;left:10px;right:10px;bottom:10px;display:flex;flex-wrap:wrap;gap:7px;align-items:flex-end}
.home-person{position:static}.home-person span{max-width:180px}.home-person .avatar{width:52px;height:52px}.home-person .sprite{width:66px;height:66px}
.town-edit{grid-template-columns:minmax(0,1fr) 360px}.town-edit>.world{width:100%;height:auto;aspect-ratio:1672/941}
.place-editor{display:grid;gap:7px;margin-top:16px}.place-editor>div{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px;background:#f5f7fb;border-radius:12px}.place-editor button,.image-actions button{padding:8px 10px}.image-actions{display:flex;gap:7px}
@media(max-width:900px){
  .viewport{height:auto;min-height:0}
  .town-edit>.world{min-width:0}
  .town-edit{overflow:visible}
  .rooms{min-width:0}
  .home{overflow:hidden}
}
@media(max-width:600px){
  .world-hud{position:relative}
  .detail .hero{height:220px}
  .rooms{gap:4px;padding:5px}
  .room{padding:7px;border-width:3px}
  .home-person span{display:none}
  .home-person .avatar{width:42px;height:42px}
  .home-person .sprite{width:48px;height:48px}
  .place b{font-size:12px}.place small{font-size:10px}
  .place{border-width:2px;box-shadow:0 5px 0 color-mix(in srgb,var(--place) 58%,#333)}
}

/* 집 편집과 상태 */
.home-name{font-size:27px;font-weight:700;background:#fff;min-height:46px}
.room-name{position:relative;z-index:6;width:min(170px,62%);min-height:34px;padding:5px 8px;background:#ffffffdd;border-radius:9px}
.resident-editor{margin:14px 0;padding:14px;background:#f4f7fb;border-radius:17px}
.resident-editor h3{margin:0 0 9px}.resident-editor>div{display:flex;flex-wrap:wrap;gap:8px}
.resident-editor button{display:flex;align-items:center;gap:7px;padding:7px 10px}
.resident-editor button.on{color:var(--p);border-color:var(--p);background:color-mix(in srgb,var(--p) 10%,#fff)}
.resident-editor .avatar,.resident-editor .sprite{width:34px;height:34px}
.furniture{position:absolute;z-index:5;left:7px;right:7px;top:50px;display:flex;flex-wrap:wrap;gap:4px;align-content:flex-start}
.furniture button{padding:4px 7px;border-radius:9px;font-size:12px;background:#ffffffe8}
.furniture button.on{color:#fff;background:var(--grad);border-color:transparent}
.home-statuses{margin-top:18px}.home-statuses>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.home-status{display:flex;align-items:center;gap:12px;text-align:left;background:color-mix(in srgb,var(--own) 7%,#fff);border-color:color-mix(in srgb,var(--own) 35%,var(--line))}
.home-status span{display:grid;min-width:0}.home-status b{font-size:20px}.home-status small{color:var(--own)}
.home-status em{font-style:normal;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.home-status .avatar,.home-status .sprite{width:52px;height:52px}
.sleep-room-editor{margin:14px 0;padding:14px;border:1px solid var(--line);border-radius:17px;background:#f8fafc}.sleep-room-editor h3{margin:0}.sleep-room-editor>label{display:grid;grid-template-columns:minmax(90px,.5fr) 1fr;align-items:center;gap:10px;margin-top:8px}.sleep-room-editor select{min-height:42px}
.custom-room{grid-column:span 1;grid-row:auto;min-height:130px}
.rooms.has-extra{aspect-ratio:auto;min-height:620px;overflow:visible;grid-auto-rows:minmax(130px,auto)}
.form-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:18px}

@media(max-width:600px){
  .home{padding:13px}
  .rooms{width:100%;min-width:0;min-height:clamp(620px,160vw,760px);aspect-ratio:auto;grid-template-rows:1.1fr .72fr 1.45fr}
  .room-people{gap:3px;left:5px;right:5px;bottom:5px}
  .home-person span{display:grid;font-size:12px;padding:5px 7px}
  .home-person span small{max-width:110px}
  .home-statuses>div{grid-template-columns:1fr}
  .furniture{top:42px}.furniture button{font-size:10px;padding:3px 5px}
}

/* 캐릭터 순서와 집별 색 */
.char-sort-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;align-items:stretch;margin:8px 0}
.char-sort-row .char-row{width:100%;margin:0}
.sort-controls{display:grid;gap:4px}
.sort-controls button{width:38px;min-height:0;padding:0;border-radius:11px;font-size:12px}
.sort-controls button:disabled{opacity:.28}
.home-tabs button{color:#fff;opacity:.72;border-color:#ffffff88}
.home-tabs .on{opacity:1;box-shadow:0 7px 20px #24314322}
.home-photo-editor,.character-menu,.town-tabs{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0}
.character-menu{padding:6px;border:1px solid var(--line);border-radius:18px;background:#f4f7fb;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}.character-menu button{white-space:nowrap;flex:0 0 auto}
.character-menu button.on,.town-tabs button.on{color:#fff;background:var(--grad);border-color:transparent}
.town-tabs{padding:10px;background:#fff;border:1px solid var(--line);border-radius:18px}
.town-tabs .town-choice{display:flex;align-items:center;gap:3px}
.town-tabs .town-choice>button:last-child{padding:8px;color:#c44555}

/* 같은 장소의 인물은 작고 촘촘하게 */
@media(max-width:600px){
  .person .avatar{width:30px;height:30px}
  .person .sprite{width:38px;height:38px}
  .person span{max-width:68px;padding:4px 6px;border-radius:8px;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .char-sort-row{gap:4px}
  .sort-controls button{width:34px}
}

/* 세계관 취향 사전 */
.catalog-shell{display:grid;gap:20px}
.catalog-intro{padding:24px;background:linear-gradient(135deg,color-mix(in srgb,var(--p) 13%,#fff),color-mix(in srgb,var(--s) 15%,#fff))}
.catalog-intro h2{margin:0 0 7px;font-size:31px}.catalog-intro p{margin:0;color:var(--muted)}
.catalog-section{padding:22px}.catalog-section>.title h3{margin:0;font-size:26px}
.catalog-add{display:grid;grid-template-columns:1.2fr 1fr 1.5fr auto;gap:8px;margin:16px 0}
.catalog-add.food{grid-template-columns:1.1fr .9fr 1.3fr .7fr .7fr auto}
.catalog-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.catalog-card{display:grid;grid-template-columns:74px 1fr auto;gap:11px;align-items:start;padding:13px;border:1px solid var(--line);border-radius:18px;background:#f7f9fc}
.catalog-card img,.catalog-thumb{width:74px;height:74px;object-fit:cover;border-radius:15px;background:linear-gradient(135deg,color-mix(in srgb,var(--p) 20%,#fff),color-mix(in srgb,var(--s) 25%,#fff))}
.catalog-card .catalog-fields{display:grid;gap:7px}.catalog-card input,.catalog-card select{min-height:39px;padding:8px 10px;border-radius:10px}
.catalog-card .delete{padding:7px 9px;color:#c33}.catalog-card small{color:var(--muted)}
.favorite-groups{display:grid;gap:12px}.favorite-group{padding:13px;border:1px solid var(--line);border-radius:16px;background:#f8fafc}
.favorite-group strong{display:block;margin-bottom:7px}.favorite-group button{padding:8px 11px;margin:3px}
.favorite-group button.on,.stock-picker button.on{color:#fff;background:var(--grad);border-color:transparent}
.place-stock{margin:9px 0 15px;padding:12px;background:#f4f7fb;border-radius:15px}
.place-stock>strong{display:block;margin-bottom:8px}.stock-picker{display:flex;flex-wrap:wrap;gap:6px}.stock-picker button{padding:7px 10px}
.place-editor details{border:1px solid var(--line);border-radius:15px;background:#f7f9fc;padding:10px}.place-editor summary{cursor:pointer;font-size:18px}

@media(max-width:1100px){.catalog-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){
  .catalog-add,.catalog-add.food{grid-template-columns:1fr 1fr}.catalog-add button{grid-column:1/-1}
  .catalog-cards{grid-template-columns:1fr}.catalog-card{grid-template-columns:58px 1fr auto}
  .catalog-card img,.catalog-thumb{width:58px;height:58px}
}

/* 수동 계정 저장과 취향 사전 스티커 */
.sync-panel{margin:0 0 22px;padding:22px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(135deg,color-mix(in srgb,var(--p) 9%,#fff),color-mix(in srgb,var(--s) 10%,#fff))}
.sync-panel h2{margin:0 0 8px}.sync-panel p{font-weight:700}.sync-actions{display:flex;flex-wrap:wrap;gap:9px;margin:14px 0}
.catalog-sticker{display:inline-block;width:34px;height:34px;margin-right:7px;object-fit:contain;vertical-align:middle;filter:drop-shadow(0 3px 3px #0002)}
.building-art{object-fit:contain;background:transparent;filter:drop-shadow(0 8px 6px #2235)}
.place.has-art{background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible}
.place.has-art .building-name{position:absolute;left:50%;bottom:-12px;transform:translateX(-50%);max-width:130px;padding:0;color:#182033;background:transparent;border:0;box-shadow:none;text-shadow:0 2px 2px #fff,0 -1px 2px #fff;white-space:nowrap;font-weight:800}
@media(max-width:600px){
  .sync-actions{display:grid}.sync-actions button{width:100%}
  .room-tools{opacity:1}
  .catalog-sticker{width:28px;height:28px}
}

/* 2026-08-01 저장·관찰 UI 정리 */
.place{transform:translate(-50%,-50%) scale(var(--place-scale,1))}
.roster-card{min-width:215px;padding:11px}.roster-card b{font-size:18px}.roster-card .avatar{width:46px;height:46px}
.place-config{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:10px 0}.place-config label{display:grid;gap:5px}
.log-modal[hidden]{display:none}.log-modal{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;padding:18px;background:#10182788;backdrop-filter:blur(5px)}
.log-dialog{width:min(620px,100%);max-height:86dvh;overflow:auto;padding:24px;border-radius:25px;background:#fff;box-shadow:0 24px 80px #10182755}
.log-dialog .title{margin-bottom:12px}.log-dialog img{display:block;width:100%;max-height:390px;object-fit:cover;border-radius:18px;margin-top:15px}.log-dialog p{line-height:1.7}
.life-log li{cursor:pointer}.life-log li:hover{background:color-mix(in srgb,var(--p) 7%,#fff)}
.town-tabs{display:flex;gap:8px;overflow:auto;padding-bottom:10px}
.observe-town-switcher{display:flex;align-items:center;gap:8px;overflow:auto;margin:0 0 12px;padding:10px 12px;border:1px solid var(--line);border-radius:18px;background:#fff}
.observe-town-switcher>b{white-space:nowrap}.observe-town-switcher button{padding:8px 12px;white-space:nowrap}
.observe-town-switcher button.on{color:#fff;background:var(--grad);border-color:transparent}

@media(max-width:700px){
  .roster{gap:8px;padding-bottom:10px}.roster-card{min-width:158px;gap:7px;padding:8px}.roster-card b{font-size:15px}.roster-card small{font-size:11px}
  .roster-card .avatar{width:38px;height:38px}.roster-card .sprite{width:44px;height:44px}
  .place-config{grid-template-columns:1fr}.place-editor details{padding:8px}
  .log-dialog{padding:18px}.log-dialog img{max-height:48dvh}
}

/* 아이콘형 세계관 취향 도감 */
.catalog-dex-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:14px}
.catalog-dex-card{border:1px solid var(--line);border-radius:18px;background:#f8fafc;overflow:hidden}
.catalog-dex-card summary{min-height:148px;padding:12px;display:grid;place-items:center;align-content:center;gap:6px;text-align:center;cursor:pointer;list-style:none}
.catalog-dex-card summary::-webkit-details-marker{display:none}.catalog-app-icon{width:78px;height:78px;border-radius:22px!important;display:grid;place-items:center;object-fit:cover;font-size:40px;background:linear-gradient(145deg,#fff,#e5edf5);border:1px solid #fff;box-shadow:0 8px 18px #15223824,inset 0 1px 0 #fff}.catalog-dex-card summary>b{font-size:18px}.catalog-dex-card summary>small{color:var(--muted)}
.catalog-dex-card[open]{grid-column:span 2;background:#fff;box-shadow:0 12px 30px #17203312}.catalog-detail{padding:14px;border-top:1px solid var(--line);display:grid;gap:10px}.catalog-detail label{display:grid;gap:5px}
@media(max-width:900px){.catalog-dex-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.catalog-dex-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-dex-card[open]{grid-column:1/-1}.catalog-dex-card summary{min-height:126px}.form-actions{display:grid}.form-actions button{width:100%}}

/* 모바일 마을 편집 지도는 편집 폼 위에 크게 표시 */
@media(max-width:900px){
  .town-edit{display:grid!important;grid-template-columns:minmax(0,1fr)!important;overflow:visible!important}
  .town-edit>.world{display:block!important;width:100%!important;min-width:0!important;height:auto!important;min-height:210px;aspect-ratio:1672/941;margin:0 0 14px;border-radius:20px}
  .town-edit>.form{width:100%;min-width:0}
}
.place-photo-tools{display:grid;gap:8px;margin:12px 0}.place-photo-tools>span,.pet-actions{display:flex;gap:7px;flex-wrap:wrap}
.pets{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}.pet-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}.pet-card{display:grid;grid-template-columns:70px 1fr;gap:12px;padding:14px;border:1px solid var(--line);border-radius:20px;background:#f8fafc}.pet-avatar{width:70px;height:70px;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:linear-gradient(145deg,#fff,#dce8e4);font-size:38px;box-shadow:0 6px 14px #17203318}.pet-avatar img{width:100%;height:100%;object-fit:cover}.pet-info{display:grid;align-content:start;gap:3px}.pet-info>b{font-size:19px}.pet-info small{color:var(--muted)}.pet-info p{margin:5px 0 0}.pet-edit{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.pet-edit label{display:grid;gap:4px}.pet-actions{grid-column:1/-1}
@media(max-width:600px){.pet-grid{grid-template-columns:1fr}.pet-edit{grid-template-columns:1fr}}

/* 조용한 상태 알림 */
#mini-toast{position:fixed;left:50%;bottom:22px;z-index:4000;max-width:calc(100vw - 32px);padding:8px 13px;border-radius:999px;background:#172033e8;color:#fff;font-size:13px;box-shadow:0 8px 24px #17203333;opacity:0;transform:translate(-50%,10px);pointer-events:none;transition:.18s}
#mini-toast.show{opacity:1;transform:translate(-50%,0)}

/* 전원 취침 안내 */
.sleep-gate{margin:0 0 14px;padding:22px;border:1px solid color-mix(in srgb,var(--p) 24%,var(--line));border-radius:24px;background:linear-gradient(135deg,#eff3ff,#f7efff);text-align:center}
.sleep-gate>div{font-size:38px}.sleep-gate h2{margin:6px 0}.sleep-gate p{margin:4px 0 14px;color:var(--muted)}

/* 모든 사진 업로드 공통 자르기 */
.crop-dialog{width:min(760px,calc(100vw - 24px));max-height:94dvh;padding:0;border:0;border-radius:25px;box-shadow:0 30px 90px #10182766}
.image-url-dialog{width:min(560px,calc(100vw - 24px));padding:0;border:0;border-radius:23px;box-shadow:0 30px 90px #10182766}.image-url-dialog::backdrop{background:#10182799;backdrop-filter:blur(4px)}.image-url-dialog form{padding:20px;display:grid;gap:14px}.image-url-dialog label{display:grid;gap:7px}.image-url-dialog h2{margin:0}
.crop-dialog::backdrop{background:#10182799;backdrop-filter:blur(4px)}
.crop-dialog form{padding:20px;display:grid;gap:12px}
.crop-dialog h2{margin:0}.crop-dialog .title button{padding:5px 11px;font-size:22px}
.crop-stage{width:100%;overflow:hidden;border-radius:18px;background:#192033}
.crop-stage canvas{display:block;width:100%;height:100%;object-fit:contain}
.crop-dialog label{display:grid;grid-template-columns:80px 1fr;align-items:center;gap:10px}
.crop-dialog input{min-height:34px;padding:0}.crop-dialog small{color:var(--muted)}
.crop-actions{display:flex;justify-content:flex-end;gap:8px}

@media(max-width:600px){
  .place{width:11.33%;height:15.5%;min-height:0;padding:2px;border-width:1px;box-shadow:0 2px 0 color-mix(in srgb,var(--place) 58%,#333)}
  .place.has-art{width:12.5%;height:19.5%}
  .place i{font-size:clamp(10px,4vw,27px)}
  .place-label{min-width:0;width:100%;padding:2px;border-width:1px}
  .place.has-art .building-name{bottom:-8px;max-width:70px;font-size:8px}
  .crop-dialog form{padding:14px}.crop-dialog label{grid-template-columns:68px 1fr}
}

/* 인물 이름은 지도 아이콘 아래, 사진 자르기는 직접 드래그 */
.person{flex-direction:column!important;align-items:center!important}
.person span{margin-top:-7px;padding:6px 10px!important}
.crop-stage{position:relative;cursor:grab;touch-action:none;user-select:none}
.crop-stage.dragging{cursor:grabbing}
.crop-guide{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);padding:6px 10px;border-radius:999px;background:#101827bd;color:#fff;font-size:12px;pointer-events:none;white-space:nowrap}
.home-life-log{margin-top:22px;box-shadow:none}
.owned-items{padding:12px;border-radius:16px;background:#f5f8ff}

/* 자연스러운 한국어 줄바꿈과 통합 생활 로그 */
body,button,input,select,small,b,p,span{word-break:keep-all;overflow-wrap:break-word}
.life-log li{cursor:default}
.life-log li:hover{background:transparent}
.life-log li.important{margin:5px 0;padding:11px 10px;border-left:5px solid var(--log-theme);border-radius:10px;background:color-mix(in srgb,var(--log-theme) 9%,#fff)}
.life-log li.important b,.life-log li.important time{color:var(--log-theme)}
.shared-life-log{margin-top:18px;box-shadow:none}
.home-family-log{margin-top:18px;box-shadow:none}.log-person{display:grid!important;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:9px}.log-person>.avatar,.log-person>.sprite{width:42px;height:42px}.log-person>span{display:grid}
.setting-card{display:grid;gap:10px;margin:18px 0;padding:18px;border:1px solid var(--line);border-radius:18px;background:#f7f9fc}
.setting-card h2{margin:0}.setting-card label{display:grid;gap:7px}.setting-card small{color:var(--muted)}

/* 방 안 반려동물 */
.room-pets{position:absolute;right:8px;top:48%;transform:translateY(-50%);z-index:4;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:5px}
.room-pet{display:flex;flex-direction:column;align-items:center;max-width:92px;padding:4px 6px;border-radius:12px;background:#ffffffe6;box-shadow:0 4px 10px #17203322}
.room-pet img,.room-pet>span{width:38px;height:38px;display:grid;place-items:center;object-fit:cover;border-radius:50%;font-size:25px}
.room-pet b{max-width:78px;font-size:11px;text-align:center}.room-pet small{max-width:82px;color:var(--muted);font-size:9px;text-align:center}
.pet-person{background:transparent!important}.pet-person .pet-emoji{background:color-mix(in srgb,var(--p) 10%,#fff);font-size:28px}
.building-preset{display:block!important;width:72%!important;height:auto!important;aspect-ratio:1;background-image:url("world-assets/common-building.png")!important;background-size:contain!important;background-position:center bottom!important;background-repeat:no-repeat!important;border-radius:0!important;transform:scale(var(--place-scale,1));transform-origin:center bottom;box-shadow:none!important}
.roster-card.away{opacity:.72}
.house-event-icon{display:grid!important;place-items:center;background:#eef2f5!important;font-size:21px}
.rooms,.room{overflow:visible}
.room{isolation:isolate}.room:hover,.room:focus-within{z-index:8}
.home-person{min-width:0;max-width:100%}.home-person img.avatar,.home-person img.sprite{object-fit:contain;object-position:center}
.room-people{max-width:calc(100% - 12px)}.room-people .home-person span{min-width:0;overflow-wrap:break-word}
.cars{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}.car-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px}.car-card{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid var(--line);border-radius:18px;background:#f7f9fc}.car-card>div{display:grid;gap:4px;flex:1}.car-card small{color:var(--muted)}.car-icon{font-size:38px}.car-edit{grid-template-columns:repeat(2,minmax(0,1fr))!important}.car-edit .danger{align-self:end}
.fields>label:has([data-image="photo"]){order:-20;grid-column:1/-1;padding:16px;border:2px solid color-mix(in srgb,var(--p) 28%,var(--line));border-radius:18px;background:color-mix(in srgb,var(--p) 5%,white)}
.profile-license .fields>label:has(>input[data-field="socialEnergy"]),.profile-license .fields>label:has(>input[data-field="sensingIntuition"]),.profile-license .fields>label:has(>input[data-field="thinkingFeeling"]),.profile-license .fields>label:has(>input[data-field="perceivingJudging"]){display:none}
.profile-license>.check{display:flex;margin:14px 0;padding:14px;border:1px solid var(--line);border-radius:16px;background:#f8fafc}
.personality-choice{padding:15px;border:1px solid var(--line);border-radius:18px;background:#f8fafc}.personality-choice>div{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px}.personality-choice>small{display:block;color:var(--muted);line-height:1.55}.personality-choice button.on{background:var(--grad);color:#fff;border-color:transparent}
.resident-setting{display:contents}.resident-setting label{display:grid;gap:3px;font-size:12px;color:var(--muted)}.resident-setting select{padding:8px}
.group-members{display:flex;flex-wrap:wrap;gap:8px;border:1px solid var(--line);border-radius:15px;padding:12px}.group-members[hidden]{display:none}.group-members label{display:flex;align-items:center;gap:6px;padding:8px 10px;border:1px solid var(--line);border-radius:12px;background:#f8fafc}.group-members input{width:auto}

/* 관찰 지도는 페이지 스크롤을 막지 않고 화면 너비에 맞춰 표시 */
.viewport{width:100%;height:auto;min-height:0;aspect-ratio:1672/941;overflow:visible;touch-action:pan-y;overscroll-behavior:auto}
.viewport .world{width:100%;height:100%;min-width:0;min-height:0}
.person{touch-action:pan-y}.person.icon-only{display:grid;place-items:center}.person.icon-only .avatar,.person.icon-only .sprite{margin:0}
@media(max-width:900px){
  header{display:flex;align-items:center}
  header nav{order:3;flex:0 0 100%;width:100%;max-width:100%;overflow-x:auto}
  header #save-state{order:2;margin-left:auto}
}
@media(max-width:600px){
  .roster-card{min-width:270px!important;width:auto!important;padding:9px 11px!important;display:flex!important;justify-content:flex-start!important;gap:9px!important}
  .roster-card>.roster-info{display:grid!important;min-width:0}
  .roster-card>.roster-info b{font-size:17px}.roster-card>.roster-info small{display:block;max-width:190px;overflow:visible;white-space:normal}
  .roster-card .avatar{width:46px!important;height:46px!important}.roster-card .sprite{width:52px!important;height:52px!important}
  .person .avatar{width:42px;height:42px}.person .sprite{width:52px;height:52px}
  .person.show-name{flex-direction:column}.person.show-name span{padding:3px 6px;font-size:11px}
}
@media(max-width:600px){.car-edit{grid-template-columns:1fr!important}}
.locked-option{color:var(--muted)}

/* 성격 슬라이더: 현재 선택과 양극을 한눈에 표시 */
.fields>label:has(>input[data-field="spiceTolerance"]),.fields>label:has(>input[data-field="sweetPreference"]){display:none}
.fields>label:has(>input[data-field="socialEnergy"]),.fields>label:has(>input[data-field="sensingIntuition"]),.fields>label:has(>input[data-field="thinkingFeeling"]),.fields>label:has(>input[data-field="perceivingJudging"]){display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;padding:14px;border:1px solid var(--line);border-radius:17px;background:#f8fafc;font-family:inherit}
.fields>label:has(>input[data-field="socialEnergy"]) b,.fields>label:has(>input[data-field="sensingIntuition"]) b,.fields>label:has(>input[data-field="thinkingFeeling"]) b,.fields>label:has(>input[data-field="perceivingJudging"]) b{grid-column:2;text-align:right;color:var(--p);font:700 15px/1.35 inherit}
.fields>label:has(>input[data-field="socialEnergy"]) input,.fields>label:has(>input[data-field="sensingIntuition"]) input,.fields>label:has(>input[data-field="thinkingFeeling"]) input,.fields>label:has(>input[data-field="perceivingJudging"]) input{grid-column:1/-1;grid-row:3}
.fields>label:has(>input[data-field="socialEnergy"])::before,.fields>label:has(>input[data-field="sensingIntuition"])::before,.fields>label:has(>input[data-field="thinkingFeeling"])::before,.fields>label:has(>input[data-field="perceivingJudging"])::before{grid-column:1;grid-row:2;color:var(--muted);font:600 12px/1.35 inherit}
.fields>label:has(>input[data-field="socialEnergy"])::after,.fields>label:has(>input[data-field="sensingIntuition"])::after,.fields>label:has(>input[data-field="thinkingFeeling"])::after,.fields>label:has(>input[data-field="perceivingJudging"])::after{grid-column:2;grid-row:2;text-align:right;color:var(--muted);font:600 12px/1.35 inherit}
.fields>label:has(>input[data-field="socialEnergy"])::before{content:"내향 · 혼자 충전"}.fields>label:has(>input[data-field="socialEnergy"])::after{content:"외향 · 사람과 충전"}
.fields>label:has(>input[data-field="sensingIntuition"])::before{content:"감각 · 현실과 경험"}.fields>label:has(>input[data-field="sensingIntuition"])::after{content:"직관 · 가능성과 상상"}
.fields>label:has(>input[data-field="thinkingFeeling"])::before{content:"사고 · 논리와 원칙"}.fields>label:has(>input[data-field="thinkingFeeling"])::after{content:"감정 · 공감과 가치"}
.fields>label:has(>input[data-field="perceivingJudging"])::before{content:"인식 · 유연한 즉흥"}.fields>label:has(>input[data-field="perceivingJudging"])::after{content:"판단 · 계획과 정리"}

/* 집에서 동거인들의 현재 장면을 화면 분할로 표시 */
.resident-scenes{margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}
.resident-scenes>.title{margin-bottom:12px}.resident-scenes>.title small{color:var(--muted)}
.resident-scenes>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
.resident-scene-card:only-child{grid-column:1/-1}
.resident-scene-card{min-width:0;padding:13px;border:1px solid color-mix(in srgb,var(--resident-theme) 30%,var(--line));border-radius:22px;background:#fff;box-shadow:0 10px 24px #1720330d}
.resident-profile{display:grid;grid-template-columns:minmax(90px,.8fr) 1fr;gap:12px;align-items:center}
.resident-profile>img{width:100%;height:150px;object-fit:cover;border-radius:17px}.resident-profile>.avatar,.resident-profile>.sprite{width:100%;height:150px;border-radius:17px}
.resident-profile h3{margin:0;font-size:27px}.resident-profile small{color:var(--muted)}
.resident-current{margin-top:11px;padding:13px;border-radius:17px;background:color-mix(in srgb,var(--resident-theme) 6%,#f5f7fb)}
.resident-current>small{color:var(--resident-theme)}.resident-current h3{margin:6px 0;font-size:21px}.resident-current p{margin:5px 0 9px}.resident-current>b{display:block}
.resident-current>img{display:block;width:100%;height:150px;margin-top:10px;border-radius:14px;object-fit:cover}
.town-edit .place{touch-action:none;user-select:none;-webkit-user-select:none}.town-edit>.world{touch-action:pan-y}
.routine-toolbar{display:flex;gap:8px;overflow-x:auto;margin:12px 0}.routine-toolbar button{white-space:nowrap}.weekly-table{display:grid;grid-template-columns:repeat(7,minmax(150px,1fr));gap:9px;min-width:1080px}.weekly-scroll{overflow-x:auto;padding-bottom:8px}.routine-day{min-height:260px;padding:10px;border:1px solid var(--line);border-radius:16px;background:#f7f9fc}.routine-day h3{position:sticky;top:0;margin:0 0 8px;padding:6px;background:#f7f9fc}.routine-block{display:grid;gap:3px;margin:7px 0;padding:9px;border-left:5px solid var(--p);border-radius:10px;background:#fff}.routine-block small{color:var(--muted)}.routine-block .routine-actions{display:flex;gap:5px;margin-top:5px}.routine-block button{padding:5px 7px;font-size:12px}
.routine-toolbar .avatar,.routine-toolbar .sprite{width:34px;height:34px;vertical-align:middle;margin-right:6px}.routine-toolbar .on{color:#fff;background:var(--grad)}textarea{width:100%;min-height:90px;border:1px solid var(--line);border-radius:15px;background:#f5f7fb;padding:13px;font:inherit}.relation-avatars{display:flex;align-items:center;gap:5px;margin-bottom:8px}.relation-avatars .avatar,.relation-avatars .sprite{width:58px;height:58px;margin:0;border:0!important;outline:0!important;box-shadow:none!important}.relation-avatars>*:nth-child(n+2){transform:none}
.pet-actions::before{content:"사진";flex:0 0 100%;font-weight:800}.pet-actions button:nth-of-type(1)::after{content:" 선택"}.pet-actions button:nth-of-type(2)::after{content:" · 이미지 주소"}.pet-actions button:nth-of-type(3),.pet-actions button:nth-of-type(4){display:none}
.backup-notice{width:min(520px,calc(100vw - 28px));padding:0;border:0;border-radius:22px;box-shadow:0 24px 80px #10182755}.backup-notice::backdrop{background:#10182788}.backup-notice form{display:grid;gap:15px;padding:22px}.backup-notice h2,.backup-notice p{margin:0}.backup-notice label{display:flex;align-items:center;gap:8px}.backup-notice input{width:auto;min-height:0}.backup-notice button{width:100%}
.place-config label:has([data-place-field="spicy"]),.place-config label:has([data-place-field="sweet"]){display:none!important}
.audience-open-button{width:100%;display:grid;gap:4px;text-align:left;padding:13px 15px}.audience-open-button small{color:var(--muted);white-space:normal}
.audience-dialog{width:min(680px,calc(100vw - 24px));padding:0;border:0;border-radius:22px;box-shadow:0 28px 90px #10182766}.audience-dialog::backdrop{background:#10182788}.audience-dialog form{display:grid;gap:14px;padding:20px}.audience-dialog h2{margin:0}.audience-dialog .title small{color:var(--muted)}.audience-dialog-list{display:flex;flex-wrap:wrap;align-content:flex-start;gap:7px;max-height:52vh;overflow-y:auto;padding:10px;border:1px solid var(--line);border-radius:16px;background:#f6f8fb}.audience-dialog-list button{padding:8px 11px}.audience-dialog-list button.on{color:#fff;background:var(--grad);border-color:transparent}.audience-dialog-list button[hidden]{display:none}.place-main-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;margin:8px 0 14px}.place-main-actions select{min-height:46px;padding:9px}.place-main-actions button{padding:9px 12px}
@media(max-width:600px){.place-main-actions{grid-template-columns:1fr}.audience-dialog form{padding:14px}.audience-dialog-list{max-height:58vh}}

@media(max-width:600px){
  /* 캐릭터 목록을 짧고 촘촘하게 */
  .editor>aside{padding:12px}
  .editor>aside>.title h2{font-size:23px}
  .editor>aside>.title button{padding:8px 11px}
  .char-sort-row{margin:4px 0}
  .char-sort-row .char-row{min-height:72px;padding:7px 9px;gap:7px}
  .char-row .avatar,.char-row .sprite{width:48px;height:48px}
  .char-row b{font-size:17px}.char-row small{font-size:13px}
  .sort-controls{gap:2px}.sort-controls button{width:28px;height:34px;font-size:10px}
  /* 방 안 인물은 아이콘 아래에 상태 전문 표시 */
  .home-person{flex-direction:column;align-items:center;max-width:145px}
  .home-person span{display:grid!important;max-width:140px!important;padding:5px 7px!important;text-align:center;white-space:normal!important}
  .home-person span small{max-width:135px!important;overflow:visible!important;text-overflow:clip!important;white-space:normal!important}
  .room-people{align-items:flex-start}
  .room-pets{right:4px;top:46%}.room-pet{max-width:68px;padding:3px}.room-pet img,.room-pet>span{width:31px;height:31px;font-size:21px}.room-pet b{font-size:9px}.room-pet small{max-width:62px;font-size:8px}
  .life-log .title{align-items:flex-start}.life-log .title small{max-width:48%;text-align:right}
  .resident-scenes>div{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .resident-scene-card{padding:7px;border-radius:16px}
  .resident-profile{grid-template-columns:1fr;gap:5px;text-align:center}.resident-profile>img,.resident-profile>.avatar,.resident-profile>.sprite{height:112px}
  .resident-profile h3{font-size:19px}.resident-profile small{font-size:12px}
  .resident-current{padding:8px;border-radius:12px}.resident-current h3{font-size:16px}.resident-current p,.resident-current b{font-size:12px}
  .resident-current>img{height:105px}
}

@media(max-width:600px){
  html,body,#app,main,header,.panel,.editor,.form{max-width:100%;min-width:0}
  body,#app,main{overflow-x:hidden}
  main>*{min-width:0;max-width:100%}
  .editor{display:block;width:100%;overflow:hidden}
  .editor>aside,.editor>.form{width:100%;min-width:0;padding:12px}
  .character-menu{width:100%;max-width:100%;flex-wrap:wrap;overflow-x:hidden}
  .character-menu button{flex:1 1 auto}
  .chips{min-width:0;max-width:100%;overflow:hidden}
  .chips button{max-width:100%;white-space:normal;overflow-wrap:break-word}
  .fields,.pet-edit,.relationship-grid{grid-template-columns:minmax(0,1fr)}
  .town-edit{width:100%;max-width:100%;overflow:hidden}
  .town-edit>.world{width:100%;min-width:0;aspect-ratio:1200/676;height:auto}
  .map-place-label{z-index:40;min-width:78px;max-width:116px;transform:translate(-50%,calc(-100% - 20px));font-size:12px;line-height:1.15}
  .map-place-label small{font-size:9px}
  .place-people-faces .avatar,.place-people-faces .sprite{width:43px!important;height:48px!important}
}
