:root{font-family:system-ui,-apple-system,Noto Sans Thai,Tahoma,sans-serif;color:#241477;background:#eee7ff;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #8b48ee;outline-offset:3px}.app-shell{max-width:540px;min-height:100dvh;margin:auto;padding:22px 19px 115px;background:linear-gradient(135deg,#f4edff,#e9e0ff 48%,#f2e9ff);box-shadow:0 0 70px #b9a5e34d}.app-header{display:flex;justify-content:space-between;align-items:center;margin:0 7px 14px;gap:8px}.brand{display:flex;align-items:center;text-align:left;gap:10px;border:0;background:none;padding:0;min-width:0;color:#231178}.brand img{width:48px;height:48px;border-radius:14px;object-fit:cover}.brand span{display:flex;flex-direction:column;min-width:0}.brand strong{font-size:clamp(16px,4.4vw,23px);white-space:nowrap}.brand small{font-size:11px;color:#6152a1}.header-actions{display:flex;gap:9px}.round-icon{border:0;background:#ffffffb9;border-radius:50%;height:42px;width:42px;display:grid;place-items:center;color:#5445ac;box-shadow:0 5px 15px #6f56a31c}.round-icon svg{width:22px}.hero{border-radius:27px;overflow:hidden;margin-bottom:8px;box-shadow:0 10px 18px #7860b21b}.hero img{display:block;width:100%;height:auto}.panel{border-radius:26px;background:#ffffffa8;box-shadow:0 5px 15px #7e68ba1c;padding:13px 15px;margin:9px 0}.panel h2{font-size:clamp(19px,5vw,25px);margin:0 0 2px;font-weight:800;line-height:1.3}.sub{font-size:12.5px;margin:2px 0 10px;color:#51458d}.emotion-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.emotion{border:2px solid transparent;background:linear-gradient(135deg,#f1eaff,#e6dafa);border-radius:18px;min-height:78px;padding:5px 1px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#241477}.emotion span{font-size:29px;line-height:1.1}.emotion strong{font-size:12px;white-space:nowrap}.emotion.chosen{border-color:#9056e6;background:#ddc8ff}.feedback{font-size:11px;color:#61439b;margin:9px 0 0;display:flex;gap:5px;align-items:center}.help-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.help-option{display:flex;align-items:center;gap:7px;border:0;background:linear-gradient(110deg,#f2e8ff,#ede3ff);color:#241477;padding:7px 8px;border-radius:22px;min-width:0}.help-option:nth-child(3){background:linear-gradient(110deg,#ffe6f5,#f7e7ff)}.help-option strong{font-size:11px;flex:1;text-align:left;white-space:nowrap}.help-emoji{font-size:24px;border-radius:50%;background:#ffffff7f;width:33px;height:33px;display:grid;place-items:center}.help-option svg{width:16px;flex-shrink:0}.room-heading{display:flex;gap:9px;align-items:center}.room-heading:first-letter{color:#8a55ed}.indent{margin-left:35px}.room-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.room-card{grid-column:span 2;position:relative;min-width:0;min-height:102px;border:0;border-radius:20px;overflow:hidden;padding:0;background:#d9c6f9;color:#251276}.room-card:nth-child(4),.room-card:nth-child(5){grid-column:span 3}.room-card img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.room-card span{position:absolute;bottom:0;left:0;right:0;min-height:34px;border-radius:19px 19px 0 0;background:linear-gradient(110deg,#f5eaffee,#f1e8ffed);display:flex;align-items:center;justify-content:space-between;padding:4px 7px;font-size:clamp(10px,2.6vw,14px);font-weight:800;white-space:nowrap}.room-card svg{width:15px;flex-shrink:0}.sos-banner{display:flex;align-items:center;width:100%;margin-top:13px;padding:13px;min-height:80px;background:linear-gradient(120deg,#ff779f,#f63d75);border:0;border-radius:27px;color:#fff;box-shadow:0 8px 20px #ff5b9150;text-align:left;gap:12px}.sos-icon{font-size:34px;border-right:1px solid #ffffff7f;padding-right:10px}.sos-text{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}.sos-text strong{font-size:clamp(19px,5vw,27px)}.sos-text small{font-size:10px;line-height:1.3}.sos-next{display:grid;place-items:center;border-radius:50%;background:#fff;color:#e83b74;width:37px;height:37px;flex-shrink:0}.bottom-nav{position:fixed;z-index:5;bottom:10px;left:50%;transform:translate(-50%);width:min(calc(100% - 30px),510px);display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:#ffffffed;border-radius:29px;padding:7px;box-shadow:0 9px 30px #6b54ad30}.bottom-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:0;border-radius:23px;background:transparent;color:#574a92;min-height:64px;padding:4px 1px}.bottom-nav button span{font-size:10px;line-height:1.2}.bottom-nav button.active{background:#e2d2ff;color:#8137eb;font-weight:800}.detail{padding:10px 3px}.back{display:flex;align-items:center;gap:7px;border:0;background:transparent;color:#51449b;padding:7px 0 18px}.back svg{width:19px}.detail h1{font-size:25px;margin:12px 0}.room-hero{width:100%;height:215px;object-fit:cover;border-radius:26px}.detail p{line-height:1.7}.notice{color:#655a91;font-size:12px}.soft-button{display:flex;justify-content:center;align-items:center;gap:8px;background:#e8d9ff;color:#342183;border:0;border-radius:17px;padding:12px 15px;font-weight:700;width:100%;margin-top:15px}.sos-detail{border-radius:28px;background:#fff2f8;padding:24px 20px;text-align:center}.sos-detail>svg{color:#e93b76}.sos-links{display:grid;gap:10px}.sos-links a{display:flex;align-items:center;justify-content:center;gap:9px;padding:13px;background:#fa477f;color:#fff;text-decoration:none;border-radius:17px;font-weight:800}.placeholder{text-align:center;padding:30px 20px}.placeholder>img{width:125px;border-radius:30px}.profile-links{display:grid;gap:7px}.profile-links button{border:0;border-radius:14px;background:#e8dbff;padding:14px;display:flex;justify-content:space-between;color:#27127a}.modal-backdrop{position:fixed;z-index:10;top:0;right:0;bottom:0;left:0;background:#1b0e4a88;display:grid;place-items:center;padding:25px}.modal{background:#fff9ff;padding:25px;border-radius:25px;width:min(100%,390px);position:relative}.modal-close{position:absolute;right:15px;top:15px;border:0;background:none;color:#4d3d90}@media(max-width:390px){.app-shell{padding-left:12px;padding-right:12px}.brand img{width:42px;height:42px}.brand strong{font-size:17px}.round-icon{width:36px;height:36px}.help-option{gap:4px;padding:6px 4px}.help-option strong{font-size:10px}.emotion strong{font-size:11px}.room-card span{font-size:10px}}.room-grid{grid-template-columns:repeat(6,minmax(0,1fr));align-items:stretch;gap:9px}.room-card{display:block;grid-column:span 2;aspect-ratio:1.25;min-height:0;isolation:isolate}.room-card:nth-child(4),.room-card:nth-child(5){grid-column:span 3;aspect-ratio:1.85}.room-card img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.room-card span{box-sizing:border-box;position:absolute;bottom:0;left:0;right:0;min-height:36px;max-height:55%;border-radius:14px 14px 0 0;display:flex;gap:3px;align-items:center;justify-content:space-between;padding:6px 7px;font-size:clamp(9px,2.2vw,12px);line-height:1.2;white-space:normal;overflow-wrap:anywhere;text-align:left;overflow:hidden}.room-card svg{width:14px;min-width:14px;height:14px;flex-shrink:0}@media(max-width:390px){.room-card span{font-size:10px;padding:5px}.room-grid{gap:6px}}