*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:#e4e4e6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.page-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:24px}.page-header{width:900px;max-width:100%;margin-bottom:24px;text-align:left}.title{font-size:28px;font-weight:700;color:#111827;margin:0}.subtitle{display:inline-block;font-size:14px;font-weight:500;color:#4b5563;margin-top:12px;background-color:#e5e7eb;padding:4px 12px;border-radius:999px}.app-container{display:flex;width:900px;max-width:100%;height:750px;max-height:80vh;background-color:#fff;border-radius:24px;box-shadow:0 40px 80px -20px #0003;overflow:hidden}.left-panel{flex:1;background-color:#f0f0f0;padding:40px;display:flex;flex-direction:column;gap:20px}.right-panel{width:300px;background-color:#fff;padding:40px 20px;display:flex;flex-direction:column;align-items:center;text-align:center}.sidebar-title{font-size:14px;font-weight:600;color:#374151;margin-bottom:16px}.sidebar-caption{font-size:13px;color:#6b7280;margin-top:16px;max-width:200px;line-height:1.5}.rive-container{width:128px;height:128px;cursor:pointer;border-radius:22px;border:1px solid #d0d5dd;position:relative;overflow:hidden}.rive-container canvas{width:100%;height:100%}.placeholder{background-color:#d9d9d9;border-radius:8px;display:flex;align-items:center;padding:0 12px}.mock-ui-label,.mock-ui-button{font-size:14px;color:#8a8a8a;font-weight:500}.mock-ui-button{color:#f0f0f0;background-color:#c4c4c4;padding:4px 10px;border-radius:5px}.header{width:60%;height:32px}.subheader{width:40%;height:20px}.line{width:80%;height:28px}.line.short{width:60%}.image-box{width:100%;height:150px;justify-content:center}@media (max-width: 900px){.app-container{flex-direction:column;height:auto;max-height:none}.page-header{text-align:center}.right-panel{width:100%;order:1;padding:24px}.left-panel{width:100%;order:2;padding:24px;gap:16px}}