.web-project{position:relative;display:flex;align-items:stretch;gap:6px;min-width:0}.web-project .site-preview-trigger{position:relative;flex:1;min-width:0;display:grid;grid-template-columns:38px minmax(120px,1fr) minmax(125px,.8fr) auto;align-items:center;gap:12px;min-height:71px;padding:12px 16px;border:1px solid #ffffff20;border-radius:15px;text-align:left;color:inherit;background:linear-gradient(145deg,#ffffff12,#ffffff04);box-shadow:inset 0 1px #ffffff12;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:padding .25s,border-color .25s,background .25s,transform .25s}.web-project .site-preview-trigger:hover{padding-left:21px;border-color:#d8b96c80;background:linear-gradient(145deg,#ffffff1d,#bd86351a);transform:translateY(-1px)}.site-preview-trigger>span{font-size:9px;color:#c5a56b}.site-preview-trigger b{font-size:13px;font-weight:500}.site-preview-trigger small{font-size:10px;color:#9fa29a}.site-preview-trigger i{font-size:10px;font-style:normal;color:#c5a56b;white-space:nowrap;opacity:.78;transition:opacity .2s}.site-preview-trigger:hover i{opacity:1}.web-project .web-open{width:48px;min-width:48px;display:grid;place-items:center;border:1px solid #ffffff20;border-radius:15px;background:#ffffff09;color:#c5a56b;font-size:16px;transition:background .2s,border-color .2s}.web-project .web-open:hover{background:#bd86351a;border-color:#d8b96c80}.site-preview-dialog{width:min(1240px,calc(100vw - 32px));max-width:none;max-height:94svh;overflow:auto;margin:auto;padding:clamp(18px,3vw,32px);border:1px solid #d8b96c55;border-radius:26px;color:#f0eee8;background:radial-gradient(ellipse at 50% 0,#b08a4b1a,transparent 55%),linear-gradient(145deg,#202322f5,#111313fa);box-shadow:0 40px 140px #000b,inset 0 1px #ffffff18;backdrop-filter:blur(24px)}.site-preview-dialog::backdrop{background:#050606c9;backdrop-filter:blur(10px)}.preview-toolbar{display:flex;justify-content:space-between;align-items:center;gap:18px}.preview-site-name{display:flex;align-items:center;gap:15px;min-width:0}.preview-site-name>div{display:grid;gap:5px;min-width:0}.preview-site-name strong{font-size:15px;font-weight:600;letter-spacing:-.02em}.preview-site-name small{font-size:11px;color:#aaa99f}.preview-dots{display:flex;gap:5px}.preview-dots i{width:8px;height:8px;border-radius:50%;background:#d0ad6b}.preview-dots i:nth-child(2){opacity:.65}.preview-dots i:nth-child(3){opacity:.35}.preview-actions{display:flex;align-items:center;gap:14px}.preview-actions a,.preview-actions button{display:inline-flex;align-items:center;gap:8px;border:1px solid #ffffff24;border-radius:999px;padding:10px 14px;color:#e9e4d8;background:#ffffff08;font-size:11px;text-decoration:none;white-space:nowrap;transition:background .2s,border-color .2s}.preview-actions a span{color:#d6b878}.preview-actions a:hover,.preview-actions button:hover{border-color:#d6b87888;background:#c6a46620}.preview-actions button{font-family:inherit;cursor:pointer}.preview-actions button span{color:#d6b878;font-size:17px;line-height:.7}.preview-hint{display:flex;align-items:center;gap:9px;margin:22px 0 13px;color:#aaa99f;font-size:11px;line-height:1.6}.preview-hint span{font-size:17px;color:#d6b878}.preview-laptop{padding:0 0 19px;filter:drop-shadow(0 24px 30px #0008)}.preview-screen{position:relative;width:100%;height:min(68svh,760px);min-height:360px;padding:17px 17px 14px;border:1px solid #b59c6d;border-bottom-color:#665940;border-radius:22px 22px 13px 13px;background:linear-gradient(145deg,#272a29,#080909 60%,#222523);box-shadow:inset 0 1px #fff5,inset 0 0 0 2px #000,0 3px 0 #d3bb8c52;overflow:hidden}.preview-camera{position:absolute;top:6px;left:50%;width:4px;height:4px;border-radius:50%;background:#080a09;box-shadow:0 0 0 1px #62645c;z-index:1}.preview-screen iframe{display:block;width:100%;height:100%;border:0;border-radius:9px;background:#f3f1ec;overscroll-behavior:contain}.preview-base{position:relative;width:104%;height:19px;margin-left:-2%;border:1px solid #b59c6d;border-top:0;border-radius:0 0 45% 45% / 0 0 100% 100%;background:linear-gradient(180deg,#b8ad96 0,#44433d 18%,#171918 58%,#777365 86%,#b9a77f 100%);box-shadow:inset 0 1px #fff8,0 3px 6px #0008}.preview-base:after{content:"";position:absolute;top:0;left:43%;width:14%;height:5px;border-radius:0 0 7px 7px;background:linear-gradient(#161817,#4d4b43);box-shadow:0 1px #ffffff26}.preview-base span{position:absolute;inset:2px 15% auto;height:1px;background:#fff3}
@media(max-width:760px){.web-project{gap:5px}.web-project .site-preview-trigger{grid-template-columns:28px 1fr auto;gap:8px;min-height:68px;padding:10px 11px;border-radius:13px}.site-preview-trigger:hover{padding-left:11px!important}.site-preview-trigger b{font-size:12px}.site-preview-trigger small{grid-column:2;grid-row:2;font-size:9px}.site-preview-trigger i{font-size:0}.site-preview-trigger i:after{content:"Смотреть ↗";font-size:9px}.web-project .web-open{width:38px;min-width:38px;border-radius:12px}.site-preview-dialog{width:calc(100vw - 18px);max-height:96svh;padding:14px;border-radius:18px}.preview-toolbar{align-items:flex-start}.preview-site-name{gap:9px}.preview-site-name strong{font-size:12px}.preview-site-name small{font-size:9px}.preview-dots{gap:3px}.preview-dots i{width:6px;height:6px}.preview-actions{gap:6px}.preview-actions a,.preview-actions button{padding:8px 9px;font-size:9px}.preview-actions button{font-size:0}.preview-actions button span{font-size:19px}.preview-hint{align-items:flex-start;margin:15px 0 10px;font-size:10px}.preview-screen{height:68svh;min-height:320px;padding:13px 8px 8px;border-radius:15px 15px 9px 9px}.preview-screen iframe{border-radius:6px}.preview-base{height:13px;padding-bottom:12px}}
@media(prefers-reduced-motion:reduce){.web-project .site-preview-trigger,.web-project .web-open,.preview-actions a,.preview-actions button{transition:none}}
.web-project .web-open{min-height:0;padding:0;grid-template-columns:1fr;border-bottom:1px solid #ffffff20}.web-project .web-open:hover{padding-left:0}