:root{--line: #3a2440;--text: #3a2440;--muted: #8f6f93;--paper: #fffafc;--paper2: #ffe6f0;--dash: #e3d4ff;--pink: #ff5c93;--pink-d: #d93a73;--pink-l: #ffa3c4;--blue: #4aa8ff;--blue-d: #2f7fd1;--blue-l: #9fd0ff;--frame: #7cc4ec;--frame-d: #4f9fd0;--star: #ffd23f;--star-l: #fff4c7;--ok: #2fae61;--app-height: 100dvh;color-scheme:light}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;overflow:hidden}body{font-family:Galmuri11,Apple SD Gothic Neo,sans-serif;color:var(--text);font-size:13px;background:radial-gradient(#ffffff 1.5px,transparent 1.6px) 0 0 / 22px 22px,linear-gradient(160deg,#ffd1e4,#e6dcff 58%,#d4f1ff);background-color:#ffe3ef;-webkit-font-smoothing:none;-webkit-tap-highlight-color:transparent}button,input{font:inherit;color:inherit}canvas{image-rendering:pixelated;image-rendering:crisp-edges}:focus-visible{outline:3px solid var(--pink);outline-offset:2px}.muted{color:var(--muted)}kbd{display:inline-block;padding:0 4px;border:2px solid var(--line);background:#fff;font:inherit;font-size:11px;line-height:16px}.paper{background:var(--paper);border:4px solid var(--line);box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 5px var(--dash)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 16px;border:3px solid var(--line);background:var(--pink);color:#fff;cursor:pointer;white-space:nowrap;box-shadow:inset -3px -3px 0 var(--pink-d),inset 3px 3px 0 var(--pink-l);text-shadow:1px 1px 0 var(--pink-d)}.btn:hover{filter:brightness(1.06)}.btn:active{transform:translateY(2px);box-shadow:inset 3px 3px 0 var(--pink-d)}.btn:disabled{filter:grayscale(1);opacity:.55;cursor:not-allowed;transform:none}.btn.blue{background:var(--blue);box-shadow:inset -3px -3px 0 var(--blue-d),inset 3px 3px 0 var(--blue-l);text-shadow:1px 1px 0 var(--blue-d)}.btn.ghost{background:#fff;color:var(--text);text-shadow:none;box-shadow:inset -3px -3px #f2d3e0,inset 3px 3px #fff}.btn.small{padding:5px 10px;font-size:12px}.btn.tiny{padding:2px 7px;font-size:11px;border-width:2px;box-shadow:none}.btn.wide{width:100%}.page{height:var(--app-height);display:flex;align-items:center;justify-content:center;padding:12px}.login{width:min(720px,100%);max-height:100%;overflow:auto;padding:22px 26px;box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 5px var(--dash),0 8px 0 var(--line)}.logo{margin:0;text-align:center;font-size:38px;letter-spacing:3px;color:var(--pink);text-shadow:3px 3px 0 #fff,6px 6px 0 var(--line)}.tagline{text-align:center;color:var(--muted);margin:12px 0 18px}.login-body{display:flex;gap:22px;flex-wrap:wrap;justify-content:center}.login-art{display:flex;flex-direction:column;align-items:center;gap:8px}.login-form{flex:1;min-width:250px;display:flex;flex-direction:column;gap:10px}.field{display:flex;flex-direction:column;gap:4px;color:var(--muted)}.field input{border:3px solid var(--line);padding:8px 10px;background:#fff;outline:none;color:var(--text)}.field input:focus{border-color:var(--pink)}.field input[aria-invalid=true]{border-color:#e0344f}.row{display:flex;gap:8px;flex-wrap:wrap}.error{margin:0;padding:6px 8px;background:#ffe0e6;border:2px solid #e0344f;color:#a01d38}.portrait{display:grid;place-items:end center;aspect-ratio:1;width:100%;max-width:190px;margin:0 auto;border:3px solid var(--line);background:linear-gradient(#bfe6ff 0 62%,#9fdc7c 62%);overflow:hidden}.portrait canvas{width:62%;height:auto;margin-bottom:6%}.login-art .portrait{width:200px}.portrait.small{width:64px;flex:none}.hompy{position:relative;width:min(1500px,100%);height:100%;display:grid;grid-template-columns:218px minmax(0,1fr) 86px;gap:12px;padding:12px 0 12px 12px;background:radial-gradient(#ffffff66 1.5px,transparent 1.6px) 0 0 / 14px 14px,var(--frame);border:4px solid var(--line);box-shadow:0 8px 0 var(--line)}.profile{display:flex;flex-direction:column;gap:9px;padding:12px;min-height:0;overflow-y:auto}.today{text-align:center;font-size:11px;letter-spacing:1px;padding-bottom:7px;border-bottom:3px dashed var(--dash)}.today b{color:#ff4d6d}.today span{color:var(--dash)}.me-name{margin:0;text-align:center;font-size:15px}.mood{margin:0;padding:5px 7px;border:3px dashed var(--dash);font-size:11px;color:var(--muted);text-align:center}.row-badges{display:flex;gap:6px;justify-content:center}.stars-badge,.tag{padding:2px 9px;border:3px solid var(--line);background:var(--star-l);font-weight:700}.tag{background:#fff;color:var(--pink);font-weight:400}.star-card{display:flex;flex-direction:column;gap:6px;padding:9px;background:var(--paper2);border:3px solid var(--line)}.star-card-head{display:flex;justify-content:space-between;align-items:center}.star-card-head b{color:var(--pink-d)}.timer{padding:0 6px;background:var(--line);color:var(--star);font-weight:700}.star-line{margin:0;font-size:12px}.star-line b{color:var(--pink);font-size:14px}.star-line .pending{color:var(--muted);font-size:11px}.shop-pending{margin:0;padding:6px 12px;font-size:12px;color:var(--muted);border-bottom:3px dashed var(--dash)}.ranking{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;font-size:12px}.ranking li{display:flex;gap:6px;align-items:center;padding:1px 4px;background:#fff;border:2px solid var(--line)}.ranking li.mine{background:var(--star-l)}.ranking li span{width:16px;color:var(--pink);font-weight:700}.ranking li b{margin-left:auto}.save-state{margin:0;font-size:11px;color:var(--blue-d)}.room{display:flex;flex-direction:column;min-width:0;min-height:0;padding:10px;gap:8px}.room-title{display:flex;align-items:baseline;gap:8px;flex-wrap:nowrap;padding:0 2px 7px;border-bottom:3px dashed var(--dash);white-space:nowrap;overflow:hidden}.brand,.zone-name{font-size:16px;color:var(--pink)}.url{color:var(--muted);font-size:11px;overflow:hidden;text-overflow:ellipsis}.online{margin-left:auto;font-size:12px;color:var(--ok)}.online:before{content:"";display:inline-block;width:8px;height:8px;margin-right:6px;background:currentColor}.online.connecting{color:var(--blue-d)}.online.disconnected{color:#e0344f}.online.solo{color:var(--muted)}.online.reconnecting{color:#e0344f}.ping{margin-left:8px;font-size:11px;white-space:nowrap}.ping.good{color:var(--ok)}.ping.slow{color:#c98a00}.ping.bad{color:#e0344f}.stage{position:relative;flex:1;min-height:0;border:3px solid var(--line);background:#3a2440;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;cursor:pointer}.world{position:absolute;inset:0;width:100%;height:100%;display:block}.strip{display:none}.room-tools{display:flex;align-items:center;gap:8px;min-height:30px}.hint{margin-left:auto;color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.only-compact{display:none}.tabs{display:flex;flex-direction:column;gap:6px;padding-top:54px;margin-right:-4px}.tabs button{display:flex;align-items:center;gap:5px;padding:9px 8px;background:var(--frame-d);color:#fff;cursor:pointer;text-align:left;border:4px solid var(--line);border-left:0;box-shadow:0 4px 0 var(--line);text-shadow:1px 1px 0 var(--line);white-space:nowrap}.tabs button:hover{background:#63b3e0}.tabs button[aria-pressed=true]{background:#fff;color:var(--pink);text-shadow:none}.chat{position:absolute;left:8px;bottom:8px;width:min(460px,calc(100% - 16px));height:min(60%,400px);display:flex;flex-direction:column;border:3px solid var(--line)}.chat-head,.chat-form{cursor:auto}.chat-head{display:flex;align-items:center;gap:6px;padding:4px 6px;border-bottom:2px dashed var(--line);font-size:12px}.chat-head b span{color:var(--pink)}.opacity{display:flex;align-items:center;gap:4px;margin-left:auto;font-size:11px}.opacity input{width:70px;accent-color:var(--pink)}.opacity span{width:30px;text-align:right}.chat-log{flex:1;min-height:0;overflow-y:auto;padding:4px 8px;font-size:13px;line-height:1.5;cursor:crosshair;user-select:none}.chat-log p{margin:0 0 2px;word-break:break-all}.chat-log b{color:var(--pink-d)}.chat-log .mine b{color:var(--blue-d)}.chat-log .empty{color:var(--muted)}.chat-form{display:flex;gap:5px;padding:5px;border-top:2px dashed var(--line)}.chat-form input{flex:1;min-width:0;border:2px solid var(--line);padding:5px 7px;background:#fff;outline:none;font-size:13px}.chat-form input:focus{border-color:var(--pink)}.chat-fab{position:absolute;left:8px;bottom:8px;display:flex;align-items:center;gap:6px;padding:5px 9px;background:#fff;border:3px solid var(--line);cursor:pointer;font-size:12px}.badge{min-width:18px;padding:0 4px;background:#ff4d6d;color:#fff;border:2px solid var(--line);font-size:11px;text-align:center}.dpad{position:absolute;right:10px;bottom:10px;display:none;grid-template-columns:repeat(3,44px);grid-template-rows:repeat(3,44px)}.pad{border:3px solid var(--line);background:#ffffffd1;color:var(--line);font-size:15px;touch-action:none;cursor:pointer}.pad:active{background:var(--pink-l)}.pad.위{grid-area:1 / 2}.pad.왼쪽{grid-area:2 / 1}.pad.아래{grid-area:3 / 2}.pad.오른쪽{grid-area:2 / 3}.toast{position:absolute;top:8px;left:50%;transform:translate(-50%);max-width:calc(100% - 16px);padding:6px 12px;background:var(--line);color:#fff;border:3px solid #fff;font-size:12px;text-align:center}.shop{width:min(560px,100%)}.shop .notebook-head .stars-badge{margin-left:auto;font-size:12px}.shop-tabs{display:flex;gap:4px;padding:8px 12px 0}.shop-tabs button{flex:1;padding:6px 0;border:3px solid var(--line);border-bottom:0;background:#d4f1ff;color:var(--line);font-weight:700;cursor:pointer}.shop-tabs button[aria-selected=true]{background:#fff;color:var(--pink-d)}.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:8px;align-content:start;border-top:3px solid var(--line)}.shop-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 4px;border:3px solid var(--line);background:#fff;text-align:center;font-size:12px}.shop-item.worn{background:var(--pink-l)}.shop-item .muted{font-size:11px}.item-icon{width:64px;height:64px;image-rendering:pixelated;background:#fffafc;border:2px dashed var(--dash)}.notebook-foot.muted{font-size:11px;justify-content:center}.owned-list{margin:4px 0;font-size:12px;line-height:1.6}.edit-bar{position:absolute;left:8px;right:8px;top:8px;display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;padding:6px 8px;background:#fffafcf0;border:3px solid var(--line);cursor:auto}.edit-bar p{flex-basis:100%;margin:0;font-size:12px;color:var(--pink-d);font-weight:700}.edit-items{flex:1;min-width:0;display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}.edit-item{display:flex;align-items:center;gap:4px;flex:none;padding:2px 6px 2px 2px;border:2px solid var(--line);background:#fff;font-size:11px;cursor:pointer}.edit-item .item-icon{width:28px;height:28px}.edit-item.placed{background:#e3f6d8}.edit-item.on{background:var(--pink-l);outline:3px solid var(--pink)}.edit-bar .row{display:flex;gap:6px}.sheet-backdrop{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:16px;background:#3a244059}.sheet-backdrop.offline{z-index:40}.notebook{width:min(400px,100%);max-height:100%;display:flex;flex-direction:column;box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 5px var(--dash),0 8px 0 var(--line)}.notebook-head,.notebook-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px}.notebook-head{border-bottom:3px dashed var(--dash);color:var(--pink-d)}.notebook-foot{border-top:3px dashed var(--dash)}.notebook-body{flex:1;min-height:0;overflow-y:auto;padding:10px 14px}.setup{width:min(520px,100%)}.setup-brand{padding:14px 12px 4px;text-align:center}.setup-brand .tagline{margin:6px 0 0}.setup-body{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-start;justify-content:center}.setup-body .portrait{width:120px;flex:none}.setup-fields{flex:1;min-width:220px;display:flex;flex-direction:column;gap:8px}.swatches{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px;align-items:center}.swatches legend{width:100%;padding:0 0 4px;font-size:12px;color:var(--pink-d)}.swatch{width:28px;height:28px;border:2px solid var(--line);border-radius:6px;cursor:pointer;padding:0}.swatch[aria-pressed=true],.swatches .btn[aria-pressed=true]{outline:3px solid var(--pink-d);outline-offset:2px}.loading{padding:18px 24px}.nb-profile{display:flex;gap:10px;align-items:center}.nb-profile h3{margin:0;font-size:15px}.nb-profile p{margin:2px 0 0;color:var(--muted);font-size:11px}.notebook h4{margin:14px 0 6px;color:var(--pink-d);display:flex;justify-content:space-between}.record{display:flex;justify-content:space-between;align-items:center;padding:5px 8px;margin-bottom:4px;background:#fff;border:2px solid var(--line)}.record small{display:block;color:var(--muted);font-size:10px}.notebook .empty{color:var(--muted);margin:4px 0}@media(max-width:899px),(max-height:519px){body{font-size:12px}.page{padding:6px}.hompy{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:6px;padding:6px;box-shadow:0 4px 0 var(--line)}.profile{display:none}.tabs{order:-1;flex-direction:row;padding:0;margin:0;gap:4px}.tabs button{flex:1;justify-content:center;padding:6px 4px;border:3px solid var(--line);box-shadow:0 3px 0 var(--line)}.room{padding:6px;gap:6px}.room-title{padding-bottom:5px}.brand,.url{display:none}.zone-name{font-size:14px}.hint{display:none}.only-compact{display:inline-flex}.dpad{display:grid;grid-template-columns:repeat(3,38px);grid-template-rows:repeat(3,38px)}.strip{display:block;position:absolute;top:6px;left:6px;right:6px;pointer-events:none}.strip .star-card{flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 8px;padding:4px 6px;background:#ffe6f0eb}.strip .star-card-head{gap:6px}.strip .star-line{flex:1;min-width:120px;font-size:11px}.strip .star-line.muted{display:none}.strip .star-card-head{flex:1}.strip .ranking{flex-direction:row;flex-basis:100%;order:5;font-size:11px}.strip .ranking li{flex:1;min-width:0;overflow:hidden;white-space:nowrap}.strip .ranking li:nth-child(n+3){display:none}.strip .save-state{flex-basis:100%;order:6}.chat{width:min(380px,calc(100% - 148px));min-width:180px;height:55%}.opacity input{width:54px}}@media(max-width:420px){.chat{width:calc(100% - 140px);min-width:0}.chat-head b{display:none}}@media(max-height:519px)and (orientation:landscape){.hompy{grid-template-columns:minmax(0,1fr) 76px;grid-template-rows:minmax(0,1fr)}.tabs{order:0;flex-direction:column;justify-content:flex-start;padding-top:4px}.tabs button{flex:none}.room-tools{min-height:26px}}@media(pointer:coarse){.dpad{display:grid}}@media(prefers-reduced-motion:reduce){.btn:active{transform:none}}
