.recommend-floating-button{right:20px;bottom:calc(20px + env(safe-area-inset-bottom));z-index:900;color:#fff;cursor:pointer;background:#111827;border:1px solid #ffffffb3;border-radius:999px;align-items:center;gap:9px;min-height:48px;padding:0 17px;font-size:14px;font-weight:600;transition:transform .18s,box-shadow .18s;display:flex;position:fixed;box-shadow:0 8px 24px #0000002e}.recommend-floating-button:hover{transform:translateY(-2px);box-shadow:0 12px 28px #00000038}.recommend-floating-button:active{transform:scale(.97)}.recommend-floating-icon{justify-content:center;align-items:center;width:24px;height:24px;font-size:17px;display:flex}.recommend-floating-text{white-space:nowrap}.recommend-modal-overlay{z-index:2000;padding:20px 20px calc(20px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-sizing:border-box;background:#00000073;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.recommend-modal{box-sizing:border-box;background:#fff;border:1px solid #e5e7eb;border-radius:24px;width:100%;max-width:460px;max-height:min(700px,100dvh - 40px);padding:32px;position:relative;overflow-y:auto;box-shadow:0 24px 70px #00000038}.recommend-close{color:#374151;cursor:pointer;background:#f3f4f6;border:none;border-radius:50%;width:38px;height:38px;font-size:25px;line-height:1;position:absolute;top:14px;right:14px}.recommend-close:hover{background:#e5e7eb}.recommend-modal-icon,.recommend-success-icon{color:#111827;background:#f3f4f6;border-radius:17px;justify-content:center;align-items:center;width:54px;height:54px;margin-bottom:18px;font-size:24px;display:flex}.recommend-success-icon{color:#059669;background:#ecfdf5;font-size:25px}.recommend-modal h2{color:#111827;margin:0 40px 10px 0;font-size:23px;line-height:1.25}.recommend-description{color:#6b7280;margin:0 0 24px;font-size:14px;line-height:1.55}.recommend-label{color:#374151;margin-bottom:8px;font-size:13px;font-weight:600;display:block}.recommend-input{color:#111827;box-sizing:border-box;background:#fff;border:1px solid #d1d5db;border-radius:14px;outline:none;width:100%;height:50px;padding:0 15px;font-size:15px}.recommend-input:focus{border-color:#9ca3af;box-shadow:0 0 0 3px #1118270f}.recommend-error{color:#b91c1c;background:#fef2f2;border-radius:10px;margin-top:12px;padding:10px 12px;font-size:13px;line-height:1.4}.recommend-primary-button,.recommend-secondary-button{cursor:pointer;box-sizing:border-box;border-radius:14px;min-height:48px;padding:0 18px;font-size:14px;font-weight:600}.recommend-primary-button{color:#fff;background:#111827;border:none;width:100%;margin-top:16px}.recommend-primary-button:hover{background:#1f2937}.recommend-primary-button:disabled{opacity:.5;cursor:not-allowed}.recommend-secondary-button{color:#374151;background:#fff;border:1px solid #d1d5db;flex:1}.recommend-secondary-button:hover{background:#f9fafb}.recommend-actions{gap:10px;margin-top:16px;display:flex}.recommend-actions .recommend-primary-button{flex:1.5;margin-top:0}.recommend-channel-card{background:#f9fafb;border:1px solid #e5e7eb;border-radius:18px;align-items:center;gap:15px;margin-top:24px;padding:15px;display:flex}.recommend-channel-image{object-fit:cover;border-radius:50%;flex:0 0 64px;width:64px;height:64px}.recommend-channel-info{min-width:0}.recommend-channel-name{color:#111827;text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:700;overflow:hidden}.recommend-channel-subs{color:#6b7280;margin-top:5px;font-size:13px}@media (max-width:600px){.recommend-floating-button{right:14px;bottom:calc(14px + env(safe-area-inset-bottom));justify-content:center;width:48px;height:48px;min-height:48px;padding:0}.recommend-floating-icon{width:100%;height:100%}.recommend-floating-text{display:none}.recommend-modal-overlay{align-items:flex-end;padding:0}.recommend-modal{border-radius:24px 24px 0 0;max-width:none;max-height:calc(100dvh - 10px);padding:28px 20px 24px}.recommend-modal h2{font-size:21px}.recommend-actions{gap:8px}}@media (max-width:360px){.recommend-modal{padding-left:16px;padding-right:16px}.recommend-actions{flex-direction:column-reverse}.recommend-actions .recommend-primary-button,.recommend-secondary-button{width:100%;min-height:48px}}