:root{font-family:'Malgun Gothic','Apple SD Gothic Neo',system-ui,sans-serif;color:#304337;background:#e8e4d9}*{box-sizing:border-box}body{margin:0;overflow:hidden}#studio{position:fixed;inset:0;width:100%;height:100%;touch-action:none;outline:none}header{position:fixed;top:28px;left:35px;right:35px;display:flex;justify-content:space-between;align-items:center;pointer-events:none;font-size:13px}header a{pointer-events:auto;color:#3d5944;text-decoration:none;background:#fff9ecbc;border:1px solid #fffdf2;border-radius:22px;padding:11px 17px}header span{font-weight:700;letter-spacing:-.5px}main{position:absolute;top:50%;left:5%;transform:translateY(-50%);width:320px;max-height:calc(100dvh - 150px);overflow:auto;padding-right:5px}main .eyebrow{color:#87927b;letter-spacing:2px;font-size:9px;font-weight:700}h1{font-family:Georgia,'Batang',serif;font-weight:500;letter-spacing:-2px;font-size:38px;line-height:1.45;margin:14px 0}p{font-size:12px;line-height:1.9;color:#7b8773}.reference{display:flex;align-items:center;gap:16px;margin:24px 0;padding:13px 17px;background:#fffdf382;border:1px solid #fffcee;border-radius:15px}.reference img{width:57px;height:78px;object-fit:contain}.reference strong{font-size:13px;display:block;margin-bottom:7px}.reference small{font-size:10px;line-height:1.8;color:#829078}.controls{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}button{font:inherit;cursor:pointer;touch-action:manipulation;min-height:41px;border:1px solid #c3cdb6;border-radius:9px;background:#f9f8eecc;color:#4b6348;font-size:11px}button:hover,button[aria-pressed=true]{background:#395e45;color:#fff9e8;border-color:#395e45}.front-button{width:100%;margin-top:10px;background:transparent;border-color:#b8c3ac}.note{font-size:10px;margin-top:12px}#studioStatus{position:fixed;bottom:40px;left:68%;transform:translateX(-50%);padding:11px 22px;border:1px solid #fff9e9;background:#fdfaf0df;border-radius:24px;color:#4e6546;font-size:12px;white-space:nowrap}.view-hint{position:fixed;bottom:17px;left:68%;transform:translateX(-50%);font-size:9px;letter-spacing:.3px;color:#8a967f}button:focus-visible,a:focus-visible{outline:3px solid #cda95f;outline-offset:3px}@media(max-width:760px){header{top:14px;left:15px;right:15px}header span{font-size:12px}header a{font-size:11px;padding:8px 12px}main{top:auto;bottom:18px;left:16px;right:16px;width:auto;max-height:35dvh;transform:none;padding:14px;background:#fbf8eef0;border:1px solid #fff9e9;border-radius:16px}h1,.reference,main>p,main>.eyebrow,.note{display:none}.controls{grid-template-columns:repeat(5,1fr);gap:5px}button{font-size:10px;min-height:36px}.front-button{margin-top:7px}#studioStatus{bottom:auto;top:69px;left:50%;font-size:11px}.view-hint{bottom:auto;top:111px;left:50%;white-space:nowrap}}

.avatar-switch{display:flex;gap:7px;margin:12px 0}.avatar-switch a{flex:1;text-align:center;text-decoration:none;font-size:11px;padding:10px 8px;border:1px solid #bdc8b2;border-radius:10px;color:#4b6348;background:#fff9edb0}.avatar-switch a[aria-current=page]{background:#395e45;color:#fff9e8;border-color:#395e45}
@media(max-width:760px){.avatar-switch{margin:0 0 9px}.avatar-switch a{padding:7px 8px;font-size:10px}main{max-height:40dvh}}
