*,*:before,*:after{box-sizing:border-box}:root{color:#1f1f2b}body{margin:0;min-height:100vh;font-family:Segoe UI,SF Pro Display,system-ui,-apple-system,sans-serif;background:linear-gradient(160deg,#ffd5ec,#c7b9ff 55%,#b8ecff);display:flex;align-items:center;justify-content:center;padding:32px 16px;color:#1f1f2b;position:relative;overflow:hidden}.app-shell{width:100%;max-width:420px;position:relative;z-index:1}.floating-hearts{position:fixed;inset:0;z-index:0;pointer-events:none}.floating-hearts .heart{position:absolute;bottom:-40px;animation-name:floatHeart;animation-iteration-count:infinite;animation-timing-function:linear}@keyframes floatHeart{0%{transform:translateY(0) scale(.8);opacity:0}40%{opacity:1}to{transform:translateY(-120vh) scale(1.2);opacity:0}}.phone-shell{background:linear-gradient(180deg,#fff,#fffbff);border-radius:42px;box-shadow:0 20px 45px #df96c866,inset 0 0 0 1px #fff6;padding:32px 20px 18px;display:flex;flex-direction:column;gap:18px;position:relative}.top-bar{text-align:center}.status-line{font-size:.85rem;color:#9b7fb4;margin:0}.top-bar h1{margin:6px 0 4px;font-size:1.9rem;color:#473059}.subtitle{margin:0;color:#8f7fa8;font-size:.95rem}.content-area{flex:1;min-height:420px;display:flex;flex-direction:column;gap:18px}.card{background:linear-gradient(155deg,#ffffffeb,#fff0faf2);border-radius:28px;padding:20px;box-shadow:0 12px 30px #c1a0d040,inset 0 1px #fff9;display:flex;flex-direction:column;gap:16px}.card-header{display:flex;align-items:center}.card-header.spaced{justify-content:space-between}.card-title{margin:0;font-size:1.15rem;color:#473059}.chip{display:inline-flex;align-items:center;justify-content:center;padding:4px 12px;border-radius:999px;font-size:.8rem;color:#7e4d7a;background:linear-gradient(120deg,#ffe0f4,#e2d6ff);box-shadow:inset 0 1px #ffffffb3}.card-description{margin:0;color:#74607e;font-size:.95rem;line-height:1.4}.chat-window{background:linear-gradient(180deg,#ffebf5b3,#f2e7ffcc);border-radius:22px;padding:18px 14px;max-height:320px;overflow-y:auto;display:flex;flex-direction:column;gap:12px;position:relative}.message-row{display:flex;align-items:flex-end;gap:8px}.message-row.align-right{justify-content:flex-end}.avatar{width:36px;height:36px;border-radius:50%;background:#f5d9ff;color:#7b4f9f;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.95rem;box-shadow:inset 0 1px 3px #00000014}.heart-avatar{background:#ffd8e8;color:#d96a8f}.message-bubble{padding:12px 15px;border-radius:18px;max-width:80%;line-height:1.35;box-shadow:0 6px 15px #7d569626}.bubble-talha{background:#fff;color:#463b51}.bubble-tuana{background:#ffccdf;color:#5c3f58}.typing-bubble{display:inline-flex;gap:6px}.typing-dot{width:6px;height:6px;border-radius:50%;background:#c09ad6;animation:typing 1.2s infinite ease-in-out}.typing-dot:nth-child(2){animation-delay:.2s}.typing-dot:nth-child(3){animation-delay:.4s}@keyframes typing{0%,80%,to{transform:translateY(0);opacity:.4}40%{transform:translateY(-3px);opacity:1}}.chat-options{background:#ffffffd9;border-radius:20px;padding:16px;box-shadow:inset 0 1px #fff9}.chat-question{margin:0 0 12px;color:#5f466a;font-weight:600}.option-grid{display:flex;flex-direction:column;gap:10px}.option-grid button{border:none;border-radius:999px;padding:10px 16px;background:linear-gradient(120deg,#ffd6ec,#e6d6ff);color:#60345e;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease;box-shadow:0 10px 20px #bc89b440}.option-grid button:hover{transform:translateY(-2px) scale(1.02)}.chat-finished{text-align:center;color:#6a4b74;font-weight:600}.polaroid-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px}.polaroid{background:#fff;border-radius:18px;padding:12px;box-shadow:0 12px 20px #8d719a26;display:flex;flex-direction:column;gap:8px}.polaroid-photo{border-radius:14px;background:linear-gradient(135deg,#ffd2e9,#d8c9ff);height:90px;display:flex;align-items:center;justify-content:center;font-size:1.6rem}.polaroid-text h3{margin:0;font-size:1rem;color:#4a3650}.polaroid-text p{margin:4px 0 6px;color:#7a637e;font-size:.9rem}.polaroid-tag{font-size:.8rem;color:#a16dae;font-weight:600}.card-footer-note{margin:0;font-size:.9rem;color:#7b6a8a;text-align:center}.quiz-question h4{margin:0 0 6px;color:#4f2f54}.quiz-question ul{margin:0;padding-left:18px;color:#6b4f76}.love-bar{width:100%;height:16px;border-radius:999px;background:#fffc;box-shadow:inset 0 1px 4px #0000001f;position:relative;overflow:hidden}.love-fill{position:absolute;inset:0;background:linear-gradient(120deg,#ff92c2,#ffa7d5);color:#fff;font-size:.9rem;font-weight:700;display:flex;align-items:center;justify-content:center}.primary-button{border:none;padding:12px 18px;border-radius:18px;background:linear-gradient(135deg,#ff7fb7,#ffb2d5);color:#fff;font-weight:600;font-size:1rem;cursor:pointer;box-shadow:0 15px 30px #ff92c259;transition:transform .2s ease}.primary-button:hover{transform:translateY(-2px)}.quiz-result{text-align:center;color:#5a3f66;line-height:1.5}.result-title{font-size:1.1rem;margin-bottom:8px}.note-text{color:#52345c;line-height:1.6;font-size:.95rem}.note-text p{margin:0 0 12px}.note-text blockquote{margin:12px 0;padding:16px;border-radius:18px;background:#ffd9ef99;font-size:1.2rem;font-weight:700;text-align:center}.note-sign{text-align:right;font-weight:600}.nav-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding-top:4px}.nav-button{border:none;border-radius:24px;padding:10px 8px;background:#fffc;color:#7b5a8e;display:flex;flex-direction:column;align-items:center;gap:4px;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.nav-button.active{background:linear-gradient(135deg,#ffb7d8,#e4cbff);color:#4b2f50;box-shadow:0 10px 20px #d596d866;transform:translateY(-4px)}.nav-icon{font-size:1.2rem}.nav-label{font-size:.75rem}@media(max-width:500px){body{padding:24px 10px}.phone-shell{border-radius:32px;padding:28px 16px 16px}.content-area{min-height:0}}