/* Instagram benzeri tam ekran Reels oynatıcı */
.reels-page{position:relative;height:100vh;max-width:none;padding:0;background:#05070b}
.reels-head{position:fixed;top:16px;right:28px;z-index:8;margin:0}
.reels-back-button{position:fixed;top:16px;left:18px;width:96px;height:44px;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:22px;color:#fff;background:#111827aa;font-size:14px;font-weight:700;text-shadow:0 1px 4px #000;backdrop-filter:blur(5px)}
.reels-back-button svg{width:27px;height:27px;stroke-width:2.4}
.reel-create-button{width:52px;height:52px;display:flex;align-items:center;justify-content:center;padding:0;border-radius:50%;color:#fff;background:#1877f2;font-size:0;box-shadow:0 8px 25px #0008}
.reel-create-button svg{width:27px;height:27px}
.reels-feed{height:100%;display:flex;flex-direction:column;gap:0;overflow-y:auto;scroll-snap-type:y mandatory;scrollbar-width:none}
.reels-feed::-webkit-scrollbar{display:none}
.reel-slide{position:relative;height:100vh;min-height:100vh;scroll-snap-align:start;scroll-snap-stop:always;border:0;border-radius:0;background:#05070b;box-shadow:none}
.reel-video-wrap{position:relative;height:100%;background:#05070b}
.reel-video{display:block;width:100%;height:100%;min-height:0;object-fit:contain;background:#05070b;cursor:pointer}
.reel-card .reel-video::-webkit-media-controls,.reel-card .reel-video::-webkit-media-controls-enclosure{display:none!important}
.reel-progress{position:absolute;right:20px;bottom:18px;left:20px;height:3px;z-index:5;border-radius:5px;background:#ffffff55;cursor:pointer}
.reel-progress span{display:block;width:0;height:100%;border-radius:5px;background:#fff}
.reel-side-actions{position:absolute;right:18px;bottom:72px;z-index:6;display:flex;flex-direction:column;align-items:center;gap:17px}
.reel-side-actions form{display:flex}
.reel-side-action{display:flex;flex-direction:column;align-items:center;gap:3px;padding:0;color:#fff;background:transparent;text-shadow:0 1px 4px #000;font-size:12px}
.reel-side-action svg{width:28px;height:28px;stroke-width:2.2}.reel-side-action.liked{color:#ff2f5c}
.reel-side-action:hover{color:#fff}.reel-side-action.liked:hover{color:#ff2f5c}
.reel-bottom-info{position:absolute;right:80px;bottom:35px;left:22px;z-index:5;max-width:min(680px,calc(100% - 150px));color:#fff;text-shadow:0 1px 5px #000}
.reel-bottom-info .reel-author{display:flex;align-items:center;gap:10px;padding:0}.reel-bottom-info .reel-author>div{display:flex;flex-direction:column;gap:4px;min-width:0}
.reel-bottom-info .reel-author strong{font-size:15px}.reel-bottom-info .reel-author span{color:#fff;font-size:12px}.reel-bottom-info .avatar{width:38px;height:38px}
.reel-quality-label{color:#fff;font-size:10px;font-weight:800}.reel-follow-button{padding:7px 11px;border:1px solid #fff;border-radius:7px;color:#fff;background:#0005;font-size:12px;font-weight:700}
.reel-bottom-info .reel-copy{margin:0;padding:9px 0 0;font-size:14px;line-height:1.4}.reel-tap-hint{position:absolute;top:18px;left:50%;z-index:7;display:none;transform:translateX(-50%);padding:6px 10px;border-radius:14px;color:#fff;background:#0008;font-size:11px}.reel-tap-hint.is-visible{display:block}
.reel-pause-indicator{position:absolute;top:50%;left:50%;z-index:7;display:grid;place-items:center;width:58px;height:58px;transform:translate(-50%,-50%);border-radius:50%;color:#fff;background:#0008}.reel-pause-indicator[hidden]{display:none}.reel-pause-indicator svg{width:26px;height:26px}
.reels-empty{height:auto;margin:40px auto;max-width:500px;background:#fff}
.page-Reels .topbar,.page-Reels .sidebar,.page-Reels .mobile-nav{display:none}.page-Reels .workspace{padding-top:0}.page-Reels .app-shell{display:block}
.reel-modal{position:fixed;inset:0;z-index:160;display:grid;place-items:center;padding:20px}.reel-modal[hidden]{display:none}.reel-modal-backdrop{position:absolute;inset:0;background:#11182799;backdrop-filter:blur(3px)}
.reel-modal-dialog{position:relative;z-index:1;width:min(560px,100%);max-height:calc(100vh - 40px);overflow:auto;border-radius:18px;background:#fff;box-shadow:0 24px 80px #11182755}.reel-modal-header{display:flex;align-items:center;justify-content:space-between;padding:17px 20px;border-bottom:1px solid #edf0f4}.reel-modal-header h2{margin:0;font-size:18px}.reel-modal-header .modal-close{position:static;width:34px;height:34px;border-radius:50%;color:#4b5563;background:#eef1f5;font-size:24px}
.reel-upload-form{display:flex;flex-direction:column;gap:14px;padding:20px}.reel-upload-form textarea{width:100%;min-height:100px;padding:13px;border:1px solid #dfe3e9;border-radius:11px;resize:vertical;outline:0}.reel-upload-form textarea:focus{border-color:#1877f2;box-shadow:0 0 0 3px #1877f21c}.reel-file-picker{display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center;padding:15px;border:1px dashed #b9c2d0;border-radius:12px;color:#1877f2;cursor:pointer}.reel-file-picker svg{grid-row:span 2;width:25px;height:25px}.reel-file-picker span{font-weight:700}.reel-file-picker small{margin-top:4px;color:#7c8794}.reel-file-picker input{display:none}.reel-upload-preview{position:relative;border-radius:11px;overflow:hidden;background:#10131a}.reel-upload-preview video{display:block;width:100%;height:250px;object-fit:contain}.reel-upload-preview>span{position:absolute;top:9px;left:9px;padding:4px 7px;border-radius:6px;color:#1877f2;background:#eaf3ff;font-size:11px;font-weight:800}.reel-upload-note{margin:0;color:#77808c;font-size:12px}.modal-open{overflow:hidden}
@media(max-width:860px){.reels-page,.reel-slide{height:100dvh;min-height:100dvh}.reel-video{object-fit:contain!important}.reels-head{top:16px;right:16px}.reels-back-button{top:14px;left:14px;width:92px;height:42px}.reel-bottom-info{right:74px;bottom:38px;left:16px;max-width:calc(100% - 116px)}.reel-side-actions{right:13px;bottom:76px;gap:19px}.reel-side-action svg{width:29px;height:29px}.reel-progress{right:12px;bottom:14px;left:12px}.reel-create-button{width:50px;height:50px}}
@media(max-width:600px){.reels-head{top:13px;right:13px}.reel-bottom-info{bottom:34px;left:13px}.reel-bottom-info .reel-copy{font-size:13px}.reel-follow-button{padding:6px 9px}.reel-side-actions{right:10px;bottom:72px;gap:16px}.reel-side-action svg{width:27px;height:27px}.reel-progress{bottom:11px}.reel-tap-hint{top:18px}.reel-modal{padding:0}.reel-modal-dialog{width:100vw;height:100dvh;max-height:none;border-radius:0}.reel-upload-form{padding:16px}.reel-upload-preview video{height:220px}}
.reel-feed-toggle{display:flex;align-items:flex-start;gap:11px;padding:12px 13px;border:1px solid #e5e9ef;border-radius:11px;color:#303746;background:#f8fafc;cursor:pointer}.reel-feed-toggle input{position:absolute;opacity:0;pointer-events:none}.reel-feed-toggle-mark{position:relative;flex:0 0 21px;width:21px;height:21px;margin-top:1px;border:2px solid #aeb8c6;border-radius:6px;background:#fff}.reel-feed-toggle input:checked+.reel-feed-toggle-mark{border-color:#1877f2;background:#1877f2}.reel-feed-toggle input:checked+.reel-feed-toggle-mark:after{content:'✓';position:absolute;top:-3px;left:3px;color:#fff;font-size:16px;font-weight:800}.reel-feed-toggle>span:last-child{display:flex;flex-direction:column;gap:4px}.reel-feed-toggle strong{font-size:13px}.reel-feed-toggle small{color:#7b8592;font-size:11px;line-height:1.35}
/* Reel upload progress */
.reel-upload-status{padding:12px 13px;border:1px solid #dfe5ee;border-radius:11px;background:#f8fafc}
.reel-upload-status[hidden]{display:none}
.reel-upload-status-row{display:flex;align-items:center;gap:8px;color:#333b48;font-size:12px}
.reel-upload-status-row strong{flex:1;font-size:13px}
.reel-upload-status-row>span:last-child{color:#1877f2;font-weight:800}
.reel-upload-status .upload-spinner{width:14px;height:14px;border:2px solid #cbd5e1;border-top-color:#1877f2;border-radius:50%;animation:reelUploadSpin .8s linear infinite}
.reel-upload-progress{height:7px;margin-top:10px;overflow:hidden;border-radius:999px;background:#e3e8f0}
.reel-upload-progress span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#1877f2,#64a4ff);transition:width .18s ease}
.reel-upload-status small{display:block;margin-top:7px;color:#7a8592;font-size:11px}
.reel-upload-status.is-error{border-color:#f3b6c1;background:#fff4f6}
.reel-upload-status.is-error .reel-upload-progress span{background:#df3458}
[data-reel-submit]:disabled{cursor:wait;opacity:.72}
@keyframes reelUploadSpin{to{transform:rotate(360deg)}}

.reel-owner-menu{position:absolute;right:16px;bottom:38px;z-index:8}
.reel-owner-menu-button{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;color:#fff;background:#111827aa;text-shadow:0 1px 4px #000;backdrop-filter:blur(5px)}
.reel-owner-menu-button svg{width:22px;height:22px}
.reel-owner-menu-panel{position:absolute;right:0;bottom:46px;min-width:145px;padding:5px;border:1px solid #ffffff2b;border-radius:11px;background:#151922f2;box-shadow:0 10px 28px #0008}
.reel-owner-menu-panel[hidden]{display:none}
.reel-owner-menu-panel form,.reel-owner-menu-panel button{width:100%}
.reel-owner-menu-panel button{display:flex;align-items:center;gap:8px;padding:10px 11px;border-radius:8px;color:#ff9cac;background:transparent;text-align:left;font-size:13px;font-weight:700}
.reel-owner-menu-panel button:hover{background:#ffffff16}
.reel-owner-menu-panel svg{width:17px;height:17px}
.reel-follow-form{display:flex}
.reel-follow-form .reel-follow-button{cursor:pointer}

.reel-comments-modal{position:fixed;inset:0;z-index:170;display:grid;place-items:center;padding:20px}
.reel-comments-modal[hidden]{display:none}
.reel-comments-backdrop{position:absolute;inset:0;background:#080b12b8;backdrop-filter:blur(4px)}
.reel-comments-dialog{position:relative;z-index:1;width:min(560px,100%);height:min(650px,calc(100vh - 40px));display:flex;flex-direction:column;overflow:hidden;border-radius:18px;background:#fff;box-shadow:0 24px 80px #0008}
.reel-comments-header{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid #edf0f4}
.reel-comments-header h2{margin:0;color:#161b2a;font-size:18px}
.reel-comments-header .modal-close{position:static;width:34px;height:34px;border-radius:50%;color:#4b5563;background:#eef1f5;font-size:24px}
.reel-comments-list{flex:1;min-height:0;overflow-y:auto;padding:8px 18px}
.reel-comments-empty{margin:0;padding:45px 10px;color:#7d8796;text-align:center;font-size:13px}
.reel-comment-item{display:flex;align-items:flex-start;gap:10px;padding:13px 0;border-bottom:1px solid #edf0f4}
.reel-comment-item .avatar{width:38px;height:38px}
.reel-comment-content{min-width:0;flex:1}
.reel-comment-content strong{display:block;color:#222838;font-size:13px}
.reel-comment-content p{margin:5px 0 5px;color:#343b49;font-size:13px;line-height:1.4;white-space:pre-wrap;word-break:break-word}
.reel-comment-content small{color:#8a93a0;font-size:11px}
.reel-comment-form{display:flex;align-items:center;gap:9px;padding:11px 15px;border-top:1px solid #edf0f4;background:#fff}
.reel-comment-form .avatar{width:34px;height:34px}
.reel-comment-form textarea{min-width:0;flex:1;height:38px;max-height:90px;padding:10px 12px;border:1px solid #dfe4eb;border-radius:19px;outline:0;resize:vertical;color:#202638;font-size:12px}
.reel-comment-form textarea:focus{border-color:#1877f2;box-shadow:0 0 0 3px #1877f21a}
.reel-comment-form button{padding:9px 12px;border-radius:9px;color:#fff;background:#1877f2;font-size:12px;font-weight:700}
.reel-comment-form button:disabled{cursor:wait;opacity:.65}
.reel-comment-error{margin:0;padding:0 18px 10px;color:#d72f4e;font-size:12px}
.reel-comment-error[hidden]{display:none}
@media(max-width:600px){.reel-owner-menu{right:10px;bottom:35px}.reel-comments-modal{align-items:end;padding:0}.reel-comments-dialog{width:100vw;height:min(78dvh,650px);border-radius:18px 18px 0 0}.reel-comments-list{padding-left:15px;padding-right:15px}}
