#cc-app .phone-nav{display:flex;align-items:center;justify-content:center;width:44px;min-height:40px;padding:4px}
#cc-app .phone-nav svg{width:29px;height:29px}
.cc-phone[hidden],.cc-phone [hidden]{display:none!important}
.cc-phone,.cc-phone *{box-sizing:border-box}
.cc-phone{position:fixed;right:24px;top:80px;z-index:5000;width:350px;max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);overflow:auto;color:#fff;font:12px Arial,sans-serif;filter:drop-shadow(0 12px 18px #0009);border-radius:12px 12px 45px 45px}
.cc-phone button,.cc-phone a{-webkit-tap-highlight-color:transparent;touch-action:manipulation;font:inherit}
.cc-phone button:focus-visible,.cc-phone a:focus-visible{outline:2px solid #fff;outline-offset:2px}
.cc-phone-title{background:#353535;border:2px outset #aaa;display:flex;justify-content:space-between;align-items:center;padding:5px 7px;font:11px monospace;cursor:move;touch-action:none}
.cc-phone-title button{border:2px outset #ddd;background:#aaa;color:#111;cursor:pointer;padding:0 6px;font:bold 18px Arial;line-height:20px}
.cc-phone-shell{position:relative;padding:18px 19px 25px;background:linear-gradient(100deg,#1b0506,#780a11 5%,#bd1427 14%,#9c0614 50%,#b61a2a 85%,#41070c 97%,#100404);border:3px solid #1a090b;border-radius:35px 35px 50px 50px;box-shadow:inset 0 2px 2px #ff9da6,inset 0 -9px 14px #0009,0 0 0 1px #ae7b7f}
.cc-phone-speaker{width:80px;height:7px;margin:0 auto 9px;border-radius:8px;background:repeating-linear-gradient(90deg,#999 0 1px,#222 1px 3px);box-shadow:0 1px 0 #e46d72}
.cc-phone-brand{text-align:center;font:bold italic 17px Arial;letter-spacing:-.4px;margin-bottom:12px;text-shadow:0 1px 1px #460000}
.cc-phone-screen{position:relative;height:292px;overflow:hidden;background:#173344 url('phone/studio-wallpaper.jpg') center/cover;border:4px solid #210a0c;box-shadow:0 0 0 1px #ef7780,inset 0 0 5px #000;font-family:Arial,sans-serif;color:white}
.cc-phone-status{height:24px;display:flex;align-items:center;justify-content:space-between;padding:0 7px;background:#07131a88;font-size:10px;text-shadow:0 1px #000}
.cc-phone-home{height:calc(100% - 24px);padding:8px 10px;background:linear-gradient(#0000,#0004)}
.cc-phone-clock{font:32px/1 Arial;text-shadow:0 1px 3px #000;margin:4px 0 3px}
.cc-phone-date{font-size:10px;text-shadow:0 1px 2px #000;margin-bottom:15px}
.cc-phone-apps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px 6px}
.cc-phone-app{color:#fff;text-decoration:none;text-align:center;background:transparent;border:0;padding:0;min-width:0;cursor:pointer;text-shadow:0 1px 2px #000;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:9px!important}
.cc-phone-app-icon{display:flex;align-items:center;justify-content:center;width:39px;height:37px;border:1px solid #ffffffb0;border-radius:7px;background:linear-gradient(#536770dd,#162735ee);box-shadow:inset 0 1px 1px #fff8,0 2px 2px #0008;font:bold 25px Georgia,serif;color:#fff}
.cc-phone-app-icon svg{width:25px;height:25px;display:block}
.cc-phone-app:hover .cc-phone-app-icon,.cc-phone-app:focus-visible .cc-phone-app-icon{background:linear-gradient(#9ca4a9,#3a505e)}
.cc-phone-app[data-app=pacman] .cc-phone-app-icon{color:#ffd82d;background:#101223}
.cc-phone-controls{display:grid;grid-template-columns:1fr 1fr 88px 1fr 1fr;align-items:center;gap:4px;margin:12px 0}
.cc-phone-controls>button{cursor:pointer;background:transparent;border:0;color:#fff;font:bold 22px Arial;padding:8px 0;text-shadow:0 1px 2px #400}
.cc-phone-controls>button:first-child{color:#a0d945}.cc-phone-controls>button:last-child{color:#ff4f57}
.cc-phone-pad{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:20px 25px 20px;gap:0}
.cc-phone-pad button{border:1px solid #591019;background:linear-gradient(#b43541,#7b0813);color:#eee;cursor:pointer;padding:0;font:bold 12px Arial;box-shadow:inset 0 1px #dc6770}
.cc-phone-pad button:nth-child(1){grid-column:2}.cc-phone-pad button:nth-child(2){grid-row:2;grid-column:1}.cc-phone-pad button:nth-child(3){grid-row:2;grid-column:2;background:linear-gradient(135deg,#88938e,#101a19 45%,#050a09);border:2px solid #d1d3cb;border-radius:6px}.cc-phone-pad button:nth-child(4){grid-row:2;grid-column:3}.cc-phone-pad button:nth-child(5){grid-row:3;grid-column:2}
.cc-phone-keyboard{border-top:2px solid #43060d;padding-top:8px;display:flex;flex-direction:column;gap:4px}
.cc-phone-keyrow{display:flex;gap:3px;justify-content:center}
.cc-phone-keyrow button{min-width:0;flex:1;border:2px solid #3a0309;border-top-color:#ed6f78;border-radius:6px 6px 9px 9px;background:linear-gradient(120deg,#d55260,#a5192a 35%,#740916);box-shadow:inset 0 -2px 2px #4007,0 1px 0 #d85862;color:#fff;cursor:pointer;padding:4px 0;font:bold 12px Arial;line-height:19px;transform:rotate(-3deg)}
.cc-phone-keyrow:nth-child(2){padding:0 5px}.cc-phone-keyrow:nth-child(3){padding:0 15px}.cc-phone-keyrow:nth-child(4){padding:0 35px}.cc-phone-keyrow button:active{filter:brightness(.75);transform:translateY(1px)}
.cc-phone-keyrow button small{display:block;height:7px;font:7px Arial;color:#f9c6cb;line-height:7px}
.cc-phone-keyrow .cc-phone-space{flex:3}
.cc-phone-game{position:absolute;inset:24px 0 0;background:#080b16;display:flex;flex-direction:column;align-items:center;justify-content:center}
.cc-phone-game-head{width:100%;display:flex;justify-content:space-between;font:10px monospace;padding:3px 9px;color:#ffdc30}
.cc-phone-game canvas{display:block;width:224px;height:224px;max-width:100%;image-rendering:pixelated;touch-action:none}
.cc-phone-game-note{position:absolute;inset:68px 14px auto;text-align:center;background:#080b16ee;border:1px solid #bc252f;padding:16px 8px;color:#fff;font:12px/1.5 monospace}
.cc-phone-game-note button{background:#ad1422;border:2px outset #e26e78;color:#fff;cursor:pointer;padding:6px 14px;margin-top:10px}
.cc-phone-map{position:absolute;inset:24px 0 0;display:flex;flex-direction:column;background:#aaa;color:#111}
.cc-phone-map iframe{width:100%;flex:1;min-height:0;border:0;filter:grayscale(1) contrast(1.15)}
.cc-phone-map p{font:10px/1.4 monospace;padding:6px;margin:0}.cc-phone-map a{color:#111}
.cc-phone-hint{text-align:center;font:9px monospace;color:#facbd0;margin:10px 0 0}
@media(max-width:650px){#cc-app .phone-nav{width:36px}.cc-phone{right:8px;top:8px;width:330px}.cc-phone-shell{padding-top:13px;padding-bottom:18px}.cc-phone-screen{height:280px}.cc-phone-controls{margin:8px 0}.cc-phone-brand{margin-bottom:8px}.cc-phone-keyrow button{padding:3px 0}}
@media(max-height:760px){.cc-phone{top:8px}.cc-phone-shell{padding:10px 16px 14px}.cc-phone-speaker{height:4px;margin-bottom:5px}.cc-phone-brand{font-size:14px;margin-bottom:7px}.cc-phone-screen{height:270px}.cc-phone-controls{margin:6px 0}.cc-phone-keyrow button{padding:2px 0;line-height:16px}.cc-phone-hint{margin-top:6px}.cc-phone-keyboard{gap:3px;padding-top:5px}}
/* CeroPhone: carcasa curva, teclas alineadas y símbolos serigrafiados. */
.cc-phone-shell{padding:22px 20px 30px;border:4px solid #23090e;border-radius:44% 44% 27% 27% / 9% 9% 13% 13%;background:radial-gradient(ellipse at 50% -3%,#ff7280 0,transparent 19%),linear-gradient(93deg,#30080e 0,#9c0018 5%,#d71730 12%,#ae061d 40%,#b50922 75%,#780517 94%,#21090e 100%);box-shadow:inset 0 4px 2px #f67e8c,inset 0 11px 0 #3b020b,inset 0 13px 2px #e04d60,inset 4px 0 3px #ed3e55,inset -5px 0 4px #36020d,inset 0 -15px 15px #140207,0 0 0 1px #837074}
.cc-phone-speaker{width:82px;background:radial-gradient(#141414 35%,transparent 40%) 0 0/3px 3px,#b7bbb4;height:8px;border:1px solid #676b65;border-radius:0 0 10px 10px;margin-bottom:11px}
.cc-phone-brand{display:flex;align-items:center;justify-content:center;gap:2px;font:italic 700 21px Arial,Helvetica,sans-serif;letter-spacing:-1px;margin:0 0 18px;text-shadow:0 1px 1px #5a0010}
.cc-phone-brand>svg{width:25px;height:24px;transform:skew(-8deg)}
.cc-phone-screen{border-width:3px;border-color:#5b1521;box-shadow:0 0 0 1px #e36073,inset 0 0 5px #000}
.cc-phone-apps{gap:12px 6px}
.cc-phone-app-icon{width:42px;height:41px;border:0;border-radius:4px;background:linear-gradient(#ffffff12,#07151b60);box-shadow:inset 0 1px #ffffff35,0 1px 2px #0005}
.cc-phone-app-icon svg{width:35px;height:35px;filter:drop-shadow(0 2px 1px #0008)}
.cc-phone-app[data-app=pacman] .cc-phone-app-icon{background:linear-gradient(#ffffff12,#07151b60)}
.cc-phone-controls{grid-template-columns:1fr 1fr 78px 1fr 1fr;gap:0;margin:9px -4px 7px;min-height:68px;border-bottom:2px solid #520711;border-radius:0 0 45% 45% / 0 0 18% 18%;box-shadow:0 1px #ed4054,inset 0 -5px 8px #57021055}
.cc-phone-controls>button{display:flex;align-items:center;justify-content:center;border-right:1px solid #57020e;border-left:1px solid #df304733;height:42px;padding:8px;color:#f6e5e4}
.cc-phone-controls>button:first-child{color:#b1d765;border-left:0}.cc-phone-controls>button:last-child{color:#ef3549;border-right:0}
.cc-phone-controls>button svg{width:25px;height:25px;filter:drop-shadow(0 1px #680310)}
.cc-phone-controls>button:active{background:#65061966;box-shadow:inset 0 2px 5px #39010d}
.cc-phone-pad{grid-template-rows:16px 32px 16px;grid-template-columns:23px 32px 23px}
.cc-phone-pad button{background:transparent;border:0;box-shadow:none;display:flex;align-items:center;justify-content:center;color:#d55364}
.cc-phone-pad button svg{width:17px;height:17px;filter:drop-shadow(0 1px #650310)}
.cc-phone-pad button:nth-child(3){background:#c1c6bf;border:1px solid #f2f3e8;border-radius:9px;padding:3px;box-shadow:0 2px 2px #3c0209}
.cc-phone-trackpad{width:100%;height:100%;display:block;border-radius:5px;background:linear-gradient(135deg,#41504e 0,#0d1719 34%,#020707 60%,#1c2729);border:1px solid #53625e;box-shadow:inset 0 1px #ffffff33}
.cc-phone-keyboard{border-top:0;padding:4px 0 0;gap:4px}
.cc-phone-keyrow button{transform:none;border-radius:7px 7px 9px 9px;background:linear-gradient(125deg,#dd6375 0,#ba263f 16%,#a00e2a 55%,#590616);border:2px solid #41020c;border-top-color:#e35c72;box-shadow:inset 0 1px 1px #f0919c,inset 0 -2px 3px #50010c,0 1px #d0354c;padding:3px 0}
.cc-phone-keyrow button:active{transform:translateY(1px)}
.cc-phone-keyrow button small{font-size:9px;height:8px;line-height:8px;color:#ffdcdf}
.cc-phone-keyrow:nth-child(2){padding:0 5px}.cc-phone-keyrow:nth-child(3){padding:0 12px}.cc-phone-keyrow:nth-child(4){padding:0 28px}
@media(max-width:650px){.cc-phone{width:330px}.cc-phone-shell{padding:18px 18px 25px}.cc-phone-brand{font-size:20px;margin-bottom:13px}}
@media(max-height:760px){.cc-phone-shell{padding:15px 18px 21px}.cc-phone-speaker{margin-bottom:6px;height:6px}.cc-phone-brand{font-size:18px;margin-bottom:10px}.cc-phone-screen{height:270px}.cc-phone-controls{margin-top:5px;margin-bottom:5px}.cc-phone-keyrow button{padding:1px 0;line-height:16px}.cc-phone-keyboard{gap:3px}}
/* Controles táctiles y selección común a todas las aplicaciones. */
.cc-phone-pad button,.cc-phone-keyrow button{touch-action:none;user-select:none;-webkit-user-select:none}
.cc-phone-pad button svg{pointer-events:none}
.cc-phone-pad button:active{background:#4f051c66}
.cc-phone-app:hover .cc-phone-app-icon,.cc-phone-app:focus-visible .cc-phone-app-icon,.cc-phone-app[data-app=pacman]:hover .cc-phone-app-icon,.cc-phone-app[data-app=pacman]:focus-visible .cc-phone-app-icon{background:linear-gradient(#9ca4a9,#3a505e);box-shadow:inset 0 1px #fff8,0 0 0 1px #d1e2e4,0 2px 3px #0008}
.cc-phone-social,.cc-phone-mail{position:absolute;inset:24px 0 0;overflow-y:auto;background:#d9d9d2;color:#171717;overscroll-behavior:contain}
.cc-social-banner{height:62px;background:url('phone/studio-wallpaper.jpg') center 68%/cover;border-bottom:2px solid #666}
.cc-social-heading{display:flex;gap:8px;align-items:center;padding:8px 12px 0}.cc-social-heading h2{font:bold 17px Arial;margin:0}
.cc-phone-social>strong{display:block;padding:5px 12px;font:13px monospace}.cc-phone-social>p{font:12px/1.5 Arial;padding:0 12px;margin:4px 0 10px}
.cc-social-open{display:block;margin:0 12px 12px;background:#a41827;border:2px outset #d96570;color:#fff;text-decoration:none;text-align:center;padding:9px;font:bold 12px Arial!important}
.cc-phone-mail{padding:10px}.cc-phone-mail h2{font:bold 14px monospace;margin:0 0 10px;border-bottom:1px solid #888;padding-bottom:7px}
.cc-phone-contact-form{display:flex;flex-direction:column;gap:9px}.cc-phone-contact-form label{display:flex;flex-direction:column;gap:3px;font:11px monospace}
.cc-phone-contact-form input:not([type=hidden]),.cc-phone-contact-form textarea{display:block;width:100%;min-width:0;border:2px inset #aaa;background:#f8f8f1;color:#111;border-radius:0;font:16px Arial;padding:5px}
.cc-phone-contact-form textarea{min-height:78px;resize:vertical}.cc-phone-contact-form button{border:2px outset #d96570;background:#a41827;color:#fff;font:bold 12px monospace;padding:8px;cursor:pointer}
.cc-phone-social{overflow:hidden;background:#fff}.cc-phone-social-frame{display:block;width:100%;height:100%;border:0;background:#fff}
/* Mail compacto: todos los campos y Enviar dentro de la pantalla. */
.cc-phone-mail{padding:6px 8px;background:#c8c9c4}
.cc-phone-mail h2{font:bold 12px monospace;margin:0 0 6px;padding:3px 0 5px;border-bottom:2px groove #eee}
.cc-phone-contact-form{gap:5px}
.cc-phone-contact-form label{font:10px/1.1 monospace;gap:2px;margin:0}
.cc-phone-contact-form input:not([type=hidden]){height:27px;padding:3px 5px;font-size:16px}
.cc-phone-contact-form textarea{height:48px;min-height:48px;max-height:80px;padding:4px 5px;resize:none;font-size:16px}
.cc-phone-contact-form button{padding:5px;min-height:27px;font:bold 11px monospace}
.cc-phone-email-link{display:flex;align-items:center;gap:8px;padding:12px 4px;color:#171717;font:11px Arial!important;text-decoration:underline;overflow-wrap:anywhere}
.cc-phone-email-icon{width:30px;height:30px;flex:0 0 30px}.cc-phone-email-icon svg{width:100%;height:100%}
.cc-phone-email-link:hover{background:#eeeee8}.cc-phone-email-link:focus-visible{outline-color:#8d1420}
.cc-phone-mail .cc-phone-email-link{padding:3px 0 7px;margin-bottom:5px;border-bottom:1px solid #aaa;gap:5px;font-size:10px!important}
.cc-phone-mail .cc-phone-email-icon{width:21px;height:21px;flex-basis:21px}
.cc-phone-mail h2{margin-bottom:3px;padding-bottom:3px}
.cc-phone-mail .cc-phone-contact-form{gap:4px}
.cc-phone-mail .cc-phone-contact-form textarea{height:38px;min-height:38px}
.cc-phone-mail-open .cc-phone-keyboard{opacity:.4}
.cc-phone-keyrow button:disabled{cursor:default;filter:saturate(.45);transform:none;pointer-events:none}
